/*
 * Tutorial Easy slider
 * Autor: Osiris Magro
 * Fecha: 15/02/2010
 * Compartelo como quieras
 */

$(document).ready(function(){

    /*
     * Variables
     */

    var slides, timer;

    var transitionTime = 600;
    var slideTime = 4000;

    timer = null;
    //Crea un objeto con información de los slides
    slides = $('#boxesCarrousel .boxesCarrouselListWrap > .boxCarrItem');


    /*
     * Funciones
     */
    
    //Desplaza el contenedor hacia la dirección definida
    function sliderScroll(direction){

       //Calcula la posición actual del contenedor
       position = $('#boxesCarrousel').scrollLeft();

       //Calcula la anchura total menos el último slide.
       //Se usa para calcular cuando el scroll llega al final.
       totalWidth = (slides.length * slides[0].offsetWidth) - slides[0].offsetWidth

       //Se comprueba la variable direction para hacer el scroll hacia izquierda o derecha
       switch (direction) {
            case 'right': //Derecha
                if (position+slides[0].offsetWidth > totalWidth){ //Si la siguiente posición se sale del contenedor, vuelve al principio.
                    //$('#inboxesCarrousel:not(:animated)').animate({scrollLeft:0},1000);
                    $(".boxCarrItem").fadeOut(transitionTime, function(){
                        $('#boxesCarrousel:not(:animated)').scrollLeft(0);
                        $(".boxCarrItem").fadeIn(transitionTime);
                        
                    } );
                } else { //Si no es el final, suma a la posición actual la anchura del slide.
                    var offset=slides[0].offsetWidth;
                    $(".boxCarrItem").fadeOut(transitionTime, function(){
                        $('#boxesCarrousel:not(:animated)').scrollLeft(position+offset);
                        $(".boxCarrItem").fadeIn(transitionTime);
                    });
                }
                break;

            case 'left': //Izquierda
                if (position-slides[0].offsetWidth < 0){ //Si la siguiente posición se sale del contenedor, vuelve al final.
                    //$('#inboxesCarrousel:not(:animated)').animate({scrollLeft:totalWidth},1000);
                    $(".boxCarrItem").fadeOut(transitionTime, function(){
                        $('#boxesCarrousel:not(:animated)').scrollLeft(totalWidth);
                        $(".boxCarrItem").fadeIn(transitionTime);
                    } );
                } else { //Si no es el final, resta a la posición actual la anchura del slide.
                    var offset=slides[0].offsetWidth;
                    $(".boxCarrItem").fadeOut(transitionTime, function(){
                        $('#boxesCarrousel:not(:animated)').scrollLeft(position-offset);
                        $(".boxCarrItem").fadeIn(transitionTime);
                    } );

                }
                break;
        }

   }

   //Función que crea el temporizador
   function initTimer(){
        timer = setInterval(function(){sliderScroll('right');}, slideTime);
   }


   /*
    * Código
    */

    //Asigna el ancho total de los slides al contenedor
    //La anchura total se obtiene multiplicando la medida de un slide por el número de slides)
    $('#boxesCarrousel .boxesCarrouselListWrap').css('width',slides[0].offsetWidth * slides.length);


    //Click en el botón "next"
    $('.sliderIBControlNext').click(function(){
        clearInterval(timer); //Desactiva el temporizador
        sliderScroll('right'); //Mueve el scroll a la derecha
        initTimer(); //Vuelve a activar el temporizador
        return false;
    });

    //Click en el botón "prev"
    $('.sliderIBControlBack').click(function(){
        clearInterval(timer); //Desactiva el temporizador
        sliderScroll('left'); //Mueve el scroll a la izquierda
        initTimer(); //Vuelve a activar el temporizador
        return false;
    });
    
    $('#boxesCarrousel').mouseover(function(){
        if(timer!=null)
            clearInterval(timer); //Desactiva el temporizador
        timer=null;
    });

    $('#boxesCarrousel').mouseout(function(){
        if(timer==null)
            initTimer(); //Vuelve a activar el temporizador
    });

    //Inicia el temporizador
    initTimer();

});