function itemVisibleInHandlerAfterAnimation(carousel, li, idx, state, visibleItemsNum, carouselName) 
{
    var pagesCount = Math.round((carousel.size() / visibleItemsNum) +0.49);
    
    for(var i=0; i<pagesCount; i++)
    {
        if(idx == visibleItemsNum * i + 1)
        {
            if (document.getElementById(carouselName + "_" + (i + 1)) != null)
            {
                //Change the current selected button className;
                deSelectControl(carousel, visibleItemsNum, carouselName);
            
                //Apply the selected className to the new button.
                document.getElementById(carouselName + "_" + (i + 1)).className = "jcarousel-control current";
            }
            break;
        }
    }
}

function deSelectControl(carousel, visibleItemsNum, carouselName)
{
    var pagesCount = Math.round((carousel.size() / visibleItemsNum) +0.49);
        
    for(var i=0; i<pagesCount; i++)
    {
        if (document.getElementById(carouselName + "_" + (i + 1)) != null)
            document.getElementById(carouselName + "_" + (i + 1)).className = "jcarousel-control";
    }
}

function itemFirstInHandler(carousel, li, idx, state, visibleItemsNum, carouselName) 
{
    mxSize = getMaxSize(idx, carousel, visibleItemsNum);
        
    var vMes = mxSize.toString() + " - " + idx.toString();
    if (document.getElementById("scrollPos") != null)
        document.getElementById("scrollPos").innerHTML = vMes;
    if (document.getElementById("scrollCount") != null)
        document.getElementById("scrollCount").innerHTML = carousel.size().toString();
    if (state != 'init')
        return;
        
    var pagesCount = Math.round((carousel.size() / visibleItemsNum) +0.49);
    for(var i=0; i<pagesCount; i++)
    {
        jQuery("#" + carouselName + "_" + (i +1)).bind("click", function() 
        {
            doScroll(carousel, visibleItemsNum);
            
            return false;
        });
    }       
}

function getMaxSize(idx, carousel, visibleItemsNum)
{
    var mxSize = 0;
    var CarouselID = idx;
    
    if(CarouselID == 1)
        mxSize = 1;
    else
        mxSize = ((CarouselID -1) * visibleItemsNum) +1;
        
    if (mxSize > carousel.size())
        mxSize = carousel.size();
       
    return mxSize;
}


var carouserButtonIndex = "";
function doScroll(carousel, visibleItemsNum)
{
    carousel.scroll(getMaxSize(carouserButtonIndex, carousel, visibleItemsNum));
}

function InitializeCarousel(name, itemsInPage, direction)
{
    jQuery("#" + name).jcarousel({
        name: name,
        itemVisible: itemsInPage,
        itemScroll: itemsInPage,
		scrollAnimation: 500,
		wrap: false,
		direction:direction,
		itemFirstInHandler: itemFirstInHandler,
		itemVisibleInHandler: {
            onAfterAnimation: itemVisibleInHandlerAfterAnimation
        }
    });
}

function Init()
{
    //debugger;
    InitializeCarousel("mycarousel", 3, "lrt");
//    InitializeCarousel("seriCarousel", 5, "lrt");
//    InitializeCarousel("epiCarousel", 5, "lrt");
//    InitializeCarousel("packCarousel", 5, "lrt");
}

//jQuery(document).ready(function() {Init();});