// XML JQuery Slideshow ----------
//Written by Matthew Robinson 2009
//--------------------------------

// Global Variables

var xmlDoc;
var slides;
var slideCount = 1;
var currentSlide;
var slideArray = new Array();

var width;
var height;
var slideSpeed;
var slideFade;

//------------------------------------------------------------------------------------------------------------------

function init()
{
	$.ajax
	({
		type: "GET",
		url: "_includes/xml/slideshow.xml",
		dataType: "xml",
		success: function(xml) 
			{
				// Get Slideshow Settings
				
				$(xml).find('slideshow').each(function()
				{		
					width = $(this).attr('width');
					height = $(this).attr('height');
					slideSpeed = $(this).attr('slide-speed');
					slideFade = $(this).attr('slide-fade');
				});
				
				$(xml).find('slide').each(function()
				{		
					var image = $(this).find('image').attr('url');
					var caption = $(this).find('caption').attr('text');
					
					var slide = new Slide(slideCount, width, "div#slideshow-mask", image, caption);
					slideArray.push(slide);
					slideCount++;
				});
				
				setEnvironment();
				addControl();
			}
		
	});

}

function Slide(sCount, sWidth, sTarget, sImage, sCaption)
{
	var count = sCount;
	var width = sWidth;
	this.caption = sCaption;

	$(sTarget).append("<div id=\"slide" + count + "\" class=\"slide-layer\" style=\"width:"+ width +"px;\"></div>");
	
	$("div#slide" + count + "").append("<div style=\"height: " + (height + "px").toString() + "\"><img class=\"slide-image\"src=\"_includes/images/slideshow/" + sImage + "\" alt=\"Slide Image\"/></div>");
	
	$("ul#slideshow-controls").append("<li><a href=\"#\" id=\""+ (count - 1) + "\">" + count + "</a></li>");
}

function jumpSlide(evtTarget)
{
	var xPos = (0 - ((evtTarget.id) * width)) + "px".toString();
	if (currentSlide != Number(evtTarget.id))
	{
		animateSlide(xPos, Number(evtTarget.id));
	}
}

function nextSlide()
{
	if (currentSlide < (slideCount - 2))
	{
		var nextSlide = Number(currentSlide) + 1;
		var xPos = (0 - ((nextSlide) * width)) + "px".toString();
		animateSlide(xPos, nextSlide);
	}
	
}

function prevSlide()
{
	if(currentSlide > 0)
	{
		var prevSlide = Number(currentSlide) - 1;
		var xPos = (0 - ((prevSlide) * width)) + "px".toString();
		
		animateSlide(xPos, prevSlide);
	}
}

function animateSlide(xPos, slideId)
{
		$("div#caption-block").html("<p>Loading...</p>");
		$("div#slideshow-mask").animate({ marginLeft: xPos }, slideSpeed, function(evt)
		{
			 // Returns all images to default hidden state.
			 $("img.slide-image").css({'display': 'none'});
			 // Transitions targetted image.
			 $("div#slide" + (Number(slideId) + 1) + " .slide-image").fadeIn(slideFade);
			 $("div#caption-block").html("<p>"+ slideArray[Number(slideId)].caption.toString() + "</p>");
		});	
		
		currentSlide = Number(slideId);
}

function setEnvironment()
{
	currentSlide = Number(0);
	
	var maskCSS = {'width' : ((width * (slideCount)) + "px").toString()};
	var containerCSS = {'width' : (width + "px").toString()};
	
	$("div#slideshow-mask").css(maskCSS);
	$("div#slideshow-container").css(containerCSS);
	
	// Displays first image
	$("div#slide1 div img").css({'display' : 'block'});
	$("div#caption-block").html("<p>"+ slideArray[0].caption.toString() + "</p>")
}

function addControl()
{
	$("ul#slideshow-controls li a").bind('click', function(evt)
		{
			jumpSlide(this);
		});
	
	$("div#control-block a#next").bind('click', function(evt)
	{
		nextSlide();
	});
	
	$("div#control-block a#prev").bind('click', function(evt)
	{
		prevSlide();
	});
}