var Promobox = Class.create({
	initialize: function(id,w,h,elW,elH,changeTime,border) {
		this.id = id;
		this.w = w;
		this.h = h;
		this.border = border;
		this.elW = elW;
		this.elH = elH;
		this.changeTime = changeTime;
		this.items = new Array();
		this.thisItem = 0;
		this.opacityOff = 0.7;
		this.locked = false;
		this.playing = true;
	},
	
	add: function(promoboxItem)
	{
		this.items.push(promoboxItem);
	},
	
	place: function(locationId)
	{
		var output = "<div style='width: " + this.w + "px; height: " + this.h + "px;' id='" + this.id + "'><div id='" + this.id + "-scroll'>";
		
		if ( this.items.length > 0 )
		{
			var remainingWidth = this.w - this.elW;
			var itemWidthPercentage = ( ( remainingWidth / this.w ) / ( this.items.length - 1 ) );

			for( var i = 0; i < this.items.length; i++ )
			{
				var thisItemWidth = Math.ceil(itemWidthPercentage*this.w)-this.border + "px";
				var extraClass = "link-off";
				
				if ( i == 0 )
				{
					thisItemWidth = this.elW-this.border + "px";
					extraClass = "link-on";
				}
					
				output += "<div style='width: " + thisItemWidth + "; height: " + this.elH + "px' id='" + this.id + "-item-" + i + "' class='" + this.id + "-item'>";
				output += "<a href='#' style='width: " + thisItemWidth + "; height: " + this.elH + "px; background-repeat: no-repeat; background-image: url( \"" + unescape(this.items[i].titleSrc) + "\" ); background-position: 8px bottom;' id='" + this.id + "-link-" + i + "' class='" + this.id + "-link " + extraClass + "'></a>";
				output += "<div id='" + this.id + "-content-" + i + "' class='" + this.id + "-content'></div>";
				output += "</div>";
			}
		}
		else
		{
			output += "No items have been added";
		}
		output += "</div></div>";
		$(locationId).innerHTML = output;
		
		if ( this.items.length > 0 )
		{
			for( j = 0; j < this.items.length; j++ )
			{
				this.items[j].placeContent(this.id + "-content-" + j);
				this.j = j;
				$(this.id + "-link-" + j).setOpacity(this.opacityOff);
				$$(".link-on").each( function(el){el.hide()} );
				
				Event.observe($(this.id + "-link-" + j), "click", function(event){
					this.pause();
					this.setThisItem(event.element().id.split("-").last());
					this.playSelected();
					event.stop();
				}.bind(this));
			}
		}
	},
	
	pause: function()
	{
		this.playing = false;
	},
	
	play: function()
	{
		this.playing = true;
		new PeriodicalExecuter( function(pe){ pe.stop(); this.playNext() }.bind(this), this.items[this.getThisItem()].showTime );																											 
	},
	
	playNext: function()
	{
		if ( !this.playing )
			return;
			
		this.setThisItem(this.getNextItem());
		this.playSelected();
	},
	
	playSelected: function()
	{
		if ( this.locked )
			return;
		
		this.locked = true;
		var effects = [];
		$$(".link-on").each( function(el){
			var elItem = $(this.id + "-item-" + el.id.split("-").last());										 
			new Effect.Parallel([
				new Effect.Morph(el, { sync: true, style: {width: $(this.id + "-link-" + this.getThisItem()).getWidth() + "px"}, afterFinish: function(effect){ effect.element.addClassName("link-off"); effect.element.removeClassName("link-on"); }}),
				new Effect.Morph(elItem, { sync: true, style: {width: $(this.id + "-link-" + this.getThisItem()).getWidth() + "px" }}),
				new Effect.Morph($(this.id + "-link-" + this.getThisItem()), { sync: true, style: {width: el.getWidth() + "px" }, afterFinish: function(effect){ effect.element.addClassName("link-on"); effect.element.removeClassName("link-off"); }}),
				new Effect.Morph($(this.id + "-item-" + this.getThisItem()), { sync: true, style: {width: el.getWidth() + "px" }}),
				new Effect.Fade($(this.id + "-link-" + this.getThisItem()), {sync: true}),
				new Effect.Appear(el, {sync: true, to: this.opacityOff})
			],{duration: this.changeTime, afterFinish: function(){

				if ( this.playing )
					new PeriodicalExecuter( function(pe){ pe.stop(); this.playNext() }.bind(this), this.items[this.getThisItem()].showTime );																											 
	
				this.locked = false;
			}.bind(this)});
		}.bind(this));
	},
	
	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;
	}
});

var PromoboxItem = Class.create({
	initialize: function(titleSrc,url,src,isImg,showTime) {
		this.url = url;
		this.titleSrc = titleSrc;
		this.src = src;
		this.isImg = isImg;
		this.showTime = showTime;
		if ( this.isImg )
		{
			var img = new Image();
			img.src = src;
		}
	},
	
	placeContent: function(elId) {
		var target = "_parent";
		if ( this.url.startsWith("http") )
			target = "_blank";
			
		if ( this.isImg )
			$(elId).innerHTML = "<a href='" + this.url + "' target='" + target + "'><img src='" + this.src + "' /></a>";
		else
			new Ajax.Request(this.src, {onSuccess: function(transport){ $(elId).innerHTML = transport.responseText }});
	}
});