/*
    CARROUSEL JS
*/


var carrousel = {
    
    nbSlide : 0,
    nbCurrent : 1,
    elemCurrent : null,
    elem : null,
    timer : null,
	current_flechey : 2,
	current_num : 1,

    init : function(elem){
        this.nbSlide = elem.find(".slide").length;
        
        // Créer la pagination
        elem.append('<div class="navigation"></div>');
        for(var i=1;i<=this.nbSlide;i++){
            //elem.find(".navigation").append("<span>"+i+"</span>");
			//elem.find(".navigation span:first").addClass("slide"+i);

//	        this.elem.find(".navigation span").removeClass("active");
//	        this.elem.find(".navigation span:eq("+(num-1)+")").addClass("active");	
        }
       //  elem.find(".navigation span").click(function(){ carrousel.gotoSlide($(this).text()); })
        elem.find(".navigation .bouton").click(function(){          	        	
	 		if($(this).hasClass("elem1")) carrousel.gotoSlide(1); 
	 		if($(this).hasClass("elem2"))  carrousel.gotoSlide(2); 
	 		if($(this).hasClass("elem3"))  carrousel.gotoSlide(3); 
	 		if($(this).hasClass("elem4"))  carrousel.gotoSlide(4); 		
		})
        
        // Initialisation du carrousel
        this.elem=elem;
        elem.find(".slide").hide();
        elem.find(".slide:first").show();
        this.elemCurrent = elem.find(".slide:first");
        this.elem.find(".navigation").css("opacity",1);   // On rend la navigation opaque
        this.elem.find(".navigation span:first").addClass("active");
        
        // On crée le timer
        carrousel.play();
        // Stop quand on passe dessus
       // elem.mouseover(carrousel.stop);
        elem.mouseout(carrousel.play);
    },
    
    gotoSlide : function(num){
        if(num==this.nbCurrent){ return false; }
        var current_flechey = this.current_flechey;
		var current_num = this.current_num;
        /* Animation en fadeIn/fadeOut 
        this.elemCurrent.fadeOut();
        this.elem.find("#slide"+num).fadeIn();
        */
        /* Animation en slide 
        var sens = 1;
        if(num<this.nbCurrent){ sens = -1;}
        var cssDeb = { "left" : sens*this.elem.width() };
        var cssFin = { "left" : -sens*this.elem.width() };
        this.elem.find("#slide"+num).show().css(cssDeb);
        this.elem.find("#slide"+num).animate({"top":0,"left":0},500);
        this.elemCurrent.animate(cssFin,500);

     	 	/* Déplacement de la flèche de sélection.*/
		this.elem.find(".fleche"+num).css("right",149);
		this.elem.find(".fleche"+current_num).css("right",0);
		this.current_num = num;
     
        /*
        Animation Titre + Fadein/Out sur la div visu
        */
        this.elemCurrent.find(".visu").fadeOut();
        this.elem.find("#slide"+num).show();
        this.elem.find("#slide"+num+" .visu").hide().fadeIn();

        var titleHeight = this.elemCurrent.find(".title").height();
		var titleWidth = this.elemCurrent.find(".title").width();
		
        /* disparition du titre actuel */
 		this.elemCurrent.find(".title").animate({"right": -titleWidth},1000);

		/* Apparition du titre suivant */
        this.elem.find("#slide"+num+" .title").css("right", 0).animate({"right": 149},800);
/*
        this.elemCurrent.find(".title").animate({"bottom": -titleHeight},500);
        this.elem.find("#slide"+num+" .title").css("bottom",-titleHeight).animate({"bottom": 0},500);
 */
		
		
		/* 
		 * Changment de l'image de fond de l'élément 
		*/
        
        this.elem.find(".elem"+current_num).css('background-image', 'url(./wp-content/themes/wibox/carrousel/img/fond-bouton-carrousel-'+current_num+'.jpg)');  
		this.elem.find(".elem"+num).css('background-image', 'url(./wp-content/themes/wibox/carrousel/img/fond-bouton-carrousel-'+num+'-active.jpg)');  
		
		this.elem.find(".elem"+current_num).removeClass("active");
        this.elem.find(".elem:eq("+num+")").addClass("active");	
		
		
        this.nbCurrent = num;
        this.elemCurrent = this.elem.find("#slide"+num);
		
    },
    
    next : function(){
        var num  = this.nbCurrent+1;
        if(num  >this.nbSlide){
            num  = 1;
        }
        this.gotoSlide(num);
    },
    prev : function(){
        var num  = this.nbCurrent-1;
        if(num< 1){
            num= this.nbSlide;
        }
        this.gotoSlide(num);
    },
    stop : function(){
        window.clearInterval(carrousel.timer);
    },
    play : function(){
        window.clearInterval(carrousel.timer);
        carrousel.timer = window.setInterval("carrousel.next()",2500);
    }

}

$(function(){
    carrousel.init($("#carrousel"));
});
