function mycarousel_itemLoadCallback(carousel, state)
    {
    // carousel.first is the first in the view 
    // carousel.last is the last in the view 
    // since we only have one image either first or last will give the index of the image being shown

        for (var i = carousel.first; i <= carousel.last; i++) {
            if (carousel.has(i)) {
                continue;
            }

            if (i > mycarousel_itemList.length) {
                break;
            }

            carousel.add(i, mycarousel_getItemHTML(mycarousel_itemList[i-1]));
        }
            
        $("#topHotelName").text(mycarousel_itemList[carousel.first-1].Name);
        $("#topHotelCity").text(mycarousel_itemList[carousel.first-1].CityText);
        $("#topHotelPrice").text(mycarousel_itemList[carousel.first-1].CheapestPrice);
    };
    
//    function mycarousel_getItemHTML(item)
//    {
//        return '<img src="' + item.ImageFileName + '" alt="' + item.ImageFileName + '" />';
//    };

    jQuery(document).ready(function() {
        jQuery('#mycarousel').jcarousel({
            size: mycarousel_itemList.length,
		    scroll: 1,
            itemLoadCallback: {onBeforeAnimation: mycarousel_itemLoadCallback}
        });
    });