var mycarousel_itemList = [
	{url: "/images/you-are-uh/yauh-video-youareuh.gif", title: "UH Students Thank You", linkTo: "/giving/opportunities/annual/youareuh/video-uruh/", linkText: "Thank You"},
	{url: "/images/you-are-uh/yauh-video-jake.gif", title: "Jake", linkTo: "/giving/opportunities/annual/youareuh/video-jake/", linkText: "In Depth with Jake"},
	{url: "/images/you-are-uh/yauh-video-aleah.gif", title: "Aleah", linkTo: "/giving/opportunities/annual/youareuh/video-aleah/", linkText: "In Depth with Aleah"},
    {url: "/images/you-are-uh/yauh-video-oliver.gif", title: "Oliver", linkTo: "/giving/opportunities/annual/youareuh/video-oliver/", linkText: "In Depth with Oliver"}
];

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

function slideshow(){
	$.get("/giving/opportunities/annual/youareuh/feature/features.xml",{},function(xml){
		$('feature',xml).each(function(i){
			imgName = $(this).find("name").text();
			imgURL = $(this).find("location").text();
			imgLink = $(this).find("destination").text();
			imgDescription = $(this).find("description").text();
			$("#yauh-slideshow").append("<div class='yauh-slide'><img id='"+i+"' alt='"+imgName+"' src='"+imgURL+"'/><div style='height: 50px; background-color: #000000;'><p style='height: 50px; background-color: #000000;'>"+imgDescription+"</p></div></div>");
		});
		$('#yauh-slideshow').cycle({ 
			fx: 'scrollRight',
			timeout: 7000, 
			random: 1 
		});
	});
}

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;
        }

        carousel.add(i, mycarousel_getItemHTML(mycarousel_itemList[i-1]));
    }
};

function mycarousel_getItemHTML(item)
{
    return '<a href="' + item.linkTo + '"><div class="video-title">' + item.linkText + '</div><img src="' + item.url + '" width="274" height="111" alt="' + item.url + '" /></a>';
};