var PhotoGallery = Class.create( {
	PhotoGalleryDivClassName : 'photo_gallery_div',
	ThumbContainerClassName : 'thumb_container',
	ScrollingThumbContainerClassName: 'scrolling_thumb_container',
	ThumbClassName : 'thumb',
	SeeAllDivClassName : 'see_all_div',

	initialize : function(photoGalleryDiv, artistsPage) {
		this.ArtistsPage = artistsPage;
		
		this.ScrollingThumbContainer = new Element('div').addClassName(this.ScrollingThumbContainerClassName);
		this.ThumbContainer = new Element('div').addClassName(this.ThumbContainerClassName).insert(this.ScrollingThumbContainer);
		
		this.ScrollUpAnchor = new Element('a').writeAttribute({href:''}).update('&#x25b2').observe('click', function(e) {
			e.stop();
			
			var marginTop = this.ScrollingThumbContainer.getStyle('margin-top');
			marginTop = parseInt(marginTop.substring(0, marginTop.indexOf('px')));
			
			if (marginTop + 52 < 0) {
				marginTop += 52;
				
				if (this.ScrollDownAnchor.hasClassName('disabled')) {
					this.ScrollDownAnchor.removeClassName('disabled');
				}
			} else {
				marginTop = 0;
			}
			
			if (marginTop == 0 && !this.ScrollUpAnchor.hasClassName('disabled')) {
				this.ScrollUpAnchor.addClassName('disabled');
			}
			
			this.ScrollingThumbContainer.setStyle({
				marginTop: marginTop + 'px'
			});
		}.bind(this)).addClassName('disabled');
		
		this.ScrollDownAnchor = new Element('a').writeAttribute({href:''}).update('&#x25bc').observe('click', function(e) {
			e.stop();
			
			var height = this.ScrollingThumbContainer.getHeight();
			var marginTop = this.ScrollingThumbContainer.getStyle('margin-top');
			marginTop = parseInt(marginTop.substring(0, marginTop.indexOf('px')));
			
			if (marginTop - 52 >= (-height + 52)) {
				marginTop -= 52;
				
				if (this.ScrollUpAnchor.hasClassName('disabled')) {
					this.ScrollUpAnchor.removeClassName('disabled');
				}
			} else {
				marginTop = -height + 52;
			}
			
			if (marginTop == (-height + 52) && !this.ScrollDownAnchor.hasClassName('disabled')) {
				this.ScrollDownAnchor.addClassName('disabled');
			}
			
			this.ScrollingThumbContainer.setStyle({
				marginTop: marginTop + 'px'
			});
		}.bind(this));
		
		this.SeeAllDiv = new Element('div').addClassName(this.SeeAllDivClassName).insert(this.ScrollUpAnchor).insert(this.ScrollDownAnchor).hide();
		
		this.PhotoGalleryDiv = $(photoGalleryDiv).addClassName(this.PhotoGalleryDivClassName);
		this.PhotoGalleryDiv.insert(this.ThumbContainer);
		this.PhotoGalleryDiv.insert(this.SeeAllDiv);
		
		this.IsEnlarged = false;
		this.ImageCount = 0;
		this.EnlargedImages = new Array();
		
		this.LoadPhotos(this.ArtistsPage.Artist.photos);
		
		var artistPhoto = this.ArtistsPage.ArtistPhoto == null ? null : this.PhotoGalleryDiv.down('img[src="' + this.ArtistsPage.ArtistPhoto.src + '"]');

		if (artistPhoto != null) {
			artistPhoto.addClassName('selected');
		}

		if (this.ImageCount > 8) {
			this.ThumbContainer.addClassName('overflow_hidden');
			this.SeeAllDiv.show();
		}
	},
	
	LoadPhotos : function (photos) {
		for (var i = 0; i < photos.length; i++) {
			this.AddPhoto(photos[i].photo_src);
		}
	},

	AddPhoto : function(imageSrc) {
		var selector = 'img[src="' + imageSrc + '"]';
		var image = this.PhotoGalleryDiv.down(selector);

		if (image == null) {
			image = $(new Image());
			image.hide();

			image.observe('load', function(event) {
				var data = $A(arguments);
				var image = data[1];
				var ratio = (40 / image.width) < (40 / image.height) ? 40 / image.width : 40 / image.height;

				image.setStyle({
					width: Math.floor(image.width * ratio) + 'px',
					height: Math.floor(image.height * ratio) + 'px'
				});

				image.show();

				if (this.ImageCount > 8) {
					this.SeeAllDiv.show();
					this.ThumbContainer.addClassName('overflow_hidden');
				}
			}.bindAsEventListener(this, image));

			image.src = imageSrc;
			
			if (this.ArtistsPage.ArtistPhoto != null && this.ArtistsPage.ArtistPhoto.src == image.src) {
				image.addClassName('selected');
				this.DefaultPhoto = this.ArtistsPage.ArtistPhoto;
			}

			var imageWrapper = new Element('div').addClassName('thumb');

			imageWrapper = image.wrap(imageWrapper);
			imageWrapper.observe('mouseover', this.OnThumbMouseOver.bind(this));
			imageWrapper.observe('mouseout', this.OnThumbMouseOut.bind(this));

			this.ScrollingThumbContainer.insert({top: imageWrapper});
			var originalImage = new Image();
			originalImage.src = image.src;
			image.EnlargedImagesIndex = this.EnlargedImages.push(originalImage) - 1;
			this.ImageCount++;
		}
	},

	OnThumbMouseOver : function(event) {
		event.stop();
		var wrapper;

		if (event.element().hasClassName('thumb')) {
			wrapper = event.element();
		} else {
			wrapper = event.element().up('.thumb');
		}
		
		var previousImage = wrapper.up('.thumb_container').down('img.selected')

		if (previousImage != null) {
			previousImage.removeClassName('selected');
		}
		
		var image = wrapper.down('img').addClassName('selected');
		var enlargedImage = this.EnlargedImages[image.EnlargedImagesIndex];
		this.ArtistsPage.SetArtistPhoto(enlargedImage);
	},

	OnThumbMouseOut : function(event) {
		event.stop();
		var wrapper;

		if (event.element().hasClassName('thumb')) {
			wrapper = event.element();
		} else {
			wrapper = event.element().up('.thumb');
		}
		
		var previousImage = wrapper.up('.thumb_container').down('img.selected')

		if (previousImage != null && previousImage.src != this.DefaultPhoto.src) {
			previousImage.removeClassName('selected');
			this.ArtistsPage.SetArtistPhoto(this.DefaultPhoto);
			wrapper.up('.thumb_container').down('img[src="' + this.DefaultPhoto.src + '"]').addClassName('selected');
		}
	}
});