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

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

    var currentPosition = 0;
    var slideWidth = 560;
    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
    $('#slideshow')
    .prepend('<span class="control" id="leftControl">Précédent</span>')
    .append('<span class="control" id="rightControl">Suivant</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="Navigation diaporama" />');
        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();
            }
        });
    }



});