//update display of the large image
function displayImage(domAAroundImgThumb)
{
    if (!domAAroundImgThumb.hasClass('shown'))
    {
        if (domAAroundImgThumb.attr('href'))
        {
            var newSrc = domAAroundImgThumb.attr('href').replace('_600','_300');
            var newLegende = domAAroundImgThumb.attr('title');
            $('#bigpic').fadeOut('fast', function(){
                $(this).attr('src', newSrc);
                $('div#image_legende').html(newLegende);
                $(this).load(function() {
                  $(this).fadeIn('fast')
                })
                ;
            });
            $('#views_block li a').removeClass('shown');
            $(domAAroundImgThumb).addClass('shown');
        }
    }
} 


//To do after loading HTML
$(document).ready(function(){
	
	//init the serialScroll for thumbs
	$('#thumbs_list').serialScroll({
		items:'li',
		prev:'a#view_scroll_left',
		next:'a#view_scroll_right',
		axis:'x',
		offset:0,
		start:0,
		stop:true,
		duration:700,
		step: 2,
		lock: false,
		force:false,
		cycle:false
	});

	//hover 'other views' images management
	$('#views_block li a').hover(
		function(){displayImage($(this));},
		function(){}
	);

	//add a link on the span 'view full size' and on the big image
	$('div#image-block img').click(function(){
		$('#views_block li a.shown').click();
	});
	
});

$(function() {
	// Use this example, or...
	$('a.lightbox').lightBox();
});