var AGUAClass = new Class({

	initialize: function() {
	
		this.SwatchOptions = {
			'LargeImage' : '',
			'LargeImage100' : ''
		}
		
		this.ValidateInitialize();

		window.addEvent("domready",function(){
			this.subMenuInit();	
			this.ClearText();
			this.ajaxLoaderIconInit();
			this.productShippingInit();

		}.bind(this));

	},
	
	productShippingInit : function() {
	
		// SImple product shipping hide show
		var strSameShippingAsBilling = $('strSameShippingAsBilling');
		
		if(strSameShippingAsBilling) {
			var shippingDetails = $('shipping_details');
			
			if(strSameShippingAsBilling.checked) {
				shippingDetails.setStyle('opacity', 0.2);
				//shippingDetails.getElements('input').disabled=true;
				//shippingDetails.getElements('select').disabled=true;
			}
			
			strSameShippingAsBilling.addEvent('click', function() {
				if(strSameShippingAsBilling.checked) {
					shippingDetails.setStyle('opacity', 0.2);
				} else {
					shippingDetails.setStyle('opacity', 1);
				}
			});
		}
	
	},
	
	ajaxLoaderIconInit : function() {
				
		var ajaxLoaderIcon = new Element('div', { 'styles' : {
			'background' : 'url(/img/ajax_load.gif)',
			'width' : '43px',
			'height' : '11px',
			'top' : '0',
			'left' : '0',
			'display' : 'none',
			'opacity' : 0,
			'position' : 'absolute'
		}});
			
		ajaxLoaderIcon.injectInside($$('body')[0]);
		
		this.ajaxLoaderShow = function(x, y, z) {
			if(z!=0)ajaxLoaderIcon.setStyle('z-index', z);
			if(x!=0)ajaxLoaderIcon.setStyle('left', x+'px');
			if(y!=0)ajaxLoaderIcon.setStyle('top', y+'px');
			ajaxLoaderIcon.setStyle('display', 'block');
			ajaxLoaderIcon.fade(1);
		};
		
		this.ajaxLoaderHide = function() {
			ajaxLoaderIcon.fade(0);
			(function() { ajaxLoaderIcon.setStyle('display', 'block'); }).delay(1500);
		};
	
	},
	
	subMenuInit : function() {
	
		$$('#side_menu ul li.level1').each(function(MenuItem) {
		
			MenuItem.setStyle('cursor', 'pointer');
			MenuItem.addEvent('click', function(e) {
				var eve = new Event(e);
				
				if ($(eve.target).getParent('li') == MenuItem) {
					if(!MenuItem.hasClass('current')) {
						MenuItem.addClass('current');
					} else {
						MenuItem.removeClass('current');
					}
				}
			});	
			
			if(MenuItem.getElement('ul')) {
				if(MenuItem.getElement('a')) {
					MenuItem.getElement('a').addEvent('click', function(e) {
						var ev = new Event(e);
						ev.stop();
						
						if(!MenuItem.hasClass('current')) {
							MenuItem.addClass('current');
						} else {
							MenuItem.removeClass('current');
						}
					});
				}	
			}
				
		});
		
		$$('#side_menu ul li.level2').each(function(MenuItem) {
			
			var DescriptionBox = MenuItem.getElement('div[class=description]')
			var SubMenuLevel3 = MenuItem.getElement('ul')
			
			MenuItem.setStyle('cursor', 'pointer');
			MenuItem.addEvents({
				'mouseover' : function() {
					if ((DescriptionBox) && (!MenuItem.hasClass('current'))) {
						DescriptionBox.setStyle('display', 'block');		
						DescriptionBox.setStyle('top', MenuItem.getPosition().y);
						DescriptionBox.setStyle('left', MenuItem.getPosition().x+160);
					}			
				},	
				'mouseleave' : function() {
					if ((DescriptionBox) && (!MenuItem.hasClass('current'))) {
						DescriptionBox.setStyle('display', 'none');				
					}
				},	
				'click' : function() {
					if(DescriptionBox) {
						DescriptionBox.setStyle('display', 'none');				
					}
										
					if (SubMenuLevel3) {
						if(!MenuItem.hasClass('current')) {
							MenuItem.addClass('current');
						} else {
							MenuItem.removeClass('current');
						}
					} else {
						if(MenuItem.getElement('a')) {
							window.location=MenuItem.getElement('a').href;
						}					
					}
				}
			});			
		
		});
		
	},
	
	ClearText : function() {
	
		var ClearTextFields = $$('.cleartext');
	
		ClearTextFields.each(function(Field) {
			
			var ParentForm = Field.getParent("form");			
			var InitValue = Field.value;
			Field.addEvent('focus', function() {
				if (Field.value==InitValue) {
					Field.value='';
				}
			});	
			if (ParentForm) {
				ParentForm.addEvent('focus', function() {
					if (Field.value==InitValue) {
						Field.value='';
					}
				});	
			}
		
		
		});	
	
	},
	
	SwatchesInit : function() {
		
		// Get the the init objects
		this.ProductSwatchPreview = $('prod');
		
		this.SampleRequestLinkParent = $('sample_requestlink');
		this.SampleRequestLink = this.SampleRequestLinkParent.getFirst();
		
		this.SampleBasketLinkParent = $('sample_basketlink');
		this.SampleBasketLink = this.SampleBasketLinkParent.getFirst();
		
		this.SampleRequestTotalSpan = $('sample_request_total');
		this.SwatchName = $('swatch_name');
	
		window.addEvent("domready",function(){
			
			// Scroll list / options
			this.SwatchesList = $('swatches_list');
			var SwatchesList = this.SwatchesList;
			SwatchesList.setStyle('overflow-y', 'hidden');
			SwatchesList.setStyle('height', 550);
			
			var SwatchColoursList = $('swatch_colours_list');
		
			// Get and setup the swatch list window
			this.SwatchListWindow = $('swatches_list_window');
			this.SwatchListWindowOriginalHeight = Math.ceil((this.SwatchListWindow.getElements('li').length/4)) * 61;
			
			var SwatchListWindow = this.SwatchListWindow;
			var SwatchListWindowOriginalHeight = this.SwatchListWindowOriginalHeight;
			
			SwatchListWindow.setStyle('overflow-y', 'hidden');
			SwatchListWindow.setStyle('height', 530);

			// Follower used in preview window
			var SwatchPreviewFollower = new Element('div', { 'id' : 'swatch_preview_follower' });
			this.SwatchPreviewFollowerSize = 50;
			
			this.SwatchPreviewImage = $('swatch_preview');
			
			var SwatchPreviewImage = this.SwatchPreviewImage;
			
			// Check if swatch preview is on and if it is then get some objects needed
			
			//alert(this.SwatchOptions.InitZoom);
			if (SwatchPreviewImage) {
				this.SwatchPreviewPanContainer = $('swatch_preview_pan_container');
				var SwatchPreviewPanContainer = this.SwatchPreviewPanContainer;

				this.SwatchPreviewPan = $('swatch_preview_pan');
				var SwatchPreviewPan = this.SwatchPreviewPan;
				
				// If init zoom is fale then hide the preview
				if(this.SwatchOptions.InitZoom==false) {
					//InitZoom
					this.swatchZoomEnableDisable(false);
				} else {
					this.swatchZoomEnableDisable(true);
					//SwatchPreviewPanContainer.setStyle('display', 'block');
					this.zoomEnabled=true;
				}
			}
			
			// Swatch list scroll init
			this.swatchesInitScrollBar();
			
			// Swatch option events
			this.swatchOptionsEvents();
						
			// Init the preview swatch zoom functionality
			if (SwatchPreviewImage) {
				
				SwatchPreviewPan.setStyle('background-image', 'url(' + this.SwatchOptions.LargeImage + ')');

				SwatchPreviewFollower.setStyle('display', 'none');
				SwatchPreviewFollower.setStyle('opacity', 0.4);
				SwatchPreviewFollower.injectTop(SwatchPreviewImage);
				
				SwatchPreviewImage.addEvents({
					'dblclick' : function(e) {
						
						if (this.zoomEnabled) {
							var eve = new Event(e);
							eve.stop();
						}
						
					}.bind(this),
					'click' : function(e) {
						
						if (this.zoomEnabled) {
							if(SwatchPreviewFollower.getSize().x == 50) {
								this.SwatchPreviewFollowerSize = 100;
								SwatchPreviewFollower.setStyle('width', 100);
								SwatchPreviewFollower.setStyle('height', 100);
								SwatchPreviewPan.setStyle('background-image', 'url(' + this.SwatchOptions.LargeImage100 + ')');
							} else if(SwatchPreviewFollower.getSize().x == 100) {
								this.SwatchPreviewFollowerSize = 50;
								SwatchPreviewFollower.setStyle('width', 50);
								SwatchPreviewFollower.setStyle('height', 50);
								SwatchPreviewPan.setStyle('background-image', 'url(' + this.SwatchOptions.LargeImage + ')');
							}  
						}
						
					}.bind(this),
					'mouseover' : function(e) {
						
						if (this.zoomEnabled) {
					
							var eve = new Event(e);
							SwatchPreviewFollower.setStyle('display', 'block');
							
						}
						
					}.bind(this),
					'mousemove' : function(e) {
						
						if (this.zoomEnabled) {
						
							var PreviewSize = SwatchPreviewImage.getSize();
							PreviewSize.x = 250; // Overide the width
						
							var eve = new Event(e);
												
							var FollowerSize = SwatchPreviewFollower.getSize();
							var FollowerPosition = SwatchPreviewFollower.getPosition();
							var PreviewPosition = SwatchPreviewImage.getPosition();
													
							var NewFollowerY = 0;
							var NewFollowerX = 0;
							
							var WindowScrollAmount = this.getScrollAmount();		
							var clientY = eve.event.clientY;
							
							//PreviewPosition.y = PreviewPosition.y - WindowScrollAmount.y;
							clientY = clientY + WindowScrollAmount.y;
									
							if(FollowerSize.x == 50) {
								
								if ((clientY+25) >= (PreviewPosition.y+PreviewSize.y)) {
									NewFollowerY = (PreviewPosition.y+PreviewSize.y)-50;
								} else if ((clientY-25) <= (PreviewPosition.y)) {
									NewFollowerY = PreviewPosition.y;
								} else {
									NewFollowerY = clientY - 25;
								}
								
								if ((eve.event.clientX+25) >= (PreviewPosition.x+PreviewSize.x)) {
									NewFollowerX = (PreviewPosition.x+PreviewSize.x)-50;
								} else if ((eve.event.clientX-25) <= (PreviewPosition.x)) {
									NewFollowerX = PreviewPosition.x;						
								} else {
									NewFollowerX = eve.event.clientX - 25;
								}
								
								SwatchPreviewFollower.setStyle('top', NewFollowerY);
								SwatchPreviewFollower.setStyle('left', NewFollowerX);
								
							} else {
							
								if ((clientY+50) >= (PreviewPosition.y+PreviewSize.y)) {
									NewFollowerY = (PreviewPosition.y+PreviewSize.y)-100;
								} else if ((clientY-50) <= (PreviewPosition.y)) {
									NewFollowerY = PreviewPosition.y;
								} else {
									NewFollowerY = clientY - 50;
								}
								
								if ((eve.event.clientX+50) >= (PreviewPosition.x+PreviewSize.x)) {
									NewFollowerX = (PreviewPosition.x+PreviewSize.x)-100;
								} else if ((eve.event.clientX-50) <= (PreviewPosition.x)) {
									NewFollowerX = PreviewPosition.x;						
								} else {
									NewFollowerX = eve.event.clientX - 50;
								}
							
								SwatchPreviewFollower.setStyle('top', NewFollowerY);
								SwatchPreviewFollower.setStyle('left', NewFollowerX);
	
							}
							
							// Here you can control the actual positiong of the zoomed part, 
							// increasing the accuracy of the final look and feel. A bit cowboy, but
							// it works.
							if(SwatchPreviewFollower.getSize().x == 50) {
								var NewBackgroundPosX = 0 - ((NewFollowerX-PreviewPosition.x)*2.4);
								var NewBackgroundPosY = 0 - ((NewFollowerY-PreviewPosition.y)*2.4);
							} else {
								var NewBackgroundPosX = 0 - ((NewFollowerX-PreviewPosition.x)*1.2);
								var NewBackgroundPosY = 0 - ((NewFollowerY-PreviewPosition.y)*1.2);
							}
													
							SwatchPreviewPan.setStyle('background-position', NewBackgroundPosX+'px '+NewBackgroundPosY+'px');
						
						} else {
							
							SwatchPreviewFollower.setStyle('display', 'none');
							
						}
											
					}.bind(this),
					'mouseleave' : function(e) {
					
						if (this.zoomEnabled) {
							var eve = new Event(e);
							SwatchPreviewFollower.setStyle('display', 'none');
						}
						
					}.bind(this)
				});		
			
			}
			
			this.setSampleRequestLink();
			
			// Init swatch colour listings
			if (SwatchColoursList) {
			
				this.SwatchColoursSelected = new Array();
				
				var SwatchColourOptions = SwatchColoursList.getElements('li');
				SwatchColourOptions.each(function(SwatchColourOption) {
					
					var SwatchColourOptionDiv = SwatchColourOption.getFirst();
				
					SwatchColourOptionDiv.addEvents({
						'mouseover' : function() {
							SwatchColourOptionDiv.setStyle('opacity', 0.6);
						},
						'mouseleave' : function() {
							if(!SwatchColourOption.hasClass("checked")) {
								SwatchColourOptionDiv.setStyle('opacity', 1);
							}							
						}
					});
									
					var EachSwatchLink = SwatchColourOptionDiv.getElement('a');
					var ColourID = EachSwatchLink.getProperty('href').replace("/swatch-colour/", "");
					var SwatchMarker = new Element('div', {'style':'cursor : pointer; background : transparent; margin-top : -2px; margin-left : -2px;display : none; position : absolute; width : 48px;height : 48px;border : 4px Solid #EE3424;'});
					SwatchMarker.injectTop(SwatchColourOption);
					
					$$(EachSwatchLink, SwatchMarker).addEvent('click', function(e) {
						
						// Stop click event
						var Eva = new Event(e);
						Eva.stop();
						
						SwatchColourOptions.each(function(SwatchColourOption2) {
							//alert(SwatchColourOption2 + ' div');
							var SwatchColourOptionDiv = SwatchColourOption2.getFirst();
							SwatchColourOptionDiv.setStyle('display', 'none');
							SwatchColourOption2.removeClass('checked');
							//this.SwatchColoursSelected.erase(ColourID);
						})
						
						this.SwatchColoursSelected.empty();
						
						// Check if we've already select this
						if(!SwatchColourOption.hasClass("checked")) {
							SwatchColourOption.addClass('checked');
							
							SwatchColourOptionDiv.setStyle('opacity', 1);
							SwatchMarker.setStyle('display', 'block');
												
							this.SwatchColoursSelected.include(ColourID);
						//} else {
						//	SwatchMarker.setStyle('display', 'none');
						//	SwatchColourOption.removeClass('checked');
						//	this.SwatchColoursSelected.erase(ColourID);
						}
						
						// Fade swatches list to show loading						
						SwatchesList.getElement('ul').fade(0.4);
						
						// Show ajax loading
						this.ajaxLoaderShow(SwatchesList.getPosition().x+100, SwatchesList.getPosition().y+100, 0);
						
						//this.ProductSwatchPreview.fade(0.4);
						//this.ajaxLoaderShow(this.ProductSwatchPreview.getPosition().x+103, this.ProductSwatchPreview.getPosition().y+145, 0);
							
						var jsonRequest = new Request.JSON({url: "/search_swatches?colours="+this.SwatchColoursSelected, onComplete: function(response){
						
							// Dispose of existing items
							SwatchesList.getElement('ul').getElements('li').dispose();
							
							if(response.swatches.length > 0) {
							
								// Go through each swatch and add to swatches list
								response.swatches.each(function(Swatch) {
									
									var newSwatchListItem = new Element('li');
									var newSwatchListItemDiv = new Element('div');
									var newSwatchListItemLink = new Element('a');
									newSwatchListItemLink.setProperty('href', '/swatch/'+Swatch.id);
									
									// Either show a swatch or no swatch image
									var ImageSrc = "";
									if (Swatch.previewimage) {
										ImageSrc = "/img/swatches/56/"+Swatch.id+".jpg";
									} else {
										ImageSrc = "/img/no_swatch.png";
									}
									
									var newSwatchListItemImg = new Element('img', {
										"src" : ImageSrc,
										"width" : 56,
										"height" : 56,
										"border" : 0,
										"alt" : Swatch.name,
										"title" : Swatch.name
									});
									
									newSwatchListItemImg.injectInside(newSwatchListItemLink);
									newSwatchListItemLink.injectInside(newSwatchListItemDiv);
									newSwatchListItemDiv.injectInside(newSwatchListItem);
									newSwatchListItem.injectInside(SwatchesList.getElement('ul'));
									
								});
							
							} else {
							
								if(this.SwatchColoursSelected.length>0) {
									var newSwatchListMsg = new Element('li');
									newSwatchListMsg.innerHTML = "Sorry, no swatches could be found that matched those colours.";
									newSwatchListMsg.injectInside(SwatchesList.getElement('ul'));
								}
								
							}
							
							// Set up swatches list scroll bar
							this.swatchesInitScrollBar();
							
							// Set swatch option events
							this.swatchOptionsEvents();
							
							this.ajaxLoaderHide();
							SwatchesList.getElement('ul').fade(1);
						
						}.bind(this)}).get();
	
					}.bind(this));
								
				}.bind(this));
						
			}
			
		}.bind(this));
		
	},
	
	swatchOptionsEvents : function() {
	
		var SwatchPreviewImage = this.SwatchPreviewImage;
		
		if (SwatchPreviewImage) {
			
			var SwatchPreviewPan = this.SwatchPreviewPan;
			var SwatchPreviewPanContainer = this.SwatchPreviewPanContainer;		
		
		}
	
		// Little swatch options init
		var SwatchOptions = $$('#swatches_list ul div');
		SwatchOptions.each(function(SwatchOption) {
		
			SwatchOption.removeEvents();
			SwatchOption.addEvents({
				'mouseover' : function() {
					SwatchOption.setStyle('opacity', 0.6);
				},
				'mouseleave' : function() {
					SwatchOption.setStyle('opacity', 1);
				}
			});
			
			var EachSwatchLink = SwatchOption.getElements('a');
			
			EachSwatchLink.removeEvents();
			EachSwatchLink.addEvent('click', function(e) {
				
				// Stop click event
				var Eva = new Event(e);
				Eva.stop();
				
				// Fade the preview area to show it's loading
				this.ProductSwatchPreview.fade(0.4);
				
				// Show ajax loader
				this.ajaxLoaderShow(this.ProductSwatchPreview.getPosition().x+103, this.ProductSwatchPreview.getPosition().y+145, 0);
				
				//var jsonRequest = new Request.JSON({url: "/ajax/swatchget.asp", onComplete: function(response){
					
				var jsonRequest = new Request.JSON({url: EachSwatchLink[0].href, onComplete: function(response){
					
					if (response != null){
					
						// Get swatch information
						this.SwatchName.innerHTML = response.swatch.name;
						this.SwatchOptions.LargeImage = response.swatch.largeimage50;
						this.SwatchOptions.LargeImage100 = response.swatch.largeimage100;
					
						// Set swatch preview images
						if(SwatchPreviewImage) {
							if(this.SwatchPreviewFollowerSize == 50) {
								if (this.SwatchOptions.LargeImage != '') {
									SwatchPreviewPan.setStyle('background-image', 'url(' + this.SwatchOptions.LargeImage + ')');
								}
							} else if(this.SwatchPreviewFollowerSize == 100) {
								if (this.SwatchOptions.LargeImage100 != '') {
									SwatchPreviewPan.setStyle('background-image', 'url(' + this.SwatchOptions.LargeImage100 + ')');
								}
							} 
							SwatchPreviewImage.getElement('div[class=image]').setStyle('background-image', 'url(' + response.swatch.medium + ')');
						}
						
						// Reset request link
						if(this.SampleRequestLinkParent) {
							if(response.swatch.swatchrequestenabled) {
								if (response.swatch.swatchrequest) {
									this.SampleRequestLinkParent.set('html', '<a href="/samplerequests?add='+response.swatch.id+'" rel="nofollow" title="'+Language.en.SampleRequestInit+'" class="noline plus" id="sample_requestlink">'+Language.en.SampleRequestInit+'</a>');
								} else {
									this.SampleRequestLinkParent.set('html', ''+Language.en.SampleRequest+'');
								}
							} else {
								this.SampleRequestLinkParent.set('html', '');
							}
						}
						
						this.SampleBasketLinkParent.set('html', '<a href="https://secure.aguafabrics.com/basket?Q1=1&V1='+response.swatch.id+'&strAction=add&numLineCount=1"  title="Purchase fabric" class="noline plus" id="sample_basketlink">Purchase fabric shown directly above</a>');
	
						if(this.SampleRequestLinkParent) {
							this.SampleRequestLink = this.SampleRequestLinkParent.getFirst();
						}
						
						this.setSampleRequestLink();
						
						
						
						// Fade the preview back
						this.ProductSwatchPreview.fade(1);
						//this.ProductSwatchPreview.setStyle('opacity', 1);
						
						
						// Hide ajax loader
						this.ajaxLoaderHide();
						
						// Only used for if we're in browse by color
						if($('prod_forcolour')) {
							var prodForcolour= $('prod_forcolour');
							if(prodForcolour.getStyle('display')=='none'){
								prodForcolour.setStyle('opacity', 0);
								prodForcolour.setStyle('display', 'block');
								prodForcolour.fade(1);
							}						
						}
						
						// Hide zoom preview if zoom is disabled
						if(response.swatch.zoom) {
							this.swatchZoomEnableDisable(true);
						} else {
							this.swatchZoomEnableDisable(false);
						}
					}
				}.bind(this)}).get();
									
				//this.SwatchName.innerHTML = 'blank blank';
				//SwatchPreviewPan.setStyle('background-image', 'url(' + this.SwatchOptions.LargeImage + ')');
					
			}.bind(this));
			
		}.bind(this));
		
	},	
	
	swatchesInitScrollBar : function() {
	
		var NewScrollInitCall = false;
		var SwatchesList = this.SwatchesList;
		var SwatchListWindow = this.SwatchListWindow;
		
		// Opera doesn't like this at all
		if (!Browser.Engine.presto) {
			
			// reset the original height
			this.SwatchListWindowOriginalHeight = Math.ceil((this.SwatchListWindow.getElements('li').length/4)) * 61;		
			var SwatchListWindowOriginalHeight = this.SwatchListWindowOriginalHeight;
			
			// Scroll bar functions and settings
			if(!this.ScrollBarContainer) {
				this.ScrollBarContainer = new Element('div', { 'class' : 'scrollbar' });
				NewScrollInitCall = true;
			}
			
			var ScrollBarContainer = this.ScrollBarContainer;
			ScrollBarContainer.injectTop(SwatchesList);
			
			if(!this.ScrollArrowUp) {
				this.ScrollArrowUp = new Element('img', { 'src' : '/img/scroll_arrow_up.png', 'width' : 21, 'height' : 11 });
			}
			var ScrollArrowUp = this.ScrollArrowUp;
			
			if(!this.ScrollArrowDown) {
				this.ScrollArrowDown = new Element('img', { 'src' : '/img/scroll_arrow_down.png', 'width' : 21, 'height' : 11 });
			}
			var ScrollArrowDown = this.ScrollArrowDown;
					
			if (!this.ScrollBarConstrainer) {
				this.ScrollBarConstrainer = new Element('div', { 'class' : 'scrollbar_drag_constrainer' });
			}
			var ScrollBarConstrainer = this.ScrollBarConstrainer;
			ScrollBarConstrainer.setStyle('height', 493);
			
			if(!this.ScrollBar) {
				this.ScrollBar = new Element('div', { 'class' : 'scrollbar_drag' });
			}
			var ScrollBar = this.ScrollBar;
			
			//alert(SwatchListWindowOriginalHeight);
			
			// Test to see if list actually overflows
			if ((SwatchListWindowOriginalHeight-493) > 0) {
				ScrollBar.setStyle('height', (493/100) * ((100/SwatchListWindowOriginalHeight)*525))
				ScrollArrowUp.setStyle('visibility', 'visible');
				ScrollArrowDown.setStyle('visibility', 'visible');
				ScrollBarConstrainer.setStyle('visibility', 'visible');
				ScrollBar.setStyle('visibility', 'visible');
			} else {
				ScrollArrowUp.setStyle('visibility', 'hidden');
				ScrollArrowDown.setStyle('visibility', 'hidden');
				ScrollBarConstrainer.setStyle('visibility', 'hidden');
				ScrollBar.setStyle('visibility', 'hidden');
			}
			
			if(NewScrollInitCall) {
				ScrollArrowUp.injectInside(ScrollBarContainer);
				ScrollArrowDown.injectInside(ScrollBarContainer);
				ScrollBarConstrainer.injectInside(ScrollBarContainer);
				ScrollBar.injectInside(ScrollBarConstrainer);
			}
			
			var ScrollBarInitTop = ScrollBar.getPosition().y;
			
			//************************************************
			// PROBLEM FIXED 
			// Bottom items were only displaying half the image
			//************************************************
			var SwatchListScrollMultiplier = Math.round((SwatchListWindowOriginalHeight/525) + 0.5);
			
			ScrollBar.removeEvents();
			
			var ScrollDragInstance = new Drag.Move(ScrollBar, {
				container : ScrollBarConstrainer,
				onDrag: function(el) {
					var WindowScrollAmount = this.getScrollAmount();	
					SwatchListWindow.scrollTop = ((ScrollBar.getPosition().y-ScrollBarInitTop) * SwatchListScrollMultiplier);
				}.bind(this)
			});
			
			ScrollBar.addEvents({
				'mouseover' : function() { ScrollBar.setStyle('opacity', 0.6); },
				'mouseleave' : function() { ScrollBar.setStyle('opacity', 1); },
				'mousedown' : function() { this.ScrollBarActive=true; }.bind(this),
				'mouseup' : function() { this.ScrollBarActive=false; }.bind(this)
			});
			
			// Arrow functionality
			ScrollArrowUp.removeEvents();
			ScrollArrowDown.removeEvents();
			
			// Init the scroll bar top for IE
			if(Browser.Engine.trident) {
				ScrollBar.setStyle('top', '32px');
			} else if(Browser.Engine.webkit) {
				ScrollBar.setStyle('top', '32px');
			}
			
			ScrollArrowUp.addEvents({
				'click' : function() {
					//console.log(ScrollBar.getStyle('top').toInt(), ScrollBar.getStyle('top').toInt()-10);
					if((ScrollBar.getStyle('top').toInt()-10) >= 32) {
						ScrollBar.setStyle('top', ScrollBar.getStyle('top').toInt()-10);
						ScrollDragInstance.fireEvent('drag');
					}
				}.bind(this),
				'mouseover' : function() {
					ScrollArrowUp.setStyle('opacity', 0.6);
				},
				'mouseleave' : function() {
					ScrollArrowUp.setStyle('opacity', 1);
				}
			});
			
			ScrollArrowDown.addEvents({
				'click' : function() {
					if((ScrollBar.getStyle('top').toInt()+10) <= ((ScrollBarConstrainer.getSize().y-ScrollBar.getSize().y)+32)) {
						ScrollBar.setStyle('top', ScrollBar.getStyle('top').toInt()+10);
						ScrollDragInstance.fireEvent('drag');
					}
				},
				'mouseover' : function() {
					ScrollArrowDown.setStyle('opacity', 0.6);
				},
				'mouseleave' : function() {
					ScrollArrowDown.setStyle('opacity', 1);
				}
			});
			
		} else {
		
			SwatchListWindow.setStyle('width', SwatchListWindow.getSize().x+5);
			SwatchListWindow.getParent().setStyle('width', SwatchListWindow.getParent().getSize().x+5);
			SwatchListWindow.setStyle('overflow', 'auto');
		
		}
	
	
	},
	
	swatchZoomEnableDisable : function(enable) {
	
		var SwatchPreviewPanContainer = this.SwatchPreviewPanContainer;
		var SwatchPreviewPan = this.SwatchPreviewPan;
		this.zoomEnabled = enable;
			
		if(!enable) {
		
			if(SwatchPreviewPanContainer.getSize().y!=0) {
				SwatchPreviewPanContainer.setStyle('overflow-y', 'hidden');
				//SwatchPreviewPan.fade(0);
				var eftHidePreview = new Fx.Morph(SwatchPreviewPanContainer, {duration: 'long', transition: Fx.Transitions.Sine.easeOut});
				eftHidePreview.start({
				    'height': [120, 0],
					'opacity': [1, 0]
				});
			}

		} else {
			
			if(SwatchPreviewPanContainer.getSize().y!=120) {
				SwatchPreviewPanContainer.setStyle('overflow-y', 'hidden');
				//SwatchPreviewPan.fade(1);
				var eftHidePreview = new Fx.Morph(SwatchPreviewPanContainer, {duration: 'long', transition: Fx.Transitions.Sine.easeOut});
				eftHidePreview.start({
				    'height': [0, 120],
					'opacity': [0, 1]
				});
			}
			
		}
	
	},	
	
	setSampleRequestLink : function() {
	
		// Sample request button function
		if(this.SampleRequestLink) {
			
			this.SampleRequestLink.removeEvents();
		
			this.SampleRequestLink.addEvent('click', function(eve) {
				var eveHandle = new Event(eve);
				eveHandle.stop();
				
				this.SampleRequestLink.fade(0.4);
				
				var jsonRequest = new Request.JSON({url: this.SampleRequestLink.href, onComplete: function(response){
					this.SampleRequestLinkParent.innerHTML = Language.en.SampleRequest;
					this.SampleRequestTotalSpan.innerHTML = '('+response.Total+')';
				}.bind(this)}).get();
				
			}.bind(this));
		}			
		
	},
	
	getScrollAmount : function() {
		
		var xScroll, yScroll;
	
		if (window.innerHeight && window.scrollMaxY) {	
			xScroll = document.body.scrollWidth;
			yScroll = window.innerHeight + window.scrollMaxY;
		// all but Explorer Mac
		} else if (document.body.scrollHeight > document.body.offsetHeight){
			xScroll = document.body.scrollWidth;
			yScroll = document.body.scrollHeight;
		// Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		} else {
			xScroll = document.body.offsetWidth;
			yScroll = document.body.offsetHeight;
		}
		
		var windowWidth, windowHeight;
		// all except Explorer
		if (self.innerHeight) {
			windowWidth = self.innerWidth;
			windowHeight = self.innerHeight;
		// Explorer 6 Strict Mode
		} else if (document.documentElement && document.documentElement.clientHeight) {
			windowWidth = document.documentElement.clientWidth;
			windowHeight = document.documentElement.clientHeight;
		// other Explorers
		} else if (document.body) {
			windowWidth = document.body.clientWidth;
			windowHeight = document.body.clientHeight;
		}	
		
		// for small pages with total height less then height of the viewport
		if(yScroll < windowHeight){
			pageHeight = windowHeight;
		} else { 
			pageHeight = yScroll;
		}
	
		// for small pages with total width less then width of the viewport
		if(xScroll < windowWidth){	
			pageWidth = windowWidth;
		} else {
			pageWidth = xScroll;
		}
	
		this.WindowWidth = windowWidth;
		this.WindowHeight = windowHeight;
		this.PageHeight = pageHeight;
		this.PageWidth = pageWidth;
		
		if (self.pageYOffset) {
			yScroll = self.pageYOffset;
		} else if (document.documentElement && document.documentElement.scrollTop){
			yScroll = document.documentElement.scrollTop;
		} else if (document.body) {
			yScroll = document.body.scrollTop;
		}
		
		return { "x" : xScroll, "y" : yScroll };
	
	},
	
	DistListInit : function() {
	
		var DistListItem = $$('.dist_list li div.item');
		var LastDist = null;
		
		DistListItem.each(function(Item) {
		
			var Description = Item.getParent().getElement('div[class=description]');
	
			Item.addEvents({
				'click' : function() {
					if(LastDist) {
						LastDist.setStyle('display', 'none');
					}
					
					Description.setStyle('display', 'block');
					LastDist = Description;
				},
				'mouseover' : function() {
					Item.setStyle('opacity', 0.6);
				},
				'mouseleave' : function() {
					Item.setStyle('opacity', 1);
				}
			});		
	
		});
	
	
	},
	
	// ************************************************************************
	// Validator
	// ************************************************************************
	ValidateMessageInject : function(obj, where, message) {
		
		var msgContainer = new Element('div', { 'class' : 'ValidateMessage'})
			.setStyle("padding-top", 3)
			.setStyle("color", "#9E0000")
			.setStyle("font-weight", "bold");
		msgContainer.innerHTML = message;
		msgContainer.inject(obj, where);
		
	},
	
	ValidateURL : function(url) {
	    var RegExp = /^(([\w]+:)?\/\/)?(([\d\w]|%[a-fA-f\d]{2,2})+(:([\d\w]|%[a-fA-f\d]{2,2})+)?@)?([\d\w][-\d\w]{0,253}[\d\w]\.)+[\w]{2,4}(:[\d]+)?(\/([-+_~.\d\w]|%[a-fA-f\d]{2,2})*)*(\?(&?([-+_~.\d\w]|%[a-fA-f\d]{2,2})=?)*)?(#([-+_~.\d\w]|%[a-fA-f\d]{2,2})*)?$/;
	    if(RegExp.test(url)){
	        return true;
	    }else{
	        return false;
	    }
	},
	
	ValidateInitialize : function() {	
	
		this.Validator = new Class({
		
			options: {
				
				msgContainerTag: "div",
				msgClass: "SCN.Validator-msg",
		
				styleNeutral: {"background-color": "#ffffff"},
				styleInvalid: {"background-color": "#ffffff"},
				styleValid: {"background-color": "#ffffff"},
		
				onValid: Class.empty,
				onInvalid: Class.empty,
				
				GlobalMessage : ''
				
			},
		
			initialize: function(form, options) {
				this.form = $(form);
				this.setOptions(options);
		
				this.fields = this.form.getElements("*[class^=fValidate]");
				this.validations = [];
		
				this.fields.each(function(element) {
					if(!this._isChildType(element)) element.setStyles(this.options.styleNeutral);
					element.cbErr = 0;
					var classes = element.getProperty("class").split(' ');
					classes.each(function(klass) {
						if(klass.match(/^fValidate(\[.+\])$/)) {
							var aFilters = eval(klass.match(/^fValidate(\[.+\])$/)[1]);
							for(var i = 0; i < aFilters.length; i++) {
								if(this.options[aFilters[i]]) this.register(element, this.options[aFilters[i]]);
								if(aFilters[i].charAt(0) == '=') this.register(element, $extend(this.options.confirm, {idField: aFilters[i].substr(1)}));
							}
						}
					}.bind(this));
				}.bind(this));
		
				this.form.addEvents({
					"submit": this._onSubmit.bind(this),
					"reset": this._onReset.bind(this)
				});
			},
		
			register: function(field, options) {
				field = $(field);
				this.validations.push([field, options]);
				
				if (options.type!='checkboxes') {
					field.addEvent("blur", function() {
						this._validate(field, options);
					}.bind(this));
				} else {
				
					var Checkboxes = $$('input[name='+options.id+']');
					
					Checkboxes.each(function(Checkbox) {
						Checkbox.addEvent('change', function() {
							
							var CheckedNumber = 0;
							Checkboxes.each(function(CheckboxChecked) {
								if(CheckboxChecked.checked){CheckedNumber++;}
							}.bind(this));
							
							if(CheckedNumber==options.maxchecks) {
								
								Checkboxes.each(function(CheckboxChecked) {
									if(CheckboxChecked.checked==false) {
										CheckboxChecked.disabled=true;
									}
								}.bind(this));
								
							} else if(CheckedNumber>options.maxchecks) {
								Checkbox.checked=false;
							} else {
								
								Checkboxes.each(function(CheckboxChecked) {
									if(CheckboxChecked.disabled==true) {
										CheckboxChecked.disabled=false;
									}
								}.bind(this));
							
							}
										
						}.bind(this));
					}.bind(this));
					
				}
			},
		
			_isChildType: function(el) {
				if (el) {
					var elType = el.type.toLowerCase();
				}
				//if((elType == "radio") || (elType == "checkbox") || (elType == "select")) return true;
				return false;
			},
		
			_validate: function(field, options) {
			
				switch(options.type) {
				
					case "terms":
						
						if (field.checked) {
							this._msgRemove(field, options);	
						} else {
							this._msgInject(field, options);			
						}			
					
						break;
						
					case "datamatch":
					
						if (field.value != '') {
						
							var jsonRequest = new Request.JSON({url: "/ajax/validate?type="+options.datatype+"&value="+field.value, onComplete: function(Results){
							  	if (Results.match==true) { this._msgInject(field, options); } else { this._msgRemove(field, options); }							
							}.bind(this)}).get();

						}
						break;
						
					case "age":
					
						objAgeFieldDay = $(options.dobday);
						objAgeFieldMonth = $(options.dobmonth);
						objAgeFieldYear = $(options.dobyear);
		
						intAgeFieldDay = objAgeFieldDay.value;
						intAgeFieldMonth = objAgeFieldMonth.value;
						intAgeFieldYear = objAgeFieldYear.value;
						
						if ((intAgeFieldDay=='') || (intAgeFieldMonth=='') || (intAgeFieldYear=='')){
							this._msgInject(field, options);
						} else {
							var min_age = 16;
							var year = parseInt(objAgeFieldYear.value);
							var month = parseInt(objAgeFieldMonth.value) - 1;
							var day = parseInt(objAgeFieldDay.value);
		
							var theirDate = new Date((year + min_age), month, day);
							var today = new Date;
				
							if ((today.getTime() - theirDate.getTime()) < 0) {
								this._msgInject(field, options);
							} else {
								this._msgRemove(field, options);
							}
						}
						
						break;
				
					case "confirm":
						
						if($(options.idField).value.toLowerCase() == field.value.toLowerCase()) {
							this._msgRemove(field, options); 
						} else {
							this._msgInject(field, options);
						}
						
						break;
						
					case "url":
					
						if (
							(field.value.contains(' ')) || 
							(!field.value.contains('http://')) || 
							(field.value == '')
							) {
							this._msgInject(field, options);
						} else {
							this._msgRemove(field, options);
						}
						
						break;
						
					case "checkboxes":
						
						var Checkboxes = $$('input[name='+options.id+']');
						var iCheckCount = 0;
						
						Checkboxes.each(function(Checkbox) {
							if(Checkbox.checked) {
								iCheckCount++;
							}
						});
						
						if ((iCheckCount==0)||(iCheckCount>options.maxchecks)) {
							this._msgInject(field, options);						
						} else {
							this._msgRemove(field, options);
						}
							
						break;
				
					default:
						
						if(options.re.test(field.value)) this._msgRemove(field, options);
						else this._msgInject(field, options);
						
				}
			},
		
			_validateChild: function(child, options) {
				var nlButtonGroup = this.form[child.getProperty("name")];
				var cbCheckeds = 0;
				var isValid = true;
		 		for(var i = 0; i < nlButtonGroup.length; i++) {
					if(nlButtonGroup[i].checked) {
						cbCheckeds++;
						if(!options.re.test(nlButtonGroup[i].getValue())) {
							isValid = false;
							break;
						}
					}
				}
				if(cbCheckeds == 0 && options.type == "required") isValid = false;
				if(isValid) this._msgRemove(child, options);
				else this._msgInject(child, options);
			},
		
			_msgInject: function(owner, options) {
			
				if(options.type!='checkboxes') {				
			
					var ownerelType = owner.type.toLowerCase();
					//alert(ownerelType);
			
					if(!$(owner.getProperty("id") + options.type +"_msg")) {
					
						if(ownerelType == 'checkbox') {
							
							var msgContainer = new Element(this.options.msgContainerTag, {"id": owner.getProperty("id") + options.type +"_msg", "class": "validate_popmsg"})
								.setStyle("opacity", 0)
								.setStyle("margin-bottom", 10)
								.setStyle("color", "#9E0000")
								.setStyle("font-weight", "bold")
								.injectBefore(owner)
								.fade(1);
							msgContainer.innerHTML = options.msg;
							
						} else if ((ownerelType == 'select-one') && (Browser.Engine.trident)) {
							
							var msgContainer = new Element(this.options.msgContainerTag, {"id": owner.getProperty("id") + options.type +"_msg", "class": "validate_popmsg"})
								.setStyle("opacity", 0)
								.setStyle("margin-left", 10)
								.setStyle("padding-top", 3)
								.setStyle("padding-left", 10)
								.setStyle("color", "#9E0000")
								.setStyle("font-weight", "bold")
								.injectAfter(owner.getParent().getParent())
								.fade(1);		
							msgContainer.innerText = options.msg;		
										
						} else {
						
							var msgContainer = new Element(this.options.msgContainerTag, {"id": owner.getProperty("id") + options.type +"_msg", "class":"validate_popmsg"})
								.setStyle("opacity", 0)
								.setStyle("padding-top", 3)
								.setStyle("margin-left", 0)
								.setStyle("margin-bottom", 10)
								.setStyle("color", "#9E0000")
								.setStyle("font-weight", "bold")
								.injectAfter(owner)
								.fade(1);		
							msgContainer.innerHTML = options.msg;
							
						}
						
						if(owner.cbErr) {
						
							var ValidatorMessage = $('ValidatorMessage');
							
							if(ValidatorMessage) {
								if(ValidatorMessage.getStyle('display') == 'none') {
									ValidatorMessage.getFirst().getFirst().innerHTML = this.options.GlobalMessage;
									ValidatorMessage.setStyle('display', 'block');
									window.scroll(0,ValidatorMessage.getTop() - 20);
								}
							}
							
							owner.cbErr++;
							
						} else {
						
							owner.cbErr=1;
						
						}
						this._chkStatus(owner, options);
					}
					
				} else {
				
					var InjectInsideObject = $(options.injectintoid);
				
					var msgContainer = new Element(this.options.msgContainerTag, {"id": options.injectintoid + options.type +"_msg", "class": "validate_popmsg"})
						.setStyle("opacity", 0)
						.setStyle("margin-bottom", 10)
						.setStyle("color", "#9E0000")
						.setStyle("font-weight", "bold")
						.injectTop(InjectInsideObject)
						.fade(1);
					msgContainer.innerHTML = options.msg;
								
					//this._chkStatus(owner, options);
					
				}
				
				var ValidatorMessage = $('validate_msg');
				
				if(ValidatorMessage) {
					//if(ValidatorMessage.getStyle('display') == 'none') {
						ValidatorMessage.getFirst().getFirst().innerHTML = this.options.GlobalMessage;
						ValidatorMessage.setStyle('display', 'block');
					//	window.scroll(0,ValidatorMessage.getTop() - 20);
					//}
				}
				
			},
		
			_msgRemove: function(owner, options, isReset) {
				isReset = isReset || false;
				
				if(options.type!='checkboxes') {		
				
					if($(owner.getProperty("id") + options.type +"_msg")) {
						
						var el = $(owner.getProperty("id") + options.type +"_msg");
						
						var myEffect = new Fx.Tween(el, {duration:1000, wait:false, onComplete: function() {el.dispose()}});
						myEffect.start('opacity', 0);
										
						if(!isReset) {
							owner.cbErr--;
							this._chkStatus(owner, options);
						}
					}
					
				} else {
				
					if($(options.injectintoid + options.type +"_msg")) {
					
						var el = $(options.injectintoid + options.type +"_msg");
							
						var myEffect = new Fx.Tween(el, {duration:SCN.GlabalFadeDuration, wait:false, onComplete: function() {el.dispose()}});
						myEffect.start('opacity', 0);
					
					}

				
					//$(injectintoid)
				
				}
			},
		
			_chkStatus: function(field, options) {
				var myEffect = new Fx.Tween(field);
			
				if(field.cbErr == 0) {
					//field.tween({duration: 400, transition: Fx.Transitions.linear}).start(this.options.styleValid);
					this.fireEvent("onValid", [field, options], 50);
				} else {
					//field.tween({duration: 400, transition: Fx.Transitions.linear}).start(this.options.styleInvalid);
					this.fireEvent("onInvalid", [field, options], 50);
				}
			},
		
			_onSubmit: function(event) {
				event = new Event(event);
				var isValid = true;
		
				this.validations.each(function(array) {
					if(this._isChildType(array[0])) this._validateChild(array[0], array[1]);
					else this._validate(array[0], array[1]);
					
					
					if (array[0]) {
						if(array[0].cbErr > 0) { isValid = false; }
					}
				}.bind(this));
		
				if(!isValid) event.stop();
				
				//alert(isValid);
				///event.stop();
				
				return isValid;
			},
		
			_onReset: function() {
				this.validations.each(function(array) {
					if(!this._isChildType(array[0])) array[0].setStyles(this.options.styleNeutral);
					array[0].cbErr = 0;
					this._msgRemove(array[0], array[1], true);
				}.bind(this));
			}
		});

		this.Validator.implement(new Events); // Implements addEvent(type, fn), fireEvent(type, [args], delay) and removeEvent(type, fn)
		this.Validator.implement(new Options);// Implements setOptions(defaults, options)

	}	
	
});

var AGUA = new AGUAClass();