// Script that loads and populates Slideshow

var gm_s_curr = new Array(); // current active 
var gm_s_count = new Array(); // total slides

// parse XML
function gm_s_parse(xml, box, index)
{
	var ul;
	gm_s_count[index] = $(xml).find('slideshow').find('items').find('item').length;
	
	// config
	if ($(xml).find('config').text() != '')
	{
		$(box).css("background-image", "url('" + $(xml).find('config').text() + "')");
	}
	$(box).css("background-color",$(xml).find('config').attr("bg"));

	// add controls
	$(box).append("\
			<a href=\"#slideshow"+index+"\" class=\"gm-s-left\"></a>\
			<a href=\"#slideshow"+index+"\" class=\"gm-s-right\"></a>\
	");

	// add title
	$(box).append("\
			<div class=\"gm-s-title\">\
				<span></span>\
			</div>\
	");
	
	// add image box 
	$(box).append("\
			<div class=\"gm-s-img\">\
				<a href=\"#slideshow"+index+"\"></a>\
			</div>\
	");

	// width of image box 
	var image_box = $(box).find(".gm-s-img a");
	var count = $(xml).find('slideshow').find('items').find('item').length;
	$(image_box).css("width",(642 * count) + "px");

	// add images
	$(xml).find('slideshow').find('items').find('item').each(function(i){
		$(image_box).append("<img src=\"" + $(this).find('imgUrl').text() + "\" alt=\"" + $(this).find('title').text() + "\" width=\"642\"/>");
	});

	// tumbs holder
	$(box).append("\
			<div class=\"gm-s-wrapper\">\
				<ul class=\"gm-s-thumb\">\
				</ul>\
			</div>\
	");

	// size thumbs holder
	var holder = $(box).find(".gm-s-thumb");
	$(holder).css("width",(131 * count) + "px");

	// add thumbs
	$(xml).find('slideshow').find('items').find('item').each(function(i){
		$(holder).append("\
				<li>\
					<a href=\"#slideshow"+index+"\">\
						<img src=\"" + $(this).find('thumb').text() + "\" width=\"109\" height=\"88\" rel=\"" + i + "\" />\
					</a>\
				</li>\
		");
	});

	// assign click on thumbs
	$(box).find(".gm-s-thumb a").click(function(){
		gm_s_activate(Number($(this).find('img').attr("rel")), index);
	});

	// assign click on main image (next, next, next)
	$(box).find(".gm-s-img a img").click(function(){
		if ($(this).index() != gm_s_count[index] - 1)
		{
			gm_s_activate($(this).index()+1, index);
		}
		else {
			gm_s_activate(0, index);
		}
	});

	// assign click navigation
	$(box+" .gm-s-left").click(function(){
		if (gm_s_curr[index] > 0)
		{
			gm_s_activate(Number(gm_s_curr[index])-1, index);
		}
	});
	$(box+" .gm-s-right").click(function(){
		if (gm_s_curr[index] < gm_s_count[index] - 1)
		{
			gm_s_activate(Number(gm_s_curr[index])+1, index);
		}
	});

	// initial view (activate first)
	gm_s_activate(0, index);

}

// activates an item.
function gm_s_activate(id, index) {

	// current active
	gm_s_curr[index] = id;

	// remove current active
	var thumb = $("#gm-slideshow"+index+" .gm-s-thumb");
	$(thumb).find("a.active").removeClass("active");

	// activate next current
	$(thumb).find("a:eq(" + id + ")").addClass("active");

	// update title
	$("#gm-slideshow"+index+" .gm-s-title").html( "<span>" + (id+1) + "/" + (gm_s_count[index]) + "</span>" + $("#gm-slideshow"+index+" .gm-s-img a img:eq(" + id + ")").attr("alt"));

	// slide to correct image on big image box
	$("#gm-slideshow"+index+" .gm-s-img a").animate({
			left: -(642 * id) + "px"
		},
		600,
		'easeOutCubic'
	);

	// need to scroll?
	$(thumb).animate({
			left: -(131 * id)
		},
		600,
		'easeOutCubic'
	);

	
}