// JavaScript Document

var slideshow_total_slides;
var slideshow_current_slide;

$(function(){
	slideshow_total_slides = $("#slideshow #slides .slide:gt(0)").length;
	slideshow_current_slide = 0;
	
	$("#slideshow #buttons ul li").each(function()
	{
		$(this).hover(
			function() { $(this).addClass('ui-state-hover'); },
			function()
			{
				if (!$(this).hasClass('ui-state-selected'))
				{
					$(this).removeClass('ui-state-hover');
				}
			}
		)
	});
	
	$("#slideshow #buttons ul li:eq(0)").click(function(){
		$("#slideshow #progressbar div").stop().width("100%");												
		$("#slideshow #buttons ul li:gt(1)").removeClass('ui-state-hover ui-state-selected');
		previous_slide();
	});		
	
	$("#slideshow #buttons ul li:eq(1)").click(function(){
		$("#slideshow #progressbar div").stop().width("100%");							
		$("#slideshow #buttons ul li:gt(1)").removeClass('ui-state-hover ui-state-selected');
		next_slide();
	});
	
	$("#slideshow #buttons ul li:gt(1)").each(function(){
		$(this).click(function(){
			$("#slideshow #buttons ul li.ui-state-selected").removeClass('ui-state-hover ui-state-selected');
			$(this).addClass('ui-state-selected');
			var slide_id = $(this).attr("id").substr(12);
			view_slide(slide_id);
		});
	});
	
	//Cargamos todas las imagenes de los slides
	$("#slideshow #slides .slide").each(function(i){
		var background_image = $(this).css("background-image");
		background_image = background_image.substr(4, background_image.length - 5);
		var slide_image = new Image();
		slide_image.src = background_image;
	});
});

function start_slideshow()
{
	slideshow_current_slide = 1;
	
	$("#slideshow #slides #slide0").fadeOut("slow",
		function()
		{
			$("#slideshow #buttons ul li#button_slide1").addClass('ui-state-hover ui-state-selected');
			$("#slideshow #slides #slide" + slideshow_current_slide).fadeIn("slow",
				function()
				{
					$("#slideshow #progressbar div").animate({width: "100%"}, 10000, "linear", next_slide);
				}
			);
		}
	);
}

function view_slide(slide_id)
{
	$("#slideshow #progressbar div").stop().width("100%");
	$("#slideshow #slides #slide" + slideshow_current_slide).fadeOut("slow",
		function()
		{
			slideshow_current_slide = slide_id
			
			$("#slideshow #buttons ul li.ui-state-selected").removeClass('ui-state-hover ui-state-selected');
			$("#slideshow #buttons ul li#button_slide" + slideshow_current_slide).addClass('ui-state-hover ui-state-selected');
			$("#slideshow #slides #slide" + slideshow_current_slide).fadeIn("slow",
				function()
				{
					$("#slideshow #progressbar div").width(0).animate({width: "100%"}, 10000, "linear", next_slide);
				}
			);
		}
	);
}

function next_slide()
{
	$("#slideshow #slides #slide" + slideshow_current_slide).fadeOut("slow",
		function()
		{
			if (slideshow_current_slide == slideshow_total_slides)
			{
				slideshow_current_slide = 1;
			}
			else
			{
				slideshow_current_slide++;
			}
			
			$("#slideshow #buttons ul li.ui-state-selected").removeClass('ui-state-hover ui-state-selected');
			$("#slideshow #buttons ul li#button_slide" + slideshow_current_slide).addClass('ui-state-hover ui-state-selected');
			$("#slideshow #slides #slide" + slideshow_current_slide).fadeIn("slow",
				function()
				{
					$("#slideshow #progressbar div").width(0).animate({width: "100%"}, 10000, "linear", next_slide);
				}
			);
		}
	);
}

function previous_slide()
{
	$("#slideshow #slides #slide" + slideshow_current_slide).fadeOut("slow",
		function()
		{
			if (slideshow_current_slide == 1)
			{
				slideshow_current_slide = slideshow_total_slides;
			}
			else
			{
				slideshow_current_slide--;
			}
			
			$("#slideshow #buttons ul li.ui-state-selected").removeClass('ui-state-hover ui-state-selected');
			$("#slideshow #buttons ul li#button_slide" + slideshow_current_slide).addClass('ui-state-hover ui-state-selected');
			$("#slideshow #slides #slide" + slideshow_current_slide).fadeIn("slow",
				function()
				{
					$("#slideshow #progressbar div").width(0).animate({width: "100%"}, 10000, "linear", next_slide);
				}
			);
		}
	);	
}

$(window).load(
	function()
	{
		start_slideshow();
	}
);