/*CARROUSEL*/


var carrousel={
	nbSlide: 0,/*compter le nombre de Slide qu'il a*/
	nbCurrent: 1,/*en commence par le premier element*/
	elemCurrent: null,/*stocker les elements HTML*/
	elem: null,/*initalise dans quel div mon carrousel/rendre plus dnyamique*/
	timer: null,
/*pour pouvoir changer de DIV*/
	init: function(elem){
	this.nbSlide = elem.find('.slide').length;/*nombre d'élément de slide*/
	
		//pour 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>');/*permet de chercher les span*/
			}/*iniatilse toutes les variables*/
		/*on va déclencher un événement*/
		/*on clique sur un bouton sa appel la function gotoSlide*/
		elem.find('.navigation span').click(function(){carrousel.gotoSlide($(this).text()); })
		
		this.elem=elem;/*commencer par le premier Slide*/
		elem.find('.slide').hide();
		elem.find('.slide:first').show();/*lepremier slide element courant*/
		this.elemCurrent = elem.find('.slide:first');
		this.elem.find('.navigation span:first').addClass('active');/*pace active au premier span*/
		
		/*On crée le timer*/
	
		/*tous les cinq seconde*/
		carrousel.play();
		//stop quand on passe dessus*/
		elem.mouseover(carrousel.stop);
		elem.mouseout(carrousel.play);
	},
	/*quand passe dessus avec la souris*/
		
	
	/*créer a aller endroit précis*/
	/*numero du slide que l'on veut afficher*/	
		
		/*alert(num);*/
	gotoSlide: function(num){
		if(num==this.nbCurrent){return false;}/*qu'on ne puise pas recliquer sur l'image*/
		
		
		/*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();
		
		this.elemCurrent.find('.title').animate({'bottom': -titleHeight},500);
		this.elem.find('#slide'+ num +'.title').css('bottom', -titleHeight).animate({'bottom':0},500);
		
		
		
		
		
		//this.elem.find('.navigation span').removeClass('active');/*j'enlève leurs classe active
		this.elem.find('.navigation span:eq('+(num-1)+')').addClass('active');
		this.nbCurrent = num;
		this.elemCurrent = this.elem.find('#slide' + num);
		},
		//aller dans fonction aller à l'élément suivant*/
		//va ajouter 1 */
		/*Animation 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);
		
		/*Dernière animation*/
		/*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();
		
		
		this.elemCurrent.find('.title').animate({'bottom': -titleHeight},500);
		this.elem.find('#slide'+num+'.title').css('bottom',-titleHeight).animate({'bottom': 0},500);*/
		
		
		
		this.elem.find('#slide'+num).animate({'top':0,'left':0},500);
		this.elemCurrent.animate(cssFin,500);
		
		
		this.elem.find('.navigation span').removeClass('active');/*j'enlève leurs classe active*/
		this.elem.find('.navigation span:eq('+(num-1)+')').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);
	},
//aller dans fonction aller à l'élément suivant*/
		/*va ajouter 1*/
		prev: function(){
		var num = this.nbCurrent-1;
		if(num< 1){
			num=this.nbSlide;
		}
		this.gotoSlide(num);
	},
	/*nettoyer le teamer le temps*/
	 stop:function(){  
         window.clearInterval(carrousel.timer);  
     },  
       
     play:function(){  
        window.clearInterval(carrousel.timer);  
         carrousel.timer=window.setInterval("carrousel.next()",5000);  
     }  

}	

$(function(){
	carrousel.init($('#carrousel'));
	/*alert(carrousel.nbSlide);*/
});