﻿/*
Classe carrousel
*/
function Carrousel(elements, carrouselId, currentTitle, currentDate, currentText, currentLink, currentImage, previewTitle, previewImage, timer) {
    // Stockage des éléments
    this.elements = elements;
    // Id de la div principale du carrousel
    this.carrouselId = carrouselId;

    // Définit si le carrousel est stoppé (survol de la souris ...)
    this.stopped = false;

    // Etat en transition
    this.sliding = false;
    
    // Valeur maximale du timer
    this.maxTimer = timer
    
    // Compteur pour la rotation
    this.timer = this.maxTimer;
    
    // Temps entre chaque décompte de rotation
    this.tick = 500;

    // Durée de transition des actus
    this.slideDuration = 800;
    
    // Effets de la transition
    this.currentSlideInEffect = "slide";
    this.currentSlideOutEffect = "slide";
    this.previewSlideInEffect = "drop";
    this.previewSlideOutEffect = "highlight";

    this.initButtons = function() {
        // Création des boutons
        $('#' + this.carrouselId).prepend('<div id="next-link"></div>');
        $('#' + this.carrouselId).prepend('<div id="prev-link"></div>');
        this.nextButton = $('#next-link');
        this.prevButton = $('#prev-link');

        // Masquage des boutons suivants et précédents suivant le contenu
        if (this.elements.length == 1) {
            this.nextButton.css('display', 'none');
            this.prevButton.css('display', 'none');
        }

        // Référence vers le carrousel (pour accéder aux méthodes depuis les handlers
        this.nextButton.carrousel = this;
        this.prevButton.carrousel = this;
        // Handlers
        this.nextButton.bind('click', { carrousel: this }, function(event) {
            event.data.carrousel.next();
        });
        this.prevButton.bind('click', { carrousel: this }, function(event) {
            event.data.carrousel.prev();
        });
    };

    this.rotate = function() {
        if (!this.stopped && !this.sliding) {
            this.timer = this.timer - this.tick;
        }

        if (this.timer <= 0) {
            this.prev();
        }
    };

    this.stop = function() {
        this.stopped = true;
    };

    this.play = function() {
        this.stopped = false;
    };

    this.initCurrent = function() {
        // Récupération des zones
        this.current = 0; // Indice de l'élément courant
        this.previous = 0; // Indice de l'élément précédent

        this.currentZone = $('#current');
        this.currentTitle = $('#' + currentTitle);
        this.currentDate = $('#' + currentDate);
        this.currentText = $('#' + currentText);
        this.currentLink = $('#' + currentLink);
        this.currentImage = $('#' + currentImage);

        // Insertion du premier contenu
        this.change();
    };

    this.initPreview = function() {
        this.previewZone = $('#preview-content');
        this.previewTitle = $('#' + previewTitle);
        this.previewImage = $('#' + previewImage);

        // Création d'un handler sur click de la zone de preview
        this.previewZone.bind('click', { carrousel: this }, function(event) {
            event.data.carrousel.next();
        });
    };

    this.initStopActions = function() {
        // Arret du carrousel
        this.currentTitle.bind('mouseover', { carrousel: this }, function(event) { event.data.carrousel.stop(); });
        this.currentDate.bind('mouseover', { carrousel: this }, function(event) { event.data.carrousel.stop(); });
        this.currentText.bind('mouseover', { carrousel: this }, function(event) { event.data.carrousel.stop(); });
        this.currentLink.bind('mouseover', { carrousel: this }, function(event) { event.data.carrousel.stop(); });
        this.currentImage.bind('mouseover', { carrousel: this }, function(event) { event.data.carrousel.stop(); });

        // Rotation du carrousel
        this.currentTitle.bind('mouseout', { carrousel: this }, function(event) { event.data.carrousel.play(); });
        this.currentDate.bind('mouseout', { carrousel: this }, function(event) { event.data.carrousel.play(); });
        this.currentText.bind('mouseout', { carrousel: this }, function(event) { event.data.carrousel.play(); });
        this.currentLink.bind('mouseout', { carrousel: this }, function(event) { event.data.carrousel.play(); });
        this.currentImage.bind('mouseout', { carrousel: this }, function(event) { event.data.carrousel.play(); })
    };

    this.init = function() {
        this.initButtons();
        this.initPreview();
        this.initCurrent();
        this.initStopActions();
    };

    this.slideOut = function(_direction) {
        this.sliding = true;

        var carrousel = this;
        this.timer = this.maxTimer;
        this.currentZone.hide(this.currentSlideOutEffect, { direction: _direction }, this.slideDuration, function() { carrousel.change(); });
        this.previewZone.hide(this.previewSlideOutEffect, { direction: _direction,color: "#EDF5F6"   }, this.slideDuration);

    };

    this.slideIn = function(_direction) {
        var carrousel = this;
        this.currentZone.show(this.currentSlideInEffect, { direction: _direction }, this.slideDuration);
        this.previewZone.show(this.previewSlideInEffect, { direction: _direction }, 200);

        this.sliding = false;
    }

    this.next = function() {
        // Vérification de l'index
        this.current++;
        if (this.current == this.elements.length) {
            this.current = 0;
        }

        this.slideOut("left");
        this.slideIn("right");
    };

    this.prev = function() {
        // Vérification de l'index
        this.current--;
        if (this.current < 0) {
            this.current = this.elements.length - 1;
        }

        this.slideOut("right");
        this.slideIn("left");
    };

    this.change = function() {
        // Changement du contenu des divs de l'élément courant
        this.currentTitle.html($('#' + this.elements[this.current].title).html());
        this.currentDate.html($('#' + this.elements[this.current].date).html());
        this.currentLink.html($('#' + this.elements[this.current].link).html());
        this.currentText.html($('#' + this.elements[this.current].text).html());
        this.currentImage.html($('#' + this.elements[this.current].image).html());

        // Changement du contenu des divs pour l'aperçu
        var next = this.current + 1;
        if (next >= this.elements.length) {
            next = 0;
        }

        this.previewTitle.html($('#' + this.elements[next].title).html().substr(0, 30) +" ...");
        this.previewImage.html($('#' + this.elements[next].image).html());
    };

    // Initialisation
    this.init();

    // 

    // Rotation
    var carrousel = this;  
    window.setInterval('carrousel.rotate();', this.tick);
};
