// initialise le carrousel, si animAuto=true alors le carrousel tourne automatiquement

function accroches_carrousel_init(animAuto){;
	// configuration des slides
	var width = 320;					// largeur d'un slide
	var nbSlideVisible = 3				// nombre de slides visibles
	var nbSlideMove = 3					// nombre de slides déplacés par clique sur le bouton suivant

	// configuration de l'animation
	var animSpeed = 600;			// vitesse de défilement en ms
  	var tAnimAuto = 8000;				// délais pour l'animation automatique en ms, 0 pour aucune annimation automatique
	var tAnimNavigation = 150;				// de de l'animation de des boutons de navigations en ms
	var navigWidth = 47;			// largeur des div pour les menu de navigation en px

	var intervalCarrousel;
	var isAnimation = false;
	var isAndroid = false;
	var ua = navigator.userAgent.toLowerCase();
	var isAndroid = ua.indexOf("android") > -1;
	
	// fin configuration ----------------------------------------	
	$('#carrouselSlidesContainer').css('overflow', 'hidden'); // Supprime la scrollbar en JS
	$('#carrouselSlidesContainer').css('width', width * nbSlideVisible ); // définit la largeur visible

	//detection browser
	//alert(navigator.platform + "**" + isAndroid + "**" + (navigator.platform == "iPhone" || navigator.platform == "iPad" || isAndroid));
	//document.write(navigator.platform + "**" + isAndroid + "**" + (navigator.platform == "iPhone" || navigator.platform == "iPad" || isAndroid));
	
	// définit la largeur des menus de navigation
	$('.carrouselNavigation').css('width', navigWidth);	
	if(navigator.platform == "iPhone" || navigator.platform == "iPad" || isAndroid){
		$('.carrouselNavigation_left').css('left', 5);
		$('.carrouselNavigation_right').css('right', 5);
	}else{
		$('.carrouselNavigation_left').css('left', -navigWidth);
		$('.carrouselNavigation_right').css('right', -navigWidth);
	}

	// Transforme le curseur en main lorsqu'on passe sur les boutons permettant de faire coulisser les accroches
	$(".carrouselNavigation img").mouseover(function() {
   		$(this).css('cursor', 'pointer');
	});	
	
	// Duplique les element pour faire un défilement bouclŽ		
	for(i = 0; i < nbSlideVisible ; i++){ // duplique avant
		$('#carrouselContent').children().eq($('.carrouselSlide').length - i - 1).clone().prependTo($('#carrouselContent'));				
	}
	
	for(i = 0; i < nbSlideVisible ; i++){ // duplique après
		$('#carrouselContent').children().eq(i+nbSlideVisible).clone().appendTo($('#carrouselContent'));		
	}
	
	var slides = $('.carrouselSlide');
	var numberOfSlides = slides.length;	

	slides
		.wrapAll('<div id="carrouselSlideInner"></div>')		
		.css({'float' : 'left','width' : width });

	// La longueur de #carrouselSlideInner équivaut à la somme de la longueur de tous les slides
	$('#carrouselSlideInner').css('width', width * numberOfSlides);
	$('#carrouselSlideInner').css('marginLeft', -width * nbSlideVisible ); // commence au début

	var carrouselCurrentPosition = nbSlideVisible; // commence au slide 1

	// crée un écouteur pour l'évènement de type clic pour la navigation
	$('.carrouselNavigation').bind('click', function(e){ animation($(this)); });
		
	// Affichage des boutons de navigation
	$('#carrouselSlidesContainer').hover(function(){ // entrée de la souris dans le carrousel 
   		pause(); // stop le défilement automatique
   		if(!(navigator.platform == "iPhone" || navigator.platform == "iPad" || isAndroid)){
   			$('.carrouselNavigation_left').animate({'left': 5}, tAnimNavigation);	
   			$('.carrouselNavigation_right').animate({'right': 5}, tAnimNavigation);	
   		}
	},function(){ // sortie de la souris du carrousel 
		if(!(navigator.platform == "iPhone" || navigator.platform == "iPad" || isAndroid)){
			$('.carrouselNavigation_left').animate({'left': -navigWidth }, tAnimNavigation);	
			$('.carrouselNavigation_right').animate({'right': -navigWidth }, tAnimNavigation);
		}
		if(animAuto) start(); // réactive si besoins le défilement automatique
 	});	
	
	if(animAuto) start(); // enclenche l'animation automatique
	
	function animation(objClick){
		if (!isAnimation){			
			isAnimation = true;
			// Determine une nouvelle position
			carrouselCurrentPosition = (objClick.attr('class')=='carrouselNavigation carrouselNavigation_right') ? carrouselCurrentPosition + nbSlideMove  : carrouselCurrentPosition - nbSlideMove ;
			// limite et défilement en boucle			
			if(carrouselCurrentPosition > numberOfSlides - nbSlideVisible ){			
				var n = carrouselCurrentPosition - numberOfSlides + nbSlideVisible ; 
				$('#carrouselSlideInner').css('marginLeft', -width * (nbSlideVisible + n  - nbSlideMove  )); 
				carrouselCurrentPosition = (nbSlideVisible + n  );
			}
			if(carrouselCurrentPosition < 0 ){
				$('#carrouselSlideInner').css('marginLeft', -width * (numberOfSlides + carrouselCurrentPosition - nbSlideVisible - nbSlideVisible + nbSlideMove )); // commence au début
				carrouselCurrentPosition = (numberOfSlides + carrouselCurrentPosition - nbSlideVisible - nbSlideVisible);			
			}
				
			$('#carrouselSlideInner').animate({ 'marginLeft' : width*(-carrouselCurrentPosition)	},animSpeed, function(){isAnimation=false;}); // animation de défilement	
		}	
	}	
	function suivant(){ animation($('.carrouselNavigation_right')); } // animation automatique suivant
	function start() { // débute l'animation automatique si besoins
  		if (tAnimAuto > 0 ){ intervalCarrousel	 = setInterval(suivant, tAnimAuto );}
	}
	function pause() { clearInterval(intervalCarrousel);  }  // animation automatique mise en pause		
}