$(document).ready(function(){
	//Configuration
		  var retour = true; //boucle si à vrai
// effets possibles :
//  - MoveSlides : déplace de gauche à droite ou de bas vers le haut les slides avec un effet...
//      -directionVertical : indique la direction du déplacement des slides 	
//  - FadeSlides : effet de fondu enchainé
      var TypeOfAnimation = 'FadeSlides'; 	
      
      // TypeOfAnimation == MoveSlides  
		  var directionVertical = false; //horizontal sinon 

 		  var tempsTransition = 2000;


		  var affichePlayPause = false; //affiche les boutons de navigation
		  var lectureAutomatique = true;
		  var tempsAttente = 7000;
			
		  var icones = new Array();
		  		icones['play'] = 'images/play_slider.png';
		  		icones['pause'] = 'images/pause_slider.png';	
			
		  var currentPosition = 0;
		  var slideWidth = 909;
		  var slideHeight = 224;
		  var slides = $('.slide');
		  var numberOfSlides = slides.length;
		  var interval;
		  var lectureEnCours = false;
      
      var ControlsDisplay=false;
      
      var LastSlide = numberOfSlides; 
  // Supprime la scrollbar en JS
  $('#slidesContainer').css('overflow', 'hidden');

  //init animation
  if (TypeOfAnimation == 'MoveSlides') MoveSlidesInit();
  else if (TypeOfAnimation == 'FadeSlides') FadeSlidesInit();
  
    // Insert controls in the DOM
    $('#slideshow')
      .prepend('<span class="control" id="leftControl">Précédent</span>')
      .append('<span class="control" id="rightControl">Suivant</span>');
  
    
  if(affichePlayPause == true)
  {
    // Hide left arrow control on first load
    $('#leftControl').show();
    $('#rightControl').show();
  }
  manageControls(currentPosition);

  //manageControlsDisplay(ControlsDisplay);
                                                                                                  
  //Crée un écouteur d'évènement de type clic sur les classes .control
  // gère ainsi l'animation en avant ou arrière
  $('.control')
    .bind('click', function(){
		
    clear_animation();
    
		// Determine la nouvelle position
 		LastSlide=currentPosition;
		currentPosition = ($(this).attr('id')=='rightControl') ? currentPosition+1 : currentPosition-1;

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

		// Cache ou montre les controles
		manageControls(currentPosition);
		
		if (TypeOfAnimation == 'MoveSlides') MoveSlides();
		else if (TypeOfAnimation == 'FadeSlides') FadeSlides();

    
    continue_animation();
  });//end control bind

  $('#slideshow')
    .bind('mouseenter', function(){
    manageControlsDisplay(true);
  })//end control bind mouseover

  $('#slideshow')
    .bind('mouseleave', function(){
    manageControlsDisplay(false);
  })//end control bind mouseover



  function MoveSlidesInit()
  {
    // Attribue  #slideInner  à toutes les div .slide
  	if (directionVertical)
  	{
  	  slides
  		.wrapAll('<div id="slideInner"></div>')
  		// Float up to display vertically, readjust .slides height
  		.css({
  		  'float' : 'left',
  		  'height' : slideHeight
  		});
  	  // Longueur de #slideInner égale au total de la longueur de tous les slides
  	  $('#slideInner').css('height', slideHeight * numberOfSlides);
  	}
  	else
  	{
  	  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);
  	}
  }


  function MoveSlides()
  {
		// Fais bouger le slide
		if (directionVertical)
		{
			//on fait un fondu sur la photo en cours
			if (currentPosition-1 >= 0) 
				$(slides[currentPosition-1]).animate(
					{opacity: 0},
					tempsTransition,
					function() 
					{
					}					  
				);

			//on fait monter la photo du dessous
			$('#slideInner').animate(
				{'marginTop' : slideHeight*(-currentPosition)},
				tempsTransition,
				function() 
				{ // et on remet l'opacité sur la photo qu'on a précédement rendue transparente
					if (currentPosition-1 >= 0) 
						$(slides[currentPosition-1]).animate(
							  {opacity: 1},
							  0);
				}
			);

		}
		else
		{
			//on fait un fondu sur la photo en cours
			if (currentPosition-1 >= 0) 
				$(slides[currentPosition-1]).animate(
					{opacity: 0},
					tempsTransition,
					function() 
					{
					}					  
				);

			//on fait monter la photo du dessous
      if (currentPosition == 0) TransitTime=0;else TransitTime=tempsTransition;
			$('#slideInner').animate(
				{'marginLeft' : slideWidth*(-currentPosition)},
				TransitTime,
				function() 
				{ // et on remet l'opacité sur la photo qu'on a précédement rendue transparente
					if (currentPosition-1 >= 0) 
						$(slides[currentPosition-1]).animate(
							  {opacity: 1},
							  0);
				}
			);

		}

  }
  
  function FadeSlidesInit()
  {
  	jQuery.each(slides, function(i){
  		$(slides[i]).css('zIndex', slides.length - i).css('position', 'absolute').css('top', '0').css('left', '0');
  	});

  }

  function FadeSlides()
  {
    
		$(slides[LastSlide]).animate(
			{opacity: 0},
			tempsTransition,
			function() 
			{
			}					 
    ); 

		$(slides[currentPosition]).animate(
			{opacity: 1},
			tempsTransition,
			function() 
			{
			}					  
		);
		
  }

  function manageDisplayofControl(aControl,on_display)
  {
    if (on_display)
      aControl.animate(
							  {opacity: 1},
							  tempsTransition, function() {});
    else
      aControl.animate(
							  {opacity: 0},
							  tempsTransition, function() {});
    
  }
  
  function manageControlsDisplay(on_display){
    ControlsDisplay=on_display; 
    if(affichePlayPause == true)
    {
      manageDisplayofControl($('#leftControl'),on_display);
      manageDisplayofControl($('#rightControl'),on_display);
      manageDisplayofControl($('#navDiapo'),on_display);
    }
    manageControls(currentPosition);

  }

  // manageControls: Cache ou montre les flêches de controle en fonction de la position courante
  function manageControls(position)
  {
 
  	// Cache la fleche "suivant" si on est sur le dernier slide (et que le retour automatique n'est pas activé)
    if (ControlsDisplay && affichePlayPause)  
    {
      if( (position >= numberOfSlides-1) && (retour == false))
      {
    		$('#rightControl').hide();
    	} 

      if( (position<=0) && (retour == false))
      {
    		$('#leftControl').hide();
    	} 

    }
  	if( (position >= numberOfSlides) && (retour == true) )
    {
  		currentPosition = 0;
  	}
    else if( (position < 0) && (retour == true)  )
    {
  		currentPosition = numberOfSlides-1;
    }

  }
  
  function suivant(){
	$('#rightControl').click();
	}
  function start() {
  	lectureEnCours = true;
    interval = setInterval(suivant, tempsAttente );
  }
  function pause() {
  	lectureEnCours = false;
   clearInterval(interval);
  }
  function continue_animation() {
    if (lectureEnCours) interval = setInterval(suivant, tempsAttente );
  }
  function clear_animation() {
   if (lectureEnCours) clearInterval(interval);
  }


  
   //Si le diapo est activé 
  if(lectureAutomatique == true){
    start();
  }
  if(affichePlayPause == true)
  {
  	$('#slidesContainer').prepend('<img id="navDiapo" src="" alt="Navigation diaporama" />');
    manageControlsDisplay(ControlsDisplay);
  	if(lectureAutomatique == true){
  		$('#navDiapo').attr('src',icones['pause']);
  	}else{
  		$('#navDiapo').attr('src',icones['play']);	
  	}
  	$('#navDiapo').bind('click', function(){
  		if(lectureEnCours == true){
  			$(this).attr('src',icones['play']);
  			pause();
  		}else{
  			$(this).attr('src',icones['pause']);
  			start();
  		}
  	});
  }


  	
});