/**
 * this function creates a slideshow inside element with specified selector
 * Arguments:
 * selector: selector of the container
 * ids: an array contains ids of containers with slides
 */
function slideShow(selector,ids){
	if(ids.length==0){
		return;
	}
	jQuery(selector).html('<div class="slideshowContent" /><nav class="slideshowNav"/>');
	
	var f = {};
	var t = [];
	var callback = function(fname){
		var tout = setTimeout(function(){
			// hide
			jQuery(selector+" .slideshowContent").hide("slide",{direction:"right"},"fast",f[fname]);
		},7000);
		t.push(tout)
	};
	var navHtml = ['<ul>'];
	
	for(var i=0;i<ids.length;i++){
		//here create  a copy of i
		(function(e) {
			var id = ids[e];
			var fName =  "f"+e;
			
			if(e==ids.length-1){
				var nextFName = "f0";
			}else{
				var nextFName =  "f"+(e+1);
			}
			
			if(e==0){
				navHtml.push('<li><a class="active slideshow-id-'+e+'"></a></li>');
			}else{
				navHtml.push('<li><a class="slideshow-id-'+e+'"></a></li>');
			}
				

			//console.log("creating function with name: "+"f"+e +" and the next id="+fname);
			f[fName] = function(){
				//console.log("call function with name: "+"f"+e +" and the next id="+fname);
				jQuery(selector+ " .slideshowNav a").removeClass("active");
				jQuery(selector+ " .slideshowNav a.slideshow-id-"+e).addClass("active");
				jQuery(selector +" .slideshowContent").empty().html(jQuery(id).html()).show("slide",{direction:"left"},"slow",callback(nextFName));
			};
	    })(i);
		// end of creating copy of i
	}
	navHtml.push('</ul>')

	f.f0();
	
	// inject pager at the bottom
	jQuery(selector +" nav").html(navHtml.join(""));
	jQuery(selector+ " .slideshowNav a").click(function(e){
		e.preventDefault();
		jQuery(selector+ " .slideshowNav a").removeClass("active");
		var c = jQuery(this).attr("class");
		//extract the number
		var index = c.lastIndexOf("-");
		var fName = "f"+c.substring(index+1);
		for(var i=0; i<t.length;i++){
			clearTimeout(t[i]);
		}
		t = [];
		f[fName]();
	});
}


jQuery(document).ready(function(){

	if(jQuery("#home-slideshow").size()===1){
		
		slideShow("#home-slideshow",['#slide1','#slide2']);
	}
});