// JavaScript Document
var $ = jQuery;
var i = 0;

function createSlideshow(slideShow){
	slideShow.append('<div class="mask"><div class="slides"></div></div>');
	var mask = $('.mask');
	var slides = $('.slides');
	var images = slideShow.find("li");
	var totalWidth = 0;
	
	mask.append(slides);
	images.each(function(){
		i = i + 1;
		var image = 'url(' + $(this).html() + ');';
		slides.append('<div id="' + i + '" class="slide" style="background-image:' + image + '"></div>');
		$('.slide').width(mask.width());
		$('.slide').height(mask.height());
	});
	
	$('.slide').each(function(){
		totalWidth = totalWidth + $(this).width();
		slides.width(totalWidth);
	});
	
	animateSlideshow($('.slide').first().attr('id'));
};

function animateSlideshow(slide){
	var slideId = parseInt(slide);
	var slideLength = $('.slide').length;
	if(slideId == slideLength){
		$('.slides').animate({'left' : '0px'}, 6000, function(){ animateSlideshow(1) }).delay(5000);
	} else if(slideId == 1){
		setTimeout("$('.slides').animate({'left' : '-=680px'}, 6000, function(){ animateSlideshow(" + slideId + " + 1) }).delay(5000)", 5000);
	} else {
		$('.slides').animate({'left' : '-=680px'}, 6000, function(){ animateSlideshow(slideId + 1) }).delay(5000);
	}

};