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

    var icones = new Array();
    icones['play2'] = 'img/play_slider.png';
    icones['pause2'] = 'img/pause_slider.png';

    var currentPosition = 0;
    var slideWidth = 250;
    var slides = $('.slide2');
    var numberOfSlides = slides.length;
    var interval;
    var lectureEnCours = true;
    // Supprime la scrollbar en JS
    $('#slidesContainer2').css('overflow', 'hidden');

    // Attribue  #slideInner   toutes les div .slide
    slides
    .wrapAll('<div id="slideInner2"></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
    $('#slideInner2').css('width', slideWidth * numberOfSlides);

    // Insert controls in the DOM
    $('#slideshow2')
    .prepend('<span class="control2" id="leftControl2">Prcdent</span>')
    .append('<span class="control2" id="rightControl2">Suivant</span>');



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

    //Cre un couteur d'vnement de type clic sur les classes .control
    $('.control2')
    .bind('click', function() {

        // Determine la nouvelle position
        currentPosition = ($(this).attr('id') == 'rightControl2') ? currentPosition + 1 : currentPosition - 1;

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

        // Cache ou montre les controles
        manageControls(currentPosition);
        // Fais bouger le slide
        $('#slideInner2').animate({
            'marginLeft': slideWidth * (-currentPosition)
        }, tempsTransition);
    });

    // manageControls: Cache ou montre les flches de controle en fonction de la position courante
    function manageControls(position) {
        // Cache la fleche "prcdent" si on est sur le premier slide
        if (position == 0) { $('#leftControl2').hide() } else { $('#leftControl2').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) {
            $('#rightControl2').hide();
        } else {
            $('#rightControl2').show();
        }
        if (position == numberOfSlides && retour == true) {
            currentPosition = 0;
            $('#leftControl2').hide();
        }
    }
    function suivant() {
        $('#rightControl2').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) {
        $('#slidesContainer2').prepend('<img id="navDiapo2" src="" alt="Navigation diaporama" />');
        if (lectureAutomatique == true) {
            $('#navDiapo2').attr('src', icones['pause2']);
        } else {
            $('#navDiapo2').attr('src', icones['play2']);
        }
        $('#navDiapo2').bind('click', function() {
            if (lectureEnCours == true) {
                $(this).attr('src', icones['play2']);
                pause();
            } else {
                $(this).attr('src', icones['pause2']);
                start();
            }
        });
    }



});