var Gallery = Class.create({
	initialize: function(id,w,h,fadeTime) {
		this.galleryId = id;
		this.w = w;
		this.h = h;
		this.fadeTime = fadeTime;
		this.items = new Array();
		this.thisItem = 0;
		this.pe = null;
	},
	
	add: function(galleryPhoto)
	{
		this.items.push(galleryPhoto);
	},
	
	place: function(locationId)
	{
		var output = "<div style='text-align: left; width: " + this.w + "px; height: " + this.h + "px;' id='" + this.galleryId + "'>";
		
		if ( this.items.length > 0 )
		{
			output += "<div style='position: absolute; text-align: left; width: " + this.w + "px; height: " + this.h + "px; z-index: 11; display: none;' id='" + this.galleryId + "-load'><img style='width: " + this.w + "px; height: " + this.h + "px;' id='" + this.galleryId + "-load-img' src='images/spacer.gif' /></div>";
			output += "<div style='position: absolute; text-align: left; width: " + this.w + "px; height: " + this.h + "px; z-index: 10; ' id='" + this.galleryId + "-main'><img style='width: " + this.w + "px; height: " + this.h + "px;' id='" + this.galleryId + "-main-img' src='" + this.items[this.getThisItem()].src + "' /></div>";
		}
		else
		{
			output += "No images have been added";
		}

		output += "</div>";
		
		$(locationId).innerHTML = output;
	},
	
	check: function()
	{
		return !( !$(this.galleryId + "-main") || !$(this.galleryId + "-load") )
	},

	play: function()
	{
		if ( !this.check() )
			return;
			
		this.preloadSurrounding();
		new PeriodicalExecuter( function(pe){ pe.stop(); this.playNext() }.bind(this), this.items[this.getThisItem()].showTime );																											 
	},
	
	playNext: function()
	{
		this.setThisItem(this.getNextItem());
		this.playSelected();
	},
	
	playSelected: function()
	{
		if ( !this.check() )
			return;
			
		$(this.galleryId + "-main").show();
		$(this.galleryId + "-load").hide();
		
		Event.observe( $(this.galleryId + "-load-img"), "load", function(event){
			if ( !this.check() )
				return;
				
			Event.stopObserving($(this.galleryId + "-load-img"));

			Effect.Appear(this.galleryId + "-load", {duration: this.fadeTime, afterFinish: function(){

				if ( !this.check() )
					return;
				
				$(this.galleryId + "-main").hide();
				
				// make the swap
				$(this.galleryId + "-main").setAttribute("id", this.galleryId + "-tmp");
				$(this.galleryId + "-load").setAttribute("id", this.galleryId + "-main");
				$(this.galleryId + "-tmp").setAttribute("id", this.galleryId + "-load");
				var tmpZIndex = $(this.galleryId + "-main").style.zIndex;
				$(this.galleryId + "-main").style.zIndex = $(this.galleryId + "-load").style.zIndex;
				$(this.galleryId + "-load").style.zIndex = tmpZIndex;

				$(this.galleryId + "-main-img").setAttribute("id", this.galleryId + "-tmp-img");
				$(this.galleryId + "-load-img").setAttribute("id", this.galleryId + "-main-img");
				$(this.galleryId + "-tmp-img").setAttribute("id", this.galleryId + "-load-img");

				new PeriodicalExecuter( function(pe){ pe.stop(); this.playNext(); }.bind(this), this.items[this.getThisItem()].showTime );																											 
			}.bind(this)});
		}.bindAsEventListener(this));
		$(this.galleryId + "-load-img").setAttribute( "src", this.items[this.getThisItem()].src );
	},
	
	preloadSurrounding: function()
	{
		var imgNext = new Image();
		imgNext.src = this.items[this.getNextItem()].src;
		//var imgLast = new Image();
		//imgLast.src = this.items[this.getLastItem()].src;
	},	

	getThisItem: function()
	{
		return this.thisItem;
	},

	setThisItem: function(i)
	{
		this.thisItem = i;
	},

	getNextItem: function()
	{
		if ( this.getThisItem() + 1 >= this.items.length )
			return 0;
		else
			return this.getThisItem() + 1;
	},
	
	getLastItem: function()
	{
		if ( this.getThisItem() - 1 >= 0 )
			return this.getThisItem() - 1;
		else
			return this.items.length - 1;
	}
	
});

var GalleryPhoto = Class.create({
	initialize: function(src,showTime) {
		this.src = src;
		this.showTime = showTime;
	}
});