// JavaScript Document
$(document).ready(function(){

	/* ===== Slide a gauche =============== */
	function slideLeft(){
		var $active = $("#tabSlide div.active");
		if($active.length == 0) $active = $("#tabSlide div:first");
		//indice en cours
		var indice = parseInt($active.attr('title'));
		$puce = $("#puce"+indice);
		//indice precedent
		var prevIndice = (indice == 1) ? 4 : indice - 1;
		$prevPuce = $("#puce"+prevIndice);
		//si le div active est le premier, le suivant est le dernier
		var $next = ($active.prev().length == 0) ? $("#tabSlide div:last") : $active.prev();
		
		$active.addClass('last-active');

		//on change le slide effet fadeIn fadeOut
		$next.css({opacity: 0.0})
			.addClass('active')
			.animate({opacity: 1.0}, 500, function() {
				$active.removeClass('active last-active');
			});
		
		//on change la puce
		$puce.attr("src","images/slide_rondG.png");
		$prevPuce.attr("src","images/slide_rondB.png");	
	}
	/* ==================================== */
	
	/* ===== Slide a droite =============== */
	function slideRight(){
		var $active = $("#tabSlide div.active");
		if( $active.length == 0) $active = $("#tabSlide div:last");
		//indice en cours
		var indice = parseInt($active.attr('title'));
		$puce = $("#puce"+indice);
		//indice suivant
		var nextIndice = (indice == 4) ? 1 : indice + 1;
		$nextPuce = $("#puce"+nextIndice);
		//si le div active est le dernier, le suivant est le premier
		var $next = $active.next().length ? $active.next() : $("#tabSlide div:first");
		
		$active.addClass('last-active');
		
		$next.css({opacity: 0.0})
			.addClass('active')
			.animate({opacity: 1.0}, 500, function() {
				$active.removeClass('active last-active');
			});
			
		//on change la puce
		$puce.attr("src","images/slide_rondG.png");
		$nextPuce.attr("src","images/slide_rondB.png");
	
	}
	/* ==================================== */
	

	/* ===== clic sur le bouton gauche ==== */
	$("#navG").click(function(){	
		slideLeft();
	});
	/* ==================================== */
	
	/* ==== clic sur le bouton droit ====== */
	$("#navD").click(function(){
		slideRight();
	});
	/* ==================================== */
	
	/* ====== slideAutomatique 3 sec ====== */
	setInterval(function(){slideRight()}, 5000);
});