$(function()
{
	// this initialises the demo scollpanes on the page.
	$('#pane1').jScrollPane();
	$('#pane2').jScrollPane({showArrows:true});
	$('#pane3, #pane4').jScrollPane({scrollbarWidth:20, scrollbarMargin:10});

	// this allows you to click a link to add content to #pane4 and shows how to 
	// reinitialise the scrollbars when you have done this.
	$('#add-content').bind(
		'click',
		function()
		{
			$('#pane4').append($('<p></p>').html($('#intro').html())).jScrollPane({scrollbarWidth:20, scrollbarMargin:10});
		}
	);
	// and this allows you to click the link to reduce the amount of content in
	// #pane4 and reinitialise the scrollbars.
	$('#remove-content').bind(
		'click',
		function()
		{
			$('#pane4').empty().append($('<p></p>').html($('#intro').html())).jScrollPane({scrollbarWidth:20, scrollbarMargin:10});
		}
	);
});

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

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

        // Create an object from HTML
        var item = jQuery(mycarousel_getItemHTML(mycarousel_itemList[i-1])).get(0);

        // Apply thickbox
        tb_init(item);

        carousel.add(i, item);
    }
};

/**
 * Item html creation helper.
 */
function mycarousel_getItemHTML(item)
{
    var url_m = item.url.replace(/s_/g, '');
    return '<a href="' + url_m + '" title="' + item.title + '"><img src="' + item.url + '" width="208" height="90" border="0" alt="' + item.title + '" /></a>';
};