var ProductPhotoAlbum = Class.create();

ProductPhotoAlbum.prototype = {
	initialize : function (imageArray, detailImageId, thumbnailListId, options) {
		this.images = imageArray;
		this.detailImage = $(detailImageId);
		this.thumbnailList = $(thumbnailListId);
		this.imageElements = [];
		this.thumbnailIdPrefix = "productThumbnail";
		this.selectedIndex = 0;

		if (! options) { options = {}};
		this.options = {
			defaultImage : (options.defaultImage) ? options.defaultImage : ""
		};

		this.setupAlbumDisplay();
	},
	setupAlbumDisplay : function () {
		if (this.options.defaultImage != "") {
			this.detailImage.src = this.options.defaultImage;
		} else if (this.images.length > 0) {
			this.detailImage.src = this.images[0].imageUrl;
		}

		if (this.images.length > 1) {
			this.buildThumbnailList();

			Element.show(this.thumbnailList);
		} else {
			Element.hide(this.thumbnailList);
		}
	},
	buildThumbnailList : function () {
		var thumbnailId = "";
		var classes = "";
		this.thumbnailList.innerHTML = "";

		for (var i = 0; i < this.images.length; i++) {
			thumbnailId = this.thumbnailIdPrefix + "_" + i;

			if (i == 0) {
				classes = "selected";
			} else {
				classes = "";
			}

			// Add the image to the thumbnail list
			this.thumbnailList.innerHTML += '<img id="' + thumbnailId + '" src="' + this.images[i].thumbUrl + '" class="' + classes + '" />';
		}

		// Observe click events
		for (var i = 0; i < this.images.length; i++) {
			thumbnailId = this.thumbnailIdPrefix + "_" + i;
			Event.observe(thumbnailId, "click", this.onImageSelect.bindAsEventListener(this));
		}
	},
	onImageSelect : function (event) {
		var imageIdSplit = Event.element(event).id.split("_");
		var imageIndex = imageIdSplit[imageIdSplit.length - 1];

		if (this.selectedIndex != imageIndex) {
			if (this.selectedIndex != null) {
				$(this.thumbnailIdPrefix + "_" + this.selectedIndex).removeClassName("selected");
			}
			$(this.thumbnailIdPrefix + "_" + imageIndex).addClassName("selected");
			this.detailImage.src = this.images[imageIndex].imageUrl;
			this.selectedIndex = imageIndex;	
		}
	}
};