//var cntli = 0;
var caritems = 4;

$(document).ready(function () {
    // sposto al top l'elemento di default
    var hdProd = $hdProd();
    var psel = $("a[title='" + hdProd.val() + "']", "#contentDetail");
    var divSel = psel.parent().parent();
    var divSelHtml = divSel.html();
    divSel.remove();
    $("#contentDetail ul").prepend('<li>' + divSelHtml + '</li>');

    // riposiziono i bordi
    var i = 0;
    $("#contentDetail ul li div").removeClass("border-carousel-blank");
    $("#contentDetail ul li div").each(function () {
        if (i % 4 != 0)
            $(this).addClass("border-carousel");
        else
            $(this).addClass("border-carousel-blank");
        i++;
    });

    bindCarrouselEvent();
});

function setSelProd(prd) {
    prd.parent().parent().addClass("prodsel");
}

function unselProds() {
    $("#contentDetail ul li").removeClass("prodsel");
}

function isSelProd(prd) {
    return prd.parent().parent().hasClass("prodsel");
}

/*
function onSelProd() {
    //set selected:
    var psel = $("a[title='" + $hdProd().val() + "']", "#contentDetail");
    setSelProd(psel);
}
*/

function bindCarrouselEvent() {
    var hdProd = $hdProd();
    if (hdProd != null) {
        $("#contentDetail a").click(function(e) {
            if(!isSelProd($(this)))
            {
                hdProd.val($(this).attr('title'));
                //document.getElementById("formProd").submit();
                doGAT($(this).attr('href'))
                $("#formProd").trigger('submit');
                unselProds();
                setSelProd($(this));
            }
            return false;
        });

        $("#contentDetail .carouselNumber").click(function(e) {
            $(this).parent().find("a:first").trigger("click");
        });
    }
    //set selected:
    var psel = $("a[title='" + hdProd.val() + "']", "#contentDetail");
    setSelProd(psel);
    
    var sel = $("#contentDetail ul li.prodsel");
    var ind = $("#contentDetail ul li").index(sel);

    ind = Math.floor(ind / caritems) * caritems;
    //alert(ind);

    $("#contentDetail").jCarouselLite({
        btnNext: "#carouselArrowBtnDown",
        btnPrev: "#carouselArrowBtnUp",
        vertical: true,
        circular: false,
        visible: caritems,
        scroll: caritems,
        speed: 600,
        start:ind,
        afterEnd: function(a) {
            enableScroll(a);
        }
    });

    enableScroll(sel);

    /*cntli = $('#contentDetail ul li').size();

    $('#carouselArrowBtnUp img').hide();
    if(cntli <= 3)
    $('#carouselArrowBtnDown img').hide();*/
}

function enableScroll(item) {
    var items = $("#contentDetail ul li");
    var ind = items.index(item);
    var cnt = items.size();
    
    if (ind >= cnt-caritems)
        $('#carouselArrowBtnDown img').hide();
    else
        $('#carouselArrowBtnDown img').show();
    if (ind < caritems)
        $('#carouselArrowBtnUp img').hide();
    else
        $('#carouselArrowBtnUp img').show();
    
}
/*
function enableScroll(item) {
    //alert(item.next().next().next().html());
    if (item.parent().children(":last").html() == item.next().next().next().html())
        $('#carouselArrowBtnDown img').hide();
    else
        $('#carouselArrowBtnDown img').show();
    if (item.parent().children(":first").html() == item.html())
        $('#carouselArrowBtnUp img').hide();
    else
        $('#carouselArrowBtnUp img').show();
}
*/

function $hdProd() {
    var hdProd = $("input:hidden#hdProd");
    if (hdProd.attr('id') != null)
        return hdProd;
    else
        return null;
}

bajb_backdetect.OnBack = function() {
    setSBarCookie();
    //alert($.cookie('cktest'));
}
// Zoom Function
function Zoom() {
    if ($('#zoom').css('display') == 'none') {
        $('#zoom').fadeIn('slow');
    } else {
        $('#zoom').fadeOut('fast');
    }
}
// Product Description
function ProductDescription() {
    if ($('#productDescription').css('display') == 'none') {
        $('#productDescription').fadeIn('slow');
    } else {
    $('#productDescription').fadeOut('slow');
    }
}

// Frame size
function FrameSize() {
    if ($('#framesize').css('display') == 'none') {
        $('#framesize').fadeIn('slow');
    } else {
    $('#framesize').fadeOut('slow');
    }
}