var obj;

var int = 100;

var interval = 0;

function bindings(){	

	$('#carousel li > img').bind('click',function(e){ 																						

		var image = $('#'+e.target.id);			

		$('#loader').html('<img src="' + image.attr('src').replace("thumbs/","") + '" height="278" width="370" />').hide().fadeIn(300);	

	});	

}

function carousel_itemVisibleInCallback(carousel, item, i, state, evt){	

    var idx = carousel.index(i, carousel_itemList.length);	

    carousel.add(i, carousel_getItemHTML(carousel_itemList[idx - 1]));	

	bindings();

}

function carousel_itemVisibleOutCallback(carousel, item, i, state, evt){	

    carousel.remove(i);	

	bindings();

}

function carousel_getItemHTML(item){

    return '<img src="' + item.url + '" width="58" height="46" alt="' + item.title + '" id="'+item.imageID+'" />';

}

function carousel_initCallback(carousel){

	obj = carousel;	

	$('#carousel-next').bind('mouseover', function() {

		clearInterval(interval);

		interval = setInterval("next()",int); //time in milliseconds

		return false;

	});

	$('#carousel-next').bind('mouseout', function() {

		clearInterval(interval); //time in milliseconds

		return false;

	});

	$('#carousel-prev').bind('mouseover', function() {

		clearInterval(interval);

		interval = setInterval("prev()",int); //time in milliseconds

		return false;

	});	

	$('#carousel-prev').bind('mouseout', function() {

		clearInterval(interval); //time in milliseconds

		return false;

	});
}

function next(){ obj.next(); }

function prev(){ obj.prev(); }

jQuery(document).ready(function($){

	//$('#loader').html('<img src="/images/fanclub.wd40/wd40semacamaro/w1-01.jpg" height="278" width="370" />');					

	if(carousel_itemList.length > 5){		

		$('#carousel').jcarousel({

			scroll: 1,

			wrap: 'circular',

			initCallback: carousel_initCallback,

			itemVisibleInCallback: {onBeforeAnimation: carousel_itemVisibleInCallback},

			itemVisibleOutCallback: {onAfterAnimation: carousel_itemVisibleOutCallback},

			buttonNextHTML: null,

			buttonPrevHTML: null

		});	

	}

	else{

		$('#carousel').jcarousel();

	}

	bindings();	

});