$(document).ready(function(){
	var retour = true;  
	var currentPosition = 0;
	var slideWidth = $('.slide').width();
	var slides = $('.slide');
	var numberOfSlides = slides.length;

	slides
	.wrapAll('<div id="slideInner"></div>')
	// on met tous les slides en float:left pour qu'il s'affichent de manière horizontale
	.css({
		'float' : 'left',
		'width' : slideWidth
	});

	// La longueur de #slideInner équivaut à la somme de la longueur de tous les slides
	$('#slideInner').css('width', slideWidth * numberOfSlides);
  
	// Insert les flèches de gauche et de droite  
	$('#slideshow')
	.prepend('<div class="control" id="slide_flecheg"></div>')
	.append('<div class="control" id="slide_fleched"></div>');

	// Cache la flèche de gauche au début
	manageControls(currentPosition);

	// crée un écouteur pour l'évènement de type clic sur les div qui ont la classe .control
	$('.control')
		.bind('click', function(){
		// Determine une nouvelle position
		currentPosition = ($(this).attr('id')=='slide_fleched') ? currentPosition+1 : currentPosition-1;

		if(currentPosition != -1 ){  
			if(currentPosition == numberOfSlides && retour == false ){  
				currentPosition--;  
			}

			//Cache ou montre les flèches
			manageControls(currentPosition);

			// Move slideInner using margin-left
			$('#slideInner').animate({'marginLeft' : slideWidth*(-currentPosition)}, 600);
		}else{
			currentPosition = 0
		}
	});


	// manageControls: Cache ou montre les flêches de controle en fonction de la position courante  
	function manageControls(position){  
		// Cache la fleche "précédent" si on est sur le premier slide  
		if(position==0){
			$('#slide_flecheg').animate({ opacity: 0.3}, 0);
		}else{
			$('#slide_flecheg').animate({ opacity: 1}, 0);
		}  

		// Cache la fleche "suivant" si on est sur le dernier slide (et que le retour automatique n'est pas activé)  
		if(position==numberOfSlides-1 && retour == false){  
			$('#slide_fleched').hide();  
		} else {  
			$('#slide_fleched').show();  
		}  
		
		if(position == numberOfSlides && retour == true){  
			currentPosition = 0;  
			$('#slide_flecheg').animate({ opacity: 0.3}, 0);
		}  
	}  

	function suivant(){  
		$('#rightControl').click();  
	}

});