urls=new Array();  //image data arrays 
titles=new Array();
descriptions=new Array();
widths=new Array();
heights=new Array();
slideIndex = 1; //current slide
currentIndex = 0; //image whose thumbnail was just clicked
carouselSize = 0;
var rssLocation = document.location.href.substring(0,document.location.href.lastIndexOf('/')+1);

function mycarousel_initCallback(carousel) {
	$.get(rssLocation + "rss.xml",{},function(xml){
		$('item',xml).each(function(i) { // iterate through xml tags
		//images
			imageTitle = $("title",this).text();
			imageLink = $("link",this).text();
			imageDesc = $("description",this).text();
			imageContent = ($.browser.msie) ? this.getElementsByTagName("media:content")[0] : $(this.getElementsByTagNameNS("http://search.yahoo.com/mrss","content"));
			imageURL = $(imageContent).attr("url");
			imageW = $(imageContent).attr("width");
			imageH = $(imageContent).attr("height");
		//thumbs
			thumbContent = ($.browser.msie) ? this.getElementsByTagName("media:thumbnail")[0] : $(this.getElementsByTagNameNS("http://search.yahoo.com/mrss","thumbnail"));
			thumbURL = $(thumbContent).attr("url");
			thumbW = $(thumbContent).attr("width");
			thumbH = $(thumbContent).attr("height");
		//store info in arrays
			urls[i]=imageURL;
			titles[i]=imageTitle;
			descriptions[i]=imageDesc;
			widths[i]=imageW;
			heights[i]=imageH;
		// build thumbnail img/anchor tag, store in string
			thumb = assembleThumb(imageLink, imageURL, imageW, imageH, thumbURL, thumbW, thumbH, i+1);
		//add to carousel
			carousel.add(i+1, thumb);
		});
		carouselSize = $('item',xml).size();
		carousel.size(carouselSize);
	});

}

function assembleThumb(imageLink, imageURL, imageW, imageH, thumbURL, thumbW, thumbH, currentIndex) {
	output = '';
	output += "<a href=\"" + imageURL + "\" alt=\"\" onclick=\"loadSlide(\'" + imageURL + "\'," + imageW + "," + imageH + "," + currentIndex + ");return false;\">";
	output += "<img src=\"" + thumbURL + "\" height=\"" + thumbH + "\" width=\"" + thumbW + "\" border=\"0\">";
	output += "</a>";
	return output;
};

function loadSlide(url, width, height, currentIndex) {
	if (slideIndex < carouselSize || currentIndex < carouselSize) {
		$("div#slide-image img").animate({ opacity: 0}, 150, function (){
			$(this).attr("src", url).animate({ opacity: 1}, 300);
		});
		$("#slide-caption h2").html(titles[currentIndex-1]).next("h6").html(descriptions[currentIndex-1]);
		$("div#mycarousel li a").removeClass("current").eq(parseInt(currentIndex,10)-1).addClass("current");
		slideIndex=currentIndex;
	}
}

function docReady() {
    $('#mycarousel').jcarousel({
		start: 1,
		offset: 1,
        visible: 6,
		scroll: 1,
		buttonNextHTML: "<div><a id=\"next\">Next</a></div>",
		buttonPrevHTML: "<div><a id=\"previous\">Previous</a></div>",
		buttonNextEvent: "click",
		buttonPrevEvent: "click",
		initCallback: mycarousel_initCallback
    });
	
	$("#slide-image img").bind('click', function() {
		if (slideIndex < (carouselSize)) {
			loadSlide(urls[slideIndex], widths[slideIndex], heights[slideIndex], slideIndex+1);
			$(".jcarousel-next").trigger('click');	
			return false;
		}
	});
	
	/* Next button on Hover
	$("#slide-image").append("<p>Next ></p>");
	
	$("#slide-image").hover(
		function () {
			if (slideIndex < (carouselSize)) {
				$("p", this).animate({ opacity: 1}, 300);
			}
		}, 
		function () {
			$("p", this).animate({ opacity: 0}, 300);
		}
	);
	*/
};

docReady();

$(function () {
	for(var i = 0; i<urls.length; i++) {
		var image1 = $('<img />').attr('src', urls[i]);
	}
});