$(document).ready(function(){
	//Configuration
	var retour = false;
	var tempsTransition = 400;
	var affichePlayPause = true;
	var lectureAutomatique = true;
	var tempsAttente = 8000;

	var icones = new Array();
		icones['play'] = 'images/slideshow/slideshow-play.png';
		if ( navigator.appName == 'Microsoft Internet Explorer' )
			icones['play'] = 'images/slideshow/slideshow-play.gif';
			icones['pause'] = 'images/slideshow/slideshow-pause.gif';

	var currentPosition = 0;
	var slideWidth = 837;
	var slides = $('.slide');
	var numberOfSlides = slides.length;
	var interval;
	var lectureEnCours = false;
	// Supprime la scrollbar en JS
	$('#slidesContainer').css('overflow', 'hidden');

	// Attribue  #slideInner  à toutes les div .slide
	slides
		.wrapAll('<div id="slideInner"></div>')
		// Float left to display horizontally, readjust .slides width
		.css({
			'float' : 'left',
			'width' : slideWidth
		});

	// Longueur de #slideInner égale au total de la longueur de tous les slides
	$('#slideInner').css('width', slideWidth * numberOfSlides);
	

	var imgPrev = '<span class="control" style="visibility:visible;" id="leftControl">&nbsp;</span>';
	var imgNext = '<span class="control" style="visibility:visible;" id="rightControl">&nbsp;</span>';

	if ( navigator.appName == 'Microsoft Internet Explorer' )
	{
		imgPrev = '<span class="control" style="visibility:visible;" id="leftControl">&nbsp;</span>';
		imgNext = '<span class="control" style="visibility:visible;" id="rightControl">&nbsp;</span>';
	}
	
	// Insert controls in the DOM
	/*$('#slideshow').prepend('<!--[if IE]><span class="control" style="visibility:visible;" id="leftControl" style="width:1.8em; height:2.3em; display:block; cursor:pointer; position:absolute; top:12em; z-index:10; left:1em; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/slideshow/slideshow-prev.png\', sizingMethod=\'scale\');" ></span><![endif]--><!--[if !IE]><--><span class="control" style="visibility:visible;" id="leftControl"><img src="images/slideshow/slideshow-prev.png" alt="Précédent" title="Précédent" /></span><!--><![endif]>');
	$('#slideshow').append('<!--[if IE]><span class="control" style="visibility:visible;" id="rightControl" style="width:1.8em; height:2.3em; display:block; cursor:pointer; position:absolute; top:12em; z-index:10; left:72em; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/slideshow/slideshow-next.png\', sizingMethod=\'scale\');" ></span><![endif]--><!--[if !IE]><--><span class="control" style="visibility:visible;" id="rightControl"><img src="images/slideshow/slideshow-next.png" alt="Suivant" title="Suivant" /></span><!--><![endif]>'); */
	$('#slideshow').prepend(imgPrev);
	$('#slideshow').append(imgNext);


  
	// Hide left arrow control on first load
	manageControls(currentPosition);

	//Crée un écouteur d'évènement de type clic sur les classes .control
	$('.control').bind('click', function(){
		// Determine la nouvelle position
		//currentPosition = ($(this).attr('id')=='rightControl') ? currentPosition+1 : currentPosition-1;
		if ($(this).attr('id')=='rightControl') { currentPosition = currentPosition+1 };
		if(currentPosition == numberOfSlides && retour == false ){
			currentPosition--;
			pause();
		}
		
		if ( ($(this).attr('id')=='leftControl') && (currentPosition == 0) && (retour == true) )
		{
			currentPosition = numberOfSlides - 1;
		}
		else if ($(this).attr('id')=='leftControl')
		{
			currentPosition = currentPosition-1;
		}
		
		// Cache ou montre les controles
		manageControls(currentPosition);
		// Fais bouger le slide
		$('#slideInner').animate({
			'marginLeft' : slideWidth*(-currentPosition)
			},tempsTransition);
	});
	// 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){ $('#leftControl').attr('style','visibility:visible;'); } else{ $('#leftControl').attr('style','visibility:visible;') }
		// 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){
			$('#rightControl').attr('style','visibility:visible;');
		} else {
			$('#rightControl').attr('style','visibility:visible;');
		}
		if(position == numberOfSlides && retour == true){
			currentPosition = 0;
			$('#leftControl').attr('style','visibility:visible;');
		}
	}
	function suivant(){
		$('#rightControl').click();
	}
	function start() {
		lectureEnCours = true;
		interval = setInterval(suivant, tempsAttente );
	}
	function pause() {
		lectureEnCours = false;
		clearInterval(interval);
	}
	//Si le diapo est activé 
	if(lectureAutomatique == true){
		start();
	}
	if(affichePlayPause == true){
		$('#slidesContainer').append('<img id="navDiapo" src="" alt="" />');
		if(lectureAutomatique == true){
			$('#navDiapo').attr('src',icones['pause']);
			$('#navDiapo').attr('alt','pause');
			$('#navDiapo').attr('title','pause');
		}else{
			$('#navDiapo').attr('src',icones['play']);	
			$('#navDiapo').attr('alt','play');
			$('#navDiapo').attr('title','play');
		}
		$('#navDiapo').bind('click', function(){
			if(lectureEnCours == true){
				$(this).attr('src',icones['play']);
				pause();
			}else{
				$(this).attr('src',icones['pause']);
				start();
			}
		});
	}

});