// Set thickbox loading image
tb_pathToImage = "images/loadingAnimation.gif";

var mycarousel_itemList = [
    {url: "gallerie/1_tb.jpg", title: ""},
	{url: "gallerie/2_tb.jpg", title: ""},
	{url: "gallerie/3_tb.jpg", title: ""},
	{url: "gallerie/4_tb.jpg", title: ""},
	{url: "gallerie/5_tb.jpg", title: ""},
	{url: "gallerie/6_tb.jpg", title: ""},
	{url: "gallerie/7_tb.jpg", title: ""},
	{url: "gallerie/8_tb.jpg", title: ""},
	{url: "gallerie/9_tb.jpg", title: ""},
	{url: "gallerie/10_tb.jpg", title: ""},
	{url: "gallerie/11_tb.jpg", title: ""},
	{url: "gallerie/12_tb.jpg", title: ""},
	{url: "gallerie/13_tb.jpg", title: ""},
	{url: "gallerie/14_tb.jpg", title: ""},
	{url: "gallerie/15_tb.jpg", title: ""},
	{url: "gallerie/16_tb.jpg", title: ""}
];

function mycarousel_itemLoadCallback(carousel, state)
{
    for (var i = carousel.first; i <= carousel.last; i++) {
        if (carousel.has(i)) {
            continue;
        }

        if (i > mycarousel_itemList.length) {
            break;
        }

        // Create an object from HTML
        var item = jQuery(mycarousel_getItemHTML(mycarousel_itemList[i-1])).get(0);

        carousel.add(i, item);
    }
};

function changeimage(url){
	$("#mainimage").attr("src",url);
}

/**
 * Item html creation helper.
 */
function mycarousel_getItemHTML(item)
{
    var url_m = item.url.replace(/_tb.jpg/g, '.jpg');
    return '<a href="javascript:;" onclick="changeimage(\'' + url_m + '\')" title="' + item.title + '"><img src="' + item.url + '" border="0" alt="' + item.title + '" /></a>';
};

jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel({
        size: mycarousel_itemList.length,
        itemLoadCallback: {onBeforeAnimation: mycarousel_itemLoadCallback}
    });
});