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

    var icones = new Array();
    icones['play'] = '/graf/slider/play_slider.png';
    icones['pause'] = '/graf/slider/pause_slider.png';	

    var currentPosition = 0;
    var slideWidth = 1000;
    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);

    // Insert controls in the DOM    
    if(typeof txtAnterior == "undefined") txtAnterior = '&lt;&lt;';
    if(typeof txtSiguiente == "undefined") txtSiguiente = '&gt;&gt;';
    $('#slideshow')
    .prepend('<span class="control" id="leftControl"><span class="control_left">' + txtAnterior + '</span></span>')
    .append('<span class="control" id="rightControl"><span class="control_right">' + txtSiguiente + '</span></span>');


    // 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(currentPosition == numberOfSlides && retour == false ){
                    currentPosition--;
                    pause();
            }

            // 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').hide() } else{ $('#leftControl').show() }
        // 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').hide();
        } else {
            $('#rightControl').show();
        }
        if(position == numberOfSlides && retour == true){
            currentPosition = 0;
            $('#leftControl').hide();
        }
    }
    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').prepend('<img id="navDiapo" src="" alt="Play" />');
        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();
            }
        });
    }

});