var slideshow2 = {

    /* variables */
    nbSlide : 0,
    nbCurrent : 1,
    elemCurrent : null,
    elem : null, // la div contenant le slideshow
    timer : null,

    //elem : la div .slideshow-2-navigation en paramètre
    //slideClass : la classe .slideshow-2-slide en paramètre
    init : function(elem, slideClass){
       overBulle = false;
       this.nbSlide = elem.find(slideClass).size();

       //Créer la pagination
       elem.parent().append('<div class="slideshow-2-navigation"></div>');
       for (var i=1; i<=this.nbSlide;i++){
           elem.parent().find('.slideshow-2-navigation').append('<div>'+i+'</div>');
       }

       //On définit une taille pour les puces de navigation, pour qu'elles soient centrées'
       elem.parent().find('.slideshow-2-navigation').css({"width" : (i-1)*17});

       // Events et appels aux fonctions
       elem.parent().find('.slideshow-2-navigation div').click(function(){slideshow2.gotoSlide($(this).text())});
       elem.parent().find('#slideshow-2-prev').click(function(){slideshow2.prev()});
       elem.parent().find('#slideshow-2-next').click(function(){slideshow2.next()});
       elem.find('.visu a').mouseover(function(){
          index = $(this).index('a.link_store_type')%3;
          slideshow2.showBulle($(this), index);
       });
       elem.find('.visu a').mouseout(function(){
           slideshow2.hideBulle($(this));
        });


       //Initialisation du slideshow
       this.elem = elem;
       elem.find(slideClass).hide();
       elem.find(slideClass+":first").show();
       this.elemCurrent = elem.find(slideClass+":first");
       this.elem.parent().find(".slideshow-2-navigation div:first").addClass("active");

       //Initialisation du timer
       //slideshow2.play();

       //Stop slideshow quand la souris est dessus
       //elem.mouseover(slideshow2.stop);
       //elem.mouseout(slideshow2.play);
    },

    gotoSlide : function(num){
        if(num == this.nbCurrent){return false;}

       /* Animation en slides */
       var sens = 1;
       if(num<this.nbCurrent){sens = -1;}
       var cssDepart = {"left" : sens*this.elem.width()};
       var cssFin =    {"left" : -sens*this.elem.width()};
       this.elem.find("#slide"+num).show().css(cssDepart);
       this.elem.find("#slide"+num).animate({"top" : 0, "left" : 0}, 700);
       this.elemCurrent.animate(cssFin, 700);

       this.elem.parent().find(".slideshow-2-navigation div").removeClass("active");
       this.elem.parent().find(".slideshow-2-navigation div:eq("+(num-1)+")").addClass('active');
       this.nbCurrent = num;
       this.elemCurrent = this.elem.find("#slide"+num);

    },

    next : function(){
        var num = this.nbCurrent+1;
        if(num>this.nbSlide){
            num = 1;
        }
        this.gotoSlide(num);
    },

    prev : function(){
        var num = this.nbCurrent-1;
        if(num<1){
            num = this.nbSlide;
        }
        this.gotoSlide(num);
    },

    stop : function(){
        window.clearInterval(slideshow2.timer);
    },

    play : function(){
        slideshow2.timer = window.setInterval("slideshow2.next()", 4000);
    },

    showBulle : function(myLink, index){
        this.elem.append("<span class='infobulle'></span>");
        var bulle = $('.infobulle:last');
        bulle.append(myLink.attr('title'));
        myLink.attr("title", "");

        /*var posTop = myLink.position().top-myLink.height + 80;*/
        var posLeft = (190*index) + (myLink.width()/2) - (bulle.width()/2);

        bulle.css({
            left:posLeft,
            top: 15,
            opacity : 0
        });
        bulle.stop().animate({
            top: 25,
            opacity : 1
        },300);
    },

    hideBulle : function(myLink){
       var bulle = $('.infobulle:last');
       myLink.attr("title", bulle.text());
       bulle.stop().animate({
            top: 10,
            opacity : 0
        },300, "linear", function(){
            bulle.remove();
        })
    }
}