var slideshow = {

	loop : 10,

	rootElement : ("onorientationchange" in window) ? $(document) : $(window), // hack to acccount for iOS
  imgRatio : (1600/1067), 
	bgImg : '',
	bgWidth : 0,
	bgHeight : 0,
	bgOffset : 0,
	bgCSS : '',

	init : function()
	{
		this.container = $("#slideshow");

		$("img",this.container).hide();

		this.number_of_images = this.imgs.length;
		if(this.number_of_images==0) return false;

		this.current_image = 0;
		this.previous_image = null;
		this.current_loop = 0;
		this.playing = true;

		this.imgloadtimeout = setTimeout('slideshow.loadImages()',500);

		// Adjust the background size when the window is resized or orientation has changed (iOS)
    $(window).resize(slideshow._adjustBG);
	},

	loadImages : function()
	{
		$.each(this.imgs,function(i) {
			this.preload = new Image();
			this.preload.onload = function() { slideshow.isLoaded(i); };
			this.preload.src = this.src;
		});
	},

	isLoaded : function(i)
	{
		this.imgs[i].loaded = (this.imgs[i].preload.width!=0) ? true : null;
		if(i==0) {
			setTimeout('slideshow.showImage()',1000);
			//this.showImage();
		}
	},

	showImage : function()
	{
		// if we're the first use of show image then fade in and add the back image
		if( $("#slideshow img").length == 1) {

			$("img:first",this.container).attr({	src:this.imgs[this.current_image].src,
																						alt:this.imgs[this.current_image].alt });

			slideshow._adjustBG(function(){
				$("#slideshow img:first").fadeIn(1500, function(){
					slideshow.advanceCount();
					slideshow.addBackImage();
				});
			});
		}
		// if not then just add behind
		else 
		{
			slideshow.addBackImage();			
		}

		// trigger fadeOut if required
		if(this.current_loop<this.loop && this.number_of_images>1 && this.playing==true) {
				this.imgtimeout = setTimeout('slideshow.fadeImage()',3000);
		} else {
				this.pause();
		}

	},

	addBackImage : function()
	{
		//console.log('adding back image'+this.current_image+'-'+this.current_loop)
		$("<img />").attr({	src:this.imgs[this.current_image].src,
												alt:this.imgs[this.current_image].alt})
								.prependTo("#slideshow");

		$("#slideshow img").width( slideshow.bgWidth ).height( slideshow.bgHeight ).css(slideshow.bgCSS);
		slideshow.advanceCount();
	},

	fadeImage : function()
	{
		$("#slideshow img:last").fadeOut(1500, function(){
			$(this).remove();
		});
		slideshow.showImage();
	},

	advanceCount : function()
	{	
		this.previous_image=this.current_image;

		if(this.current_image!=this.number_of_images-1) {
			this.current_image++;
		}	else { 
			this.current_image=0;
			this.current_loop++;
		}
	},

	pause : function()
	{
		clearTimeout(this.imgtimeout);
	},

	_adjustBG : function(fn)
	{
		try {
			slideshow.bgCSS = {left: 0, top: 0};
			slideshow.bgWidth = slideshow.rootElement.width();			
			slideshow.bgHeight = slideshow.bgWidth / slideshow.imgRatio;

			if(slideshow.bgHeight >= slideshow.rootElement.height()) {
				slideshow.bgOffset = (slideshow.bgHeight - slideshow.rootElement.height()) /2;
				$.extend(slideshow.bgCSS, {top: "-" + slideshow.bgOffset + "px"});
			} else {
				slideshow.bgHeight = slideshow.rootElement.height();
				slideshow.bgWidth = slideshow.bgHeight * slideshow.imgRatio;
				slideshow.bgOffset = (slideshow.bgWidth - slideshow.rootElement.width()) / 2;
				$.extend(slideshow.bgCSS, {left: "-" + slideshow.bgOffset + "px"});
			}
			$("#slideshow img").width( slideshow.bgWidth ).height( slideshow.bgHeight ).css(slideshow.bgCSS);
    } catch(err) {
    }
    if (typeof fn == "function") fn();
	}

};

window.onunload = function() { 
	clearTimeout(this.linktimein);
	slideshow.pause();
};


$(document).ready(function(){
	$.getJSON("/slideshow", function(data) {
		slideshow.imgs = data.images;
		slideshow.init();
	});
});