AMCSiteClass.implement({

	// *************************************************************************
	// Gallery Initialize
	// *************************************************************************
	GalleryInitialize: function(XMLLocation){
	
		// Make initial elements
		this.GalleryPictures = $$('#GalleryListContainer .Picture');
		this.GalleryListContainer = $('GalleryListContainer');

		// Large image load array 
		this.GalleryImagesArray = [];
		var GalleryListContainer = this.GalleryListContainer;
		
		// Gallery expand elements 
		this.GalleryExpandPictureContainer = new Element('div', {
			'styles' : {
				'width' : 220,
				'height' : 150,
				'display' : 'none',
				'position' : 'absolute',
				'top' : 0,
				'left' : 0,
				'cursor' : 'pointer'
			}
		});
		this.GalleryExpandPictureBorder = new Element('div', {
			'styles' : {
				'width' : 536,
				'height' : 376,
				'display' : 'none',
				'background-color' : '#ffffff',
				'position' : 'absolute',
				'top' : 0,
				'left' : 0,
				'border' : '3px Solid ' + this.GlobalColor
			}
		});
		
		// Expand image objects 
		this.GalleryExpandImg = new Element('img', { 'width' : 220, 'height' : 150 });
		this.GalleryExpandImg.injectInside(this.GalleryExpandPictureContainer);
		this.GalleryExpandPictureContainer.injectInside(document.body);
		this.GalleryExpandPictureBorder.injectInside(document.body);
		
		// Used for the image roll over 
		this.GalleryItemRollOver = new Element('div', {
			'styles' : {
				'border' : '3px Solid ' + this.GlobalColor,
				'position' : 'absolute',
				'display' : 'none',
				'top' : 0,
				'left' : 0,
				'cursor' : 'pointer'
			}	
		});
		
		this.GalleryItemRollOver.addEvent('mouseleave', function(){
			this.GalleryItemRollOver.setStyle('display', 'none');
		}.bind(this));
				
		// Inject it inside 
		this.GalleryItemRollOver.injectInside(document.body);

		// make values 
		var GalleryItemSrc;
		var GalleryItemLargeSrc;
		var GalleryItemName;
		var GalleryItemDescription;
		
		// Got through each gallery item 
		this.GalleryPictures.each(function(PictureItem, PicturePos) {

			// Get inner objects for properties 
			var PictureItemLink = PictureItem.getElement('a');	
			var PictureItemImg = PictureItem.getElement('img');	
			
			// Get properties 
			GalleryItemSrc = PictureItemImg.getProperty("src");
			GalleryItemLargeSrc = PictureItemLink.getProperty("href");
			GalleryItemName = PictureItemImg.getProperty("alt");
			GalleryItemDescription = PictureItemImg.getProperty("title");
			
			// Add events 
			this.GalleryEvents(PictureItem, GalleryItemLargeSrc, GalleryItemName, GalleryItemDescription, PicturePos);
					
			// Add large src to load array 
			this.GalleryImagesArray[this.GalleryImagesArray.length] = GalleryItemLargeSrc;

		}.bind(this));
				
		this.GalleryLoadLargeImages();
	
	},
	
	GalleryEvents : function(PictureItem, PictureLargeSrc, PictureName, PictureDescription, PicturePos) {
	
		// Get the objects we'll need 
		var GalleryItemRollOver = this.GalleryItemRollOver;
		var GalleryExpandPictureContainer = this.GalleryExpandPictureContainer;
		var GalleryExpandImg = this.GalleryExpandImg;
		var GalleryItemRollOver = this.GalleryItemRollOver;
		var GalleryExpandPictureBorder = this.GalleryExpandPictureBorder;
		
		// Add events 
		PictureItem.addEvents({
			
			// Mouse enter shows border and add click event to that border div
			'mouseenter': function(){
				
				// Show border 
				GalleryItemRollOver.setStyle('display', 'block');
				GalleryItemRollOver.setStyle('top', PictureItem.getCoordinates().top - 1);
				GalleryItemRollOver.setStyle('left', PictureItem.getCoordinates().left - 1);
				GalleryItemRollOver.setStyle('width', 218);
				GalleryItemRollOver.setStyle('height', 149);
				
				// Remove original events from border div 
				GalleryItemRollOver.removeEvents();
				
				PictureItem.getElement('a').addEvent('click', function() {
					new Event(event).stop();
				});
				
				// Add click event 
				$$(GalleryItemRollOver, PictureItem.getElement('a')).addEvent('click', function() {
				
					// Upadate dimensions 
					this.getPageDimension();
				
					// This hides the border 
					GalleryItemRollOver.setStyle('display', 'none');
				
					// Get large value 
					GalleryExpandImg.src = PictureLargeSrc;		
					GalleryExpandImg.setStyle('opacity', 0);
					
					GalleryExpandPictureContainer.setStyle('opacity', 0);
					GalleryExpandPictureContainer.setStyle('display', 'block');
					GalleryExpandPictureContainer.setStyle('z-index', 25);
					GalleryExpandPictureContainer.setStyle('top', PictureItem.getCoordinates().top);
					GalleryExpandPictureContainer.setStyle('left', PictureItem.getCoordinates().left);
					GalleryExpandPictureContainer.setStyle('width', 218);
					GalleryExpandPictureContainer.setStyle('height', 149);
					
					// Show shadow 
					this.ShowShadowOverlay(true, true, 20);
					
					// get new top and left amountd
					var NewTop = ((this.WindowHeight / 2) + this.ScrollAmountY) - 170;
					var NewLeft = (this.WindowWidth / 2) - 250;
					
					// Start to show the object with a fade and expand effect 
					var fx1 = new Fx.Styles(GalleryExpandPictureContainer, {duration:this.GlobalFadeDuration, wait:false });
					fx1.start({ 'opacity' : 1, 'width' : 500, 'height' : 340, 'top' : NewTop, 'left' : NewLeft });
					
					var fx2 = new Fx.Styles(GalleryExpandImg, {duration:this.GlobalFadeDuration, wait:false });
					fx2.start({ 'opacity' : 1, 'width' : 500, 'height' : 340 });
					
					// Set expander properites
					GalleryExpandPictureBorder.setStyle('display', 'block');
					GalleryExpandPictureBorder.setStyle('opacity', 1);
					GalleryExpandPictureBorder.setStyle('z-index', 23);
					GalleryExpandPictureBorder.setStyle('top', NewTop - 20);
					GalleryExpandPictureBorder.setStyle('left', NewLeft - 20);
					
					// Add hide events
					this.ShadowOverlay.addEvent('click', function() {
						this.ShowShadowOverlay(false, null, null, null);
						
						var fx3 = new Fx.Styles(GalleryExpandPictureContainer, {duration:this.GlobalFadeDuration, wait:false });
						fx3.start({ 'opacity' : 0 });
						
						var fx4 = new Fx.Styles(GalleryExpandPictureBorder, {duration:this.GlobalFadeDuration, wait:false });
						fx4.start({ 'opacity' : 0 });
					
						var fx5 = new Fx.Styles(GalleryExpandImg, {duration:this.GlobalFadeDuration, wait:false });
						fx5.start({ 'opacity' : 0 });
						
						GalleryItemRollOver.setStyle('display', 'none');
						
					}.bind(this));
					
					
					this.GalleryNextImage(PicturePos);
					
				
				}.bind(this));
				
			}.bind(this)
			
		});	
	
	},
	
	GalleryNextImage : function(PicturePos) {
	
		var GalleryExpandPictureContainer = this.GalleryExpandPictureContainer;
		var GalleryExpandImg = this.GalleryExpandImg;
	
		GalleryExpandPictureContainer.removeEvents();
		
		GalleryExpandPictureContainer.addEvent('click', function() {
		
			PicturePos = PicturePos + 1;	
			if (PicturePos == this.GalleryPictures.length) {
				PicturePos = 0;
			}
		
			var NextGalleryItem = this.GalleryPictures[PicturePos];
		
			var GalleryItemLargeSrc;
			var GalleryItemName;
			var GalleryItemDescription;
			
			var PictureItemLink = NextGalleryItem.getElement('a');	
			var PictureItemImg = NextGalleryItem.getElement('img');	
			
			if (window.ie) {
				GalleryItemLargeSrc = PictureItemLink;
				alert(PictureItemLink);
			} else {
				GalleryItemLargeSrc = PictureItemLink.getProperty("href");
			}
			GalleryItemName = PictureItemImg.getProperty("alt");
			GalleryItemDescription = PictureItemImg.getProperty("title");
			
			GalleryExpandImg.src = GalleryItemLargeSrc;
		
		
		}.bind(this));
	
	},	
	
	GalleryLoadLargeImages : function() {
	
		new Asset.images(this.GalleryImagesArray, {
		    onComplete: function(){

		    }
		});
	
	}
	
});