var preload = new Array();
var imgInd = 1;
var selectedIndex = null;
var tabNav = false;
var arImgPath = new Array();


$(document).ready(function () {
    $(document).mousemove(function () {
        //return true;
        $('#Carousel').jcarousel({
            vertical: true, //orientation of the carousel, in this case we use vertical
            scroll: 1, //the number of items to scroll by
            start: 1,
            auto: 5, //the interval of scrolling
            wrap: 'circular', //wrap at last item and jump back to the start
            initCallback: mycarousel_initCallback,
            itemLoadCallback: {
                onBeforeAnimation: mycarousel_itemLoadCallBackBefore,
                onAfterAnimation: mycarousel_itemLoadCallbackAfter
            }
        });
        $(document).unbind('mousemove');
    });
    
});

//Actions effectuée au load du carroussel
function mycarousel_initCallback(carousel) {
    //preload des images
    $(".jcarousel-container")
        .prepend($("<div></div>").addClass("shadow-top"))
        .prepend($("<div></div>").addClass("corner-top"))
        .prepend($("<div></div>").addClass("corner-bottom"))
        .append($("<div></div>").addClass("shadow-bottom"));

    $(".jcarousel-item").each(function () {
        var image = $('<img class="temp bordered" />').attr("src", $(this).comments().html());
        preload.push(image);
        arImgPath.push($(this).comments().html());
    });

    $(".jcarousel-item a").hover(function () {
        $(this).addClass("hover");
    }, function () {
        $(this).removeClass("hover");
    });

    //Ajout du comportement sur le click
    $('.jcarousel-item').click(function () {
        var index = parseInt($(this).attr("jcarouselindex")) - 2;
        carousel.scroll(jQuery.jcarousel.intval(index));

        if ($(this).children("a").hasClass("hover")) {
            return false;
        }
        return true;
    });

    $('.jcarousel-item a').focus(function () {
        var i = $(this).parent().attr("jcarouselindex")

        if (!tabNav) {
            tabNav = true;
            carousel.stopAuto();
        }

        var index = parseInt(i) - 2;
        carousel.scroll(jQuery.jcarousel.intval(index));

        $(".jcarousel-item").each(function () {
            if ($(this).attr("jcarouselindex") < 1 || $(this).attr("jcarouselindex") > preload.length) {
                $(this).children("a").attr("tabIndex", "-1");
            }
        });
        return false;
    });

    //Arret et redémarrage du carroussel au survol
    $("#CarouselWrap").hover(function () {
        carousel.stopAuto();
    }, function () {
        if (!tabNav) {
            carousel.startAuto();
        }
    });
}

//actions effectuées avant le changement d'élément -- changement d'image
function mycarousel_itemLoadCallBackBefore(carousel, state) {
    if (selectedIndex != null) {
        selectedIndex.removeClass("deco-selected").addClass("deco-released");
        selectedIndex.children("span.selected-arrow").remove();
    }

    var ind = parseInt(carousel.first);
    var selectedItem = carousel.get(ind + 2);

    imgInd = $.inArray(selectedItem.comments().html(), arImgPath);


    $("#CarouselImage .temp").remove();
    $("#CarouselImage .selected").fadeOut(1000).removeClass("selected").addClass("temp");

    preload[imgInd].css("display", "none");
    preload[imgInd].css("opacity", "1");
    $("#CarouselImage").prepend(preload[imgInd].fadeIn(1000).removeClass("temp").addClass("selected"));
}


//actions effectuées après le changement d'élément
function mycarousel_itemLoadCallbackAfter(carousel, state) {
    var ind = parseInt(carousel.first);
    var selectedItem = carousel.get(ind + 2);

    selectedIndex = selectedItem;

    selectedItem.addClass("deco-selected").removeClass("deco-released");
    selectedItem.prepend($("<span></span>").addClass("selected-arrow"));

    $("#CarouselImage h2 span.sub").html(selectedItem.find("span.subTitle").html());
    $("#CarouselImage h2 span.main").html(selectedItem.find("span.title").html());
    $("#CarouselLink").attr("href", selectedItem.children("a").attr("href"));

    if (selectedItem.children("a").attr("data-link") == "") {
        $("#CarouselLink").hide();
    } else {
        $("#CarouselLink").show();
        $("#CarouselLink span.text").text(selectedItem.children("a").attr("data-link"));
    }
}