$(document).ready(function(){
	updateSlideShow();
});

var timer;

function slideTimer(){
	timer = setInterval("nextSlide()",2000);
}

function nextSlide(){
	var current = $('#slides').children('img:visible');
	current.fadeOut();
	var next;
	if(current.next().is('img')){
		next = current.next().fadeIn();
	} else {
		next = current.parent().children(':first').fadeIn();
	}

	$('#thumbnails').children('li').children('img').parent().removeClass('current');
	$('#thumbnails').children('li').children('img[sid=' + next.attr('sid') + ']').parent().addClass('current');
}

function updateSlideShow(){
	
	if(timer){
		clearInterval(timer);
	}
	
	$('#slides').after('<ul id="thumbnails" style="list-style-type:none;" />');
	
	$('#slides').children('img').each(function(i){
		$('#thumbnails').append('<li class="ui-corner-all"><img sid="' + i + '" class="thumbnail" src="' + $(this).attr('src') + '" /></li>');
		$(this).addClass('off stage').attr('sid',i);
	});
	
	slideTimer();
	
	$('#thumbnails').children('li').children('img').click(function(){
		clearInterval(timer); 
		$('#slides').children('img:visible').fadeOut();
		$('#slides').children('img[sid=' + $(this).attr('sid') + ']').fadeIn();
		
		$(this).parent().parent().children('.current').removeClass('current');
		$(this).parent().addClass('current');
		return false;
	});
	
	$('#slides').children('img:first').removeClass('off');
	$('#thumbnails').children('li:first').addClass('current');
}