var ImageGallery = Class.create({
	initialize: function(options) {
		
		this.setOptions(options);
		this.currentIndex = this.options.startIndex;
		
		var thumbNails = $$('.'+this.options.thumbClass);
		
		thumbNails.each(function(thumb) {
			thumb.observe('click', this.showImage.bindAsEventListener(this, thumb));
		}.bind(this));

		// setup the default image
		var defaultImage = $(this.options.imagePrefix + this.currentIndex);
		Element.setStyle(defaultImage, {display: ''});
		Element.setOpacity(defaultImage, 1.0);
		Element.addClassName($(this.options.thumbPrefix + this.currentIndex), this.options.selectedClass);
	},
	
	showImage: function(event, thumb) {
		var id = this.getId(thumb);

		if(id != this.currentIndex) {
			var currentImage = $(this.options.imagePrefix + this.currentIndex);
			var newImage = $(this.options.imagePrefix + id);

			Element.setOpacity( currentImage, 1.0 );
			Element.setOpacity( newImage, 0.0 );
			
			Element.setStyle(newImage, {display: ''});

			new Effect.Opacity(currentImage, {duration:this.options.transition_time, from:1.0, to:0.0, afterFinish: function() {Element.setStyle(currentImage, {display: 'none'});}.bind(this)});
			new Effect.Opacity(newImage, {duration:this.options.transition_time, from:0.0, to:1.0, afterFinish: function() {Element.setStyle(newImage, {display: ''});}.bind(this)});
			
			Element.removeClassName($(this.options.thumbPrefix + this.currentIndex), this.options.selectedClass);
			Element.addClassName($(this.options.thumbPrefix + id), this.options.selectedClass);
			
			this.currentIndex = id;
		}
	},
	
	showNext: function() {
		var elm = $(this.options.thumbPrefix+parseInt(this.currentIndex+1));
		if(elm)
			this.showImage("null", elm);
	},
	
	showPrevious: function() {
		var elm = $(this.options.thumbPrefix+parseInt(this.currentIndex-1));
		if(elm)
			this.showImage("null", elm);
	},
	
	getId: function(thumb) {
		return parseInt(thumb.id.replace(this.options.thumbPrefix,''));
	},

	setOptions: function (options) {
		this.options = {
			imageContainer: 'image_gallery_container',
			thumbPrefix: 'thumb_',
			imagePrefix: 'image_',
			thumbClass: 'gallery_thumb',
			transition_time: .5,
			selectedClass: 'thumb_selected',
			startIndex: 0 // image id to start on
		};
		Object.extend(this.options, options || {});
	}
});