/*###########################################*/
/*######################## jcarousel Scripts */
/*###########################################*/
// Set thickbox loading image
tb_pathToImage = "../images/loading-thickbox.gif";
var mycarousel_itemList = [
	{url: "projects/ODEMap/images/ODEMap_s.png", title: "ODE Data Visualization Map"},
	{url: "projects/androidRSA/images/androidRSA_s.png", title: "Android RSA Application"},
	{url: "projects/clientSide/images/clientSide_s.png", title: "Client Side Development"}
];

function mycarousel_itemVisibleInCallback(carousel, item, i, state, evt){
	// The index() method calculates the index from a
	// given index who is out of the actual item range.
	var idx = carousel.index(i, mycarousel_itemList.length);
	// Create an object from HTML
	var item = $(mycarousel_getItemHTML(mycarousel_itemList[idx - 1])).get(0);
	// Apply thickbox
	tb_init(item);
	carousel.add(i, item);
};

function mycarousel_itemVisibleOutCallback(carousel, item, i, state, evt){
	carousel.remove(i);
};

/**
 * Item html creation helper.
 */
function mycarousel_getItemHTML(item){
	var url_m = item.url.replace(/_s.png/g, '_m.png');
	var url_html = item.url.replace(/_s.png/g, '.html');
	url_html = url_html.replace("/images","");
	var url_perams = "?keepThis=true&TB_iframe=true&height=550&width=800"
	return '<a href="' + url_html + url_perams + '" title="' + item.title + '"><img src="' + item.url + '" width="300" height="189" alt="' + item.title + '" /></a>';
};

/*###########################################*/
/*############################### Start here */
/*###########################################*/
$(document).ready(function() {
	/*###########################################*/
	/*######################## jcarousel Scripts */
	/*###########################################*/
	$('#mycarousel').jcarousel({
		vertical: true,
		wrap: 'circular',
		scroll: 1,
		itemVisibleInCallback: {onBeforeAnimation: mycarousel_itemVisibleInCallback},
		itemVisibleOutCallback: {onAfterAnimation: mycarousel_itemVisibleOutCallback}
	});
});