var slideshow = null;
var l = null;
var slideshow_thumbnail_timer = null;
var thumbnails_container_width = null;
var slideshow_speed = 2500;
var slideshow_speed_slow = 5000;
var slideshow_speed_medium = 2500;
var slideshow_speed_fast = 1000;


function move_thumbnail_container()
{
	if(thumbnails_container_width > 481)
	{
		thumbnail_container = slideshow.find('.thumbnails_container_in');		
		css_left = parseInt(thumbnail_container.css('left').replace('px',''));
		
		new_css_left = css_left + l;
		
		max_css_left = 0;
		min_css_left = -1 * (thumbnails_container_width - 481); 
		
		if (new_css_left > max_css_left)
		{
			new_css_left = max_css_left;
		}
		else if(new_css_left < min_css_left)
		{
			new_css_left = min_css_left;		
		}
		
		thumbnail_container.css('left', new_css_left + 'px');
	}
}

function slideshow_next()
{
	// next thumbnail
	next = $('.media .slideshow .thumbnails .thumbnails_container_in a:first');
	reset = true;
	
	current = $('.media .slideshow .thumbnails .thumbnails_container_in a.selected');
	current.next().each(function(){;
		next = $(this);
		reset = false;
	});	
		
	// preload image
	next_image_url = next.attr('href');
	load = new Image();
	load.src = next_image_url;
	
	// replace image
	next.closest('.slideshow').find('.viewable img').attr('src', next_image_url);
	
	// update caption
	caption = next.find('span').text();
	next.closest('.slideshow').find('.viewable p').text(caption);
	
	// update thumbnail selection
	next.siblings().removeClass('selected');
	next.addClass('selected');

	// shift thumbnails if needed
	position = next.width() + 12 + 2; 
	next.prevAll('a').each(function(){
		position += $(this).width() + 12 + 2;
	});	

	thumbnail_container = slideshow.find('.thumbnails_container_in');		
	css_left = parseInt(thumbnail_container.css('left').replace('px',''));

	if (reset)	// when going back to first image
	{
		new_css_left = 0;			
		thumbnail_container.css('left', new_css_left + 'px');			
	}
	else if(css_left * -1 + 481 < position) // when thumbnail is not visible
	{
		thumbnails_container_width = 0;
		slideshow.find('.thumbnails_container_in a').each(function(){		
			thumbnails_container_width += $(this).width() + 12 + 2; // width + margin + border
		});
		thumbnails_container_width -= 12;

		new_css_left = -1 * (position - 481);
		thumbnail_container.css('left', new_css_left + 'px');			
	}
}

function stop(slideshow)
{
	play_button = slideshow.find('a.play');

	// desactivate play button
	button = play_button.find('img');
	button_url = button.attr('src');
	new_button_url = button_url.replace('pause', 'play');
	button.attr('src', new_button_url);

	// stop any current playing
	clearInterval(slideshow_thumbnail_timer);

	// remove speed highlight
	play_button.siblings().removeClass('selected');
	play_button.removeClass('playing');	
}

function play(slideshow)
{	
	// stop any current playing
	clearInterval(slideshow_thumbnail_timer);

	// activate play button
	play_button = slideshow.find('a.play');
	button = play_button.find('img');
	button_url = button.attr('src');
	new_button_url = button_url.replace('play', 'pause');
	button.attr('src', new_button_url);
	
	// highlight current speed
	play_button.siblings().removeClass('selected');
	if(slideshow_speed == slideshow_speed_fast)
	{
		play_button.siblings('.speed_fast').addClass('selected');
	}
	else if(slideshow_speed == slideshow_speed_slow)
	{
		play_button.siblings('.speed_slow').addClass('selected');
	}
	else if(slideshow_speed == slideshow_speed_medium)
	{
		play_button.siblings('.speed_medium').addClass('selected');
	}				

	// play
	slideshow_thumbnail_timer = setInterval('slideshow_next()', slideshow_speed);
	play_button.addClass('playing');
}


$(document).ready(function() {

	// display first image
	$(".media .slideshow").each(function(){
		link = $(this).children('.thumbnails .thumbnails_container_in a:first');
		image_url = link.addClass('selected').attr('href');
		$(this).find('.viewable img').attr('src', image_url);
		
		caption = link.find('span').text();
		$(this).find('.viewable p').text(caption);
	});	
	
	// click on thumbnail
	$('.media .slideshow .thumbnails .thumbnails_container_in a').click(function(){
		image_url = $(this).attr('href');
		slideshow = $(this).closest('.slideshow');
	
		slideshow.find('.viewable img').attr('src', image_url);
	
		caption = $(this).find('span').text();
		slideshow.find('.viewable p').text(caption);
	
		$(this).siblings().removeClass('selected');
		$(this).addClass('selected');
		
		return false;
	});	
	
	// play/stop
	$(".slideshow .play").click(function(){
		slideshow = $(this).parents('.slideshow');
		
		if($(this).hasClass('playing'))
		{
			stop(slideshow);
		}
		else
		{
			play(slideshow);
		}	
	});	
	
	// fast speed
	$(".speed_fast").click(function(){
		slideshow_speed = slideshow_speed_fast;
		play($(this).parents('.slideshow'));
	});	
	
	// low speed
	$(".speed_slow").click(function(){
		slideshow_speed = slideshow_speed_slow;
		play($(this).parents('.slideshow'));
	});
	
	// medium speed
	$(".speed_medium").click(function(){
		slideshow_speed = slideshow_speed_medium;
		play($(this).parents('.slideshow'));
	});	
	
	// scroll thumbnails left
	$(".media .slideshow .nav_left").mousedown(function(){
		clearInterval(slideshow_thumbnail_timer);
		slideshow = $(this).closest('.slideshow');
		l = 10;		
		slideshow_thumbnail_timer = setInterval('move_thumbnail_container();', 40);
		
		return false;
	});	
	
	$(".media .slideshow .nav_left").bind("mouseup mouseout", function(e){
		clearInterval(slideshow_thumbnail_timer);
		return false;
	});
	
	// scroll thumbnails right
	$(".media .slideshow .nav_right").mousedown(function(){
		clearInterval(slideshow_thumbnail_timer);
		slideshow = $(this).closest('.slideshow');
		
		thumbnails_container_width = 0;
		slideshow.find('.thumbnails_container_in a').each(function(){		
			thumbnails_container_width += $(this).width() + 12 + 2; // width + margin + border
		});
		thumbnails_container_width -= 12;
		
		l = -10;		
		slideshow_thumbnail_timer = setInterval('move_thumbnail_container();', 40);
		
		return false;
	});	
	
	$(".media .slideshow .nav_right").bind("mouseup mouseout", function(e){
		clearInterval(slideshow_thumbnail_timer);
		return false;
	});

});