var nSlide = 0;
var c_left = 0;
var c_right = 0;
var reset = false;
var duration = 1500;
var auto_slide = true;

$(document).ready(function(){

    nSlide = $('.boxettino_hp').length;

    /*** inizializziamo c_right, per cambiare l'ordine iniziale con cui si scorrono le valorizzare c_left ***/
    c_right = nSlide -4; //4 = il numero di immagini che si vedono

     if(c_left == 0)
        $('#arr_dx img').attr('src','/css/arrow_dx2.png');

    if(c_right == 0)
        $('#arr_sx img').attr('src','/css/arrow_sx2.png');

    $('#arr_sx img').bind('click',{stop_auto:"true"},move_sx);
    $('#arr_dx img').bind('click',{stop_auto:"true"},move_dx);

    setTimeout("cycle()",4000);
    
});


var cycle = function(){

    if(auto_slide){
        if(reset)
            setTimeout("reset_cycle()",4000);
        else{

            move_sx();

            setTimeout("cycle()",4000);
        }
    }

}
var reset_cycle = function(){

    $("#cont_slide").css('margin-left','0px');
    c_right = nSlide -4;
    c_left = 0;
    reset = false;
    
    setTimeout("cycle()",4000);

    return false;
}

var move_sx = function(data){

    if(data != undefined){ auto_slide = false; }

    if(c_right > 0){

        $('#arr_dx img').attr('src','/css/arrow_dx.png');

        c_right--;
        c_left++;

        lock();

        $("#cont_slide").animate({
            marginLeft:"-=158px"
        }, {
            duration: duration,
            queue: false,
            easing: "swing",
            complete: unlock
        });
    }
    
    return false;
}

var move_dx = function(data){

    if(data != undefined){ auto_slide = false;   }

    if(c_left > 0){

        //la freccetta sinistra ora è attiva
        $('#arr_sx img').attr('src','/css/arrow_sx.png');

        c_left--;
        c_right++;

        lock();

        $("#cont_slide").animate({
            marginLeft:"+=158px"
        }, {
            duration: duration,
            queue: false,
            easing: "swing",
            complete: unlock
        });

    }

    return false;
}

var unlock = function(){
    unlock_sx();
    unlock_dx();
}

var lock = function(){
    lock_sx();
    lock_dx();

}



//blocchiamo la freccia destra
var lock_dx = function(){

    $('#arr_dx img').unbind();
    $('#arr_dx img').bind('click',function(){
        return false;
    });
}

//riassiociame l'evento alla freccia destra
var unlock_dx = function(){

    $('#arr_dx img').bind('click',{stop_auto:"true"},move_dx);

    //controlliamo quante immagini ci sono a sinistra
    if(c_left == 0)
        $('#arr_dx img').attr('src','/css/arrow_dx2.png');
   

}

//blocchiamo le freccetta sinistra
var lock_sx = function(){

    $('#arr_sx img').unbind();
    $('#arr_sx img').bind('click',function(){
        return false;
    });

    
    
}

//riassociamo l'evento click alla freccetta sinistra
var unlock_sx = function(){

    //controlliamo quante immagini ci sono a destra, dobbiamo anche controllare se l'automatismo deve resettarsi oppure no
    if(c_right == 0){

        //se non ce ne sono più, la freccetta diventa grigia perchè non possiamo più cliccare
        $('#arr_sx img').attr('src','/css/arrow_sx2.png');

        reset = true;
    }
    else
        reset = false;
   
   $('#arr_sx img').bind('click',{stop_auto:"true"},move_sx);
  


    
}