/*
 * jQuery.ArticleSwitch
 * Version: 1.0
 * http://www.websocity.com/Article/ArticleSwitch
 *
 * Copyright (c) 2009 Romain Lienard - http://www.websocity.com
 * COMMON DEVELOPMENT AND DISTRIBUTION LICENSE (CDDL)
 *
 * Date: 10/09/2010
 * Revision: 1
*/

var ArticleSwitch = {

	// début : Ne pas modifier
	nbSlide : 0,
	nbCurrent : 1,
	elemCurrent : null,
	elem : null,
	timer : null,
	nomNavigation : null,
	// fin
	
	// affichage des titres en bulle lors du passages de la souris
	ifBulle : 1,
	// mise en place de bulle avec fleche lié a la navigation
	ifBulleArrow : 0,
	// Affichage des fleche suivante et précédente
	ifNextPrevArrow : 1,
	/*
	* Le RollUp:
	* Option permetant d'afficher une partie du Titre lors du slyde.
	* Au contact de la souris de l'utilisateur le Titre apparait completement en slidant.
	*/
	//Option du RollUp
	ifRollUp : 0, // 0: pas de RollUp, 1: Mise en place du RollUp quand la souris passe par dessus le titre
	positionRollUp : "bottom", // Direction du RollUp.
	visibleRollMin : 30, // 30 par défaut 30px; Valeur (Pixel) de la partie visible 
	
	//Option des animations
	styleNavigation : 2, // 1 = Chiffre; 2 = pictos
	visuelAnimation : "slide", // fade ; slide ; switch
	titleAnimation : "bulle", // fade ; slideBunce ; switch ; bulle
	
	init : function(elem){
		this.nbSlide = elem.find(".slide").length;
		
		//Function Pagination
		
		// mise en place des pictos de navigations
		switch(this.styleNavigation){
		 case 1:
			elem.append("<div class=\"navigation\"></div>");
			this.nomNavigation = ".navigation";
			for(var i = 1; i<= this.nbSlide; i++ ){
				elem.find( this.nomNavigation ).append("<span index=\""+ i +"\">"+ i +"</span>");
			}
		 break;
		 case 2:
			elem.append("<div class=\"navigationPicto\"></div>");
			this.nomNavigation = ".navigationPicto";
			for(var i = 1; i<= this.nbSlide; i++ ){
				elem.find( this.nomNavigation ).append("<span index=\""+ i +"\"></span>");
			}
		 break;
		}
		elem.find(this.nomNavigation+"  span").click(function(){ 
			ArticleSwitch.gotoSlide($(this).attr("index"),1);
		})
		
		// Initialisation des variables ArticleSwitch
		this.elem = elem;
		elem.find(".visuel").hide();
		elem.find(".visuel:first").show();
		elem.find(".title").hide();
		elem.find(".title:first").show();
		this.elemCurrent = elem.find(".slide:first");
		this.elemCurrent.css({"z-index" : 1 });
		this.elem.find(this.nomNavigation+"  span:first").addClass("active");
		
		// Initialisation du RollUp
		if( this.ifRollUp ){
			ArticleSwitch.RollUp.init(this.elem, this.positionRollUp, this.visibleRollMin);
		}
		if( this.ifBulle ){
			if( this.ifBulleArrow ){
				for(var i = 1; i<= this.nbSlide; i++ ){
					this.elem.find(".slide:eq("+(i-1)+") .title").css("background","url('css/img_ArticleSwitch/bulle"+ i +".png') no-repeat left top");
					this.elem.find(".slide:eq("+(i-1)+") .title").hide();
				}
			}
			this.elem.hover(
					function () {
						$(this).find('.title').show();
						$(this).find('.title').hide().fadeIn();
					}, 
					function () {
						$(this).find('.title').fadeOut();
					}
			);
		}
		if( this.ifNextPrevArrow ){
			elem.before('<div class="arrow next" onclick="ArticleSwitch.next()"></div>');
			elem.before('<div class="arrow prev" onclick="ArticleSwitch.prev()"></div>');
		}
		
		
		//Timer
		ArticleSwitch.play();
		

		//Stop le switch
		elem.mouseover(ArticleSwitch.stop);
		elem.mouseout(ArticleSwitch.play);
	},
	
	RollUp : {
		
		elem : null,
		
		heightParent: null,
		heightElem: null,
		widthParent: null,
		widthElem: null,
		
		cssRollUp: null,
		cssRollDown: null,
		
		init : function(elem, pos, min){
		
			this.elem = elem;
			this.heightParent = this.elem.find(".slide").height();
			this.heightElem = this.elem.find(".title").height();
			
			this.widthParent = this.elem.find(".slide").width();
			this.widthElem = this.elem.find(".title").width();
			
			switch(pos){
				case "top" :
					this.cssRollUp = {"top" : 0};
					this.cssRollDown = {"top" : -this.heightElem + min};
				break;
				case "bottom" :
					this.cssRollUp = {"top" : this.heightParent - this.heightElem};
					this.cssRollDown = {"top" : this.heightParent - min};
				break;
				case "left" :
					this.cssRollUp = {"left" : 0};
					this.cssRollDown = {"left" : -this.widthElem + min};
				break;
				case "right" :
					this.cssRollUp = {"left" : this.widthParent - this.widthElem};
					this.cssRollDown = {"left" : this.widthParent - min};
				break;
			}
			
			this.elem.find(".title").css(this.cssRollDown);
			
			this.elem.find(".title").hover(
				function () {
					$(this).animate(ArticleSwitch.RollUp.cssRollUp,200);
				}, 
				function () {
					$(this).animate(ArticleSwitch.RollUp.cssRollDown,200);
				}
			);
		},
		
		Up : function(){
			this.elem.find(".title").animate(this.cssRollUp,200);
		},
		
		Down : function(){
			this.elem.find(".title").animate(this.cssRollDown,200);
		}
	},
	
	gotoSlide : function(num, ifClick){
		if(num==this.nbCurrent){ return false; }
		
		this.elemCurrent.css({"z-index" : 0 });
		this.elem.find(".slide:eq("+(num-1)+")").css({"z-index" : 1 });
		
		switch (this.visuelAnimation){
		 case "fade":
			// Annimation: FadeOut/FadeIn 
			this.elemCurrent.find(".visuel").fadeOut();
			this.elem.find(".slide:eq("+(num-1)+") .visuel").show();
			this.elem.find(".slide:eq("+(num-1)+") .visuel").hide().fadeIn();
		 break;
		 case "slide":
			//Annimation en slide
			var sens = 1;
			if(num<this.nbCurrent){sens = -1}
			var cssDep = {"left" : sens * this.elem.width()};
			var cssFin = {"left" : -sens * this.elem.width()};
			this.elem.find(".slide:eq("+(num-1)+") .visuel").show().css(cssDep);
			
			this.elem.find(".slide:eq("+(num-1)+") .visuel").animate({"top":0, "left":0},500);
			this.elemCurrent.find(".visuel").animate(cssFin,500);
		 break;
		}
		
		switch (this.titleAnimation){
		 case "fade":
			// Annimation: FadeOut/FadeIn
			this.elemCurrent.find(".title").fadeOut();
			this.elem.find(".slide:eq("+(num-1)+") .title").hide().fadeIn();
		 break;
		 case "slideBunce":
			/* Annimation en slideBunce ::: à modifier
			var titleHeight = this.elemCurrent.find(".title").height();
			this.elemCurrent.find(".title").animate({"top": -titleHeight},500);
			this.elem.find(".slide:eq("+(num-1)+") .title").css("top", -titleHeight).animate({"top":0},500);
			*/
		 break;
		 case "bulle":
				this.elem.find(".title").hide();
				if(ifClick){
					this.elem.find(".slide:eq("+(num-1)+") .title").fadeIn();
				}
		 break;
		}
		
		//Partie obligatoire pour chaque annimation.
		this.elem.find(this.nomNavigation+" span").removeClass("active")
		this.elem.find(this.nomNavigation+" span:eq("+(num-1)+")").addClass("active");
		this.nbCurrent = num;
		this.elemCurrent = this.elem.find(".slide:eq("+(num-1)+")");
		
	},
	
	next : function(){
		var num = this.nbCurrent+1
		if(num > this.nbSlide){
			num = 1;
		}
		this.gotoSlide(num, 0);
	},
	
	prev : function(){
		var num = this.nbCurrent-1;
		if(num < 1){
			num = this.nbSlide;
		}
		this.gotoSlide(num, 0);
	},
	
	stop : function(){
		window.clearInterval(ArticleSwitch.timer);
	},
	
	play : function(){
		window.clearInterval(ArticleSwitch.timer);
		ArticleSwitch.timer = window.setInterval("ArticleSwitch.next()", 6000);
	}
}

$(function(){
	ArticleSwitch.init($("#ArticleSwitch"));
});