function mycarousel_initCallback(carousel, state)
{
    // Lock until all items are loaded. That prevents jCarousel from
    // setup correctly and we have to do that in the ajax callback
    // function with carousel.setup().
    // We're doing that because we don't know the exact height of each
    // items until they are added to the list.
    carousel.lock();

    jQuery.get(
        '/randomfeed',
        {
            'feed': 'ranodomcategory'
        },
        function(xml) {
            mycarousel_itemAddCallback(carousel, xml);
        },
        'xml'
    );
};

function mycarousel_itemAddCallback(carousel, xml)
{
    var $items = jQuery( 'item', xml );

    $items.each(function(i) {
        carousel.add(i + 1, mycarousel_getItemHTML(this));
    });

    carousel.size( $items.length );

    // Unlock and setup.
    carousel.unlock();
    carousel.setup();
};

/**
 * Item html creation helper.
 */
function mycarousel_getItemHTML(item)
{
    return '<a href="'+$( 'url', item ).text()+'" style="background-image:url('+ $( 'image', item ).text() +')"><span>'+$( 'name', item ).text()+'</span></a>';
};

jQuery(document).ready(function() {
    //stop the carousel for now
    return;
    /**
     * We show a simple loading indicator
     * using the jQuery ajax events
     */
    jQuery().ajaxStart(function() {
        jQuery( ".jcarousel-clip-vertical" ).addClass('loading');
    });

    jQuery().ajaxStop(function() {
        jQuery( ".jcarousel-clip-vertical" ).removeClass('loading');
    });

    jQuery( '#mycarousel' ).jcarousel({
        vertical: false,
        size: 0,
        wrap: 'both',
        scroll: 1,
        initCallback: mycarousel_initCallback
    });
});