// Le options array contient les dimensions et les positions des differents images
var options = [

	{ width: 131, height: 149, top: 103, left: 22 },
	{ width: 209, height: 246, top: 28, left: 144 },
	{ width: 131, height: 149, top: 102, left: 326 },
	{ width: 86, height: 103, top: 127, left: 440 }

];

// Si un des images est en animation, le boolean correspondant sera true.
var animated = [false, false, false, false];

// secondLastElement contient le index de l'image qui est en troisieme position.
document.secondLastElement = 2;
// currentIndexClique contient le index de l'image qui a été cliqué.
document.currentIndexClique = 1;

document.intervalID = null;
document.numberOfTimesIntervalExecuted = 0;
document.automateClick = false;

jQuery(document).ready(function() {

    init_Carousel();

});

function init_Carousel() {
    jQuery("#carousel img").each(function(i) {

        Width = options[i].width;
        Height = options[i].height;
        Left = options[i].left;
        Top = options[i].top;

        $(this).width(Width).height(Height)
			   .css({ left: Left, top: Top, cursor: 'pointer' })
			   .attr("position", i);
    });

    jQuery("#carousel").delegate("img", "click", function() {

        if (!document.automateClick) {
            if (document.intervalID)
                clearInterval(document.intervalID);
        }
        else {
            document.automateClick = false;
        }

        if (!animated[0] && !animated[1] && !animated[2] && !animated[3]) {
            document.currentIndexClique = $(this).index();

            pos = $(this).attr("position");

            if (pos == 0) {
                // from left to right
                moveCarouselLeftToRight();
            }
            else if (pos == 1) {
                // Do nothing
            }
            else {
                if (pos - 1 == 1)
                    moveType = "onePosition";
                else
                    moveType = "twoPosition";

                // from right to left
                moveCarouselRightToLeft(moveType);
            }
        }

    });

    jQuery("#carousel").delegate("img", "currentinplace", function() {

    if (navigator.appVersion.indexOf("MSIE 8") >= 0 || navigator.appVersion.indexOf("MSIE 7") >= 0) {
            $(".layerInfo").css("display", "none");
            $(".layerInfo").eq(document.currentIndexClique).css("display", "block");
        }
        else {
            $(".layerInfo").fadeOut();
            $(".layerInfo").eq(document.currentIndexClique).fadeIn();
        }

    });

    document.intervalID = setInterval(automateCarousel, 5000);
}

function launchSecondRoundAnim() {
    if (!animated[0] && !animated[1] && !animated[2] && !animated[3]) {
        $("#carousel img").eq(document.secondLastElement).trigger('click');
    }
    else {
        launchSecondRoundAnim();
    }
}

function automateCarousel() {
    if (document.numberOfTimesIntervalExecuted >= options.length) {
        if (document.intervalID)
            clearInterval(document.intervalID);
    }
    else {
        document.numberOfTimesIntervalExecuted++;
        document.automateClick = true;
        $("#carousel img").eq(document.secondLastElement).trigger('click');
    }

}

function moveCarouselLeftToRight() {
    jQuery("#carousel img").each(function(i) {

        currentPosition = parseInt($(this).attr("position"));
        index = options.length - 1;

        if (currentPosition == index) {
            animated[i] = true;

            $(this).attr("position", 0);

            CurrentLeft = options[index].left;
            CurrentWidth = options[index].width;

            Width = options[0].width;
            Height = options[0].height;
            Left = options[0].left;
            Top = options[0].top;

            if (navigator.appVersion.indexOf("MSIE 8") >= 0 || navigator.appVersion.indexOf("MSIE 7") >= 0) {
                $(this).animate({ left: CurrentLeft + (CurrentWidth / 2) }, 200, 'linear',
							function() {

							    $(this).css({ left: -50, top: Top })
									   .width(Width)
									   .height(Height)
									   .animate({ left: Left },
												200,
												'linear',
												function() {

												    animated[i] = false;
												    document.secondLastElement = i > 0 ? i - 1 : 3;

												    $(this).trigger("currentinplace");

												});

							});
            }
            else {
                $(this).animate({ left: CurrentLeft + (CurrentWidth / 2), opacity: 0 }, 200, 'linear',
							function() {

							    $(this).css({ left: -50, top: Top })
									   .width(Width)
									   .height(Height)
									   .animate({ opacity: 1, left: Left },
												200,
												'linear',
												function() {

												    animated[i] = false;
												    document.secondLastElement = i > 0 ? i - 1 : 3;

												    $(this).trigger("currentinplace");

												});

							});
            }
        }
        else {
            newPosition = currentPosition + 1;
            $(this).attr("position", newPosition);

            newWidth = options[newPosition].width;
            newHeight = options[newPosition].height;
            newLeft = options[newPosition].left;
            newTop = options[newPosition].top;

            animated[i] = true;

            $(this).animate({ width: newWidth, height: newHeight, left: newLeft, top: newTop },
									400,
									'linear',
									function() {

									    animated[i] = false;

									});
        }

    });
}

function moveCarouselRightToLeft(moveType) {
    jQuery("#carousel img").each(function(i) {

        currentPosition = parseInt($(this).attr("position"));

        if (currentPosition == 0) {
            animated[i] = true;
            index = options.length - 1;
            $(this).attr("position", index);

            if (navigator.appVersion.indexOf("MSIE 8") >= 0 || navigator.appVersion.indexOf("MSIE 7") >= 0) {
                $(this).animate({ left: -50 }, 200, 'linear',
							function() {


							    Width = options[index].width;
							    Height = options[index].height;
							    Left = options[index].left;
							    Top = options[index].top;

							    $(this).css({ left: Left + (Width / 2), top: Top })
									   .width(Width)
									   .height(Height)
									   .animate({ left: Left },
												200,
												'linear',
												function() {

												    animated[i] = false;
												    document.secondLastElement = i > 0 ? i - 1 : 3;

												    if (moveType == "twoPosition") {
												        launchSecondRoundAnim();
												    }
												    else {
												        $(this).trigger("currentinplace");
												    }

												});

							});
            }
            else {
                $(this).animate({ left: -50, opacity: 0 }, 200, 'linear',
							function() {


							    Width = options[index].width;
							    Height = options[index].height;
							    Left = options[index].left;
							    Top = options[index].top;

							    $(this).css({ left: Left + (Width / 2), top: Top })
									   .width(Width)
									   .height(Height)
									   .animate({ opacity: 1, left: Left },
												200,
												'linear',
												function() {

												    animated[i] = false;
												    document.secondLastElement = i > 0 ? i - 1 : 3;

												    if (moveType == "twoPosition") {
												        launchSecondRoundAnim();
												    }
												    else {
												        $(this).trigger("currentinplace");
												    }

												});

							});
            }
        }
        else {
            newPosition = currentPosition - 1;
            $(this).attr("position", newPosition);

            newWidth = options[newPosition].width;
            newHeight = options[newPosition].height;
            newLeft = options[newPosition].left;
            newTop = options[newPosition].top;

            animated[i] = true;

            $(this).animate({ width: newWidth, height: newHeight, left: newLeft, top: newTop },
									400,
									'linear',
									function() {

									    animated[i] = false;

									});
        }

    });
}