var tombList = [""];
var tombIndex = 0;
var useTombScroller = true;
function loadItemHandler(carousel, start, last, available)
{
    if (!available) {
 
        for (var i = start; i <= last; i++) {
            if (i >= tombList.length) {
                break;
            }

            carousel.add(i, getItemHTML(tombList[i - 1]));
        }
    }

    // Trigger loaded
    carousel.loaded();

};

function getItemHTML(url)
{

    //return '<img src="' + url + '" width="' + 160 + '" height="' + 160 + '" />';
    //return '<img src="' + url + '" width="' + 170 + '" />';
    return '<img src="' + url + '"  />';

//    return '<img class="tombstoneimage" style="border:1px solid black !important;" width="75px" height="75px" src="' + url + ' />';
};

// Next-Button handling...
var nextOver = function() {
    jQuery(this).attr("src", "/skins/images/next-over.gif");
};

var nextOut = function() {
    jQuery(this).attr("src", "/skins/images/next.gif");
};

var nextDown = function() {
    jQuery(this).attr("src", "/skins/images/next-down.gif");
    tombIndex++;
    scrollHandler(tombIndex,tombList)
};

function nextButtonStateHandler(carousel, button, enabling)
{
    if (enabling) {
        jQuery(button).attr("src", "/skins/images/next.gif")
                      .bind("mouseover", nextOver)
                      .bind("mouseout", nextOut)
                      .bind("mousedown", nextDown);
    } else {
        jQuery(button).attr("src", "/skins/images/next-disabled.gif")
                      .unbind("unmouseover", nextOver)
                      .unbind("unmouseout", nextOut)
                      .unbind("unmousedown", nextDown);
    }
    
}

// Prev-Button handling
var prevOver = function() {
    jQuery(this).attr("src", "/skins/images/prev-over.gif");
};

var prevOut = function() {
    jQuery(this).attr("src", "/skins/images/prev.gif");
};

var prevDown = function() {
    jQuery(this).attr("src", "/skins/images/prev-down.gif");
    tombIndex--;
    scrollHandler(tombIndex,tombList)
};

function prevButtonStateHandler(carousel, button, enabling)
{
    if (enabling) {
        jQuery(button).attr("src", "/skins/images/prev.gif")
                      .bind("mouseover", prevOver)
                      .bind("mouseout", prevOut)
                      .bind("mousedown", prevDown);
    } else {
        jQuery(button).attr("src", "/skins/images/prev-disabled.gif")
                      .unbind("unmouseover", prevOver)
                      .unbind("unmouseout", prevOut)
                      .unbind("unmousedown", prevDown);
    }
    
}

function scrollHandler(idx,list)
{
    if(idx > list.length-(3)) {idx = 0; }
    if(idx < 0) {idx = 0; }
    tombIndex = idx;
    
    var obj = jQuery(".jcarousel-scrollknob").get(0);
    if( obj !== undefined )
    {    
    	var ratio =  Math.round(idx/((list.length>0)?list.length-3:1)*100);
    	var w = obj.offsetWidth-22;
    
    
    	var offset = Math.round( ((w/100)*ratio) );
    	obj.style.backgroundPosition = offset + "px 0px";
    }

    
}

// Ride the carousel...
jQuery(document).ready(function() {
    jQuery("#mycarousel").jcarousel({
        itemVisible: 2,
        itemScroll: 1,
        wrap: true,
        loadItemHandler: loadItemHandler,
        nextButtonStateHandler: nextButtonStateHandler,
        prevButtonStateHandler: prevButtonStateHandler
    });
    if(useTombScroller)
    {
    	jQuery(".jcarousel-prev").after("<span class='jcarousel-scrollknob'></span>");
    }
});