(function(){
	
	var intervalID,
		INTERVAL_TIME = 10000,
		TRANSITION_TIME = 1000,
		imageData,
		currentSlide = 0,
		numSlides,
		showRunning = true;
	
	$(document).ready(function() {
		$.getJSON("slide_show.php", function(json) {
			$('#bn-tree-carousel')
				.addClass("slide-show")
				.append("<div class=\"image-container\">"
					+ "<div class=\"shadow0\"><div class=\"shadow1\"><div class=\"shadow2\">"
					+ "</div></div></div></div>"
					+ "<div class=\"caption\"></div>");
			$('#bn-tree-carousel .image-container')
				.css("width",json.width)
				.css("height", json.height);
			$.each(json.images, function() {
				$('#bn-tree-carousel .shadow2')
					.append("<img src=\"" + this.name + "\" />");
			});
			$('#bn-tree-carousel img').hide();
			$('#bn-tree-carousel img').eq(currentSlide).show();
			$('#bn-tree-carousel .caption').html(json.images[currentSlide].caption);
			intervalID = window.setInterval(changeSlide,INTERVAL_TIME);
			imageData = json;
			numSlides = json.images.length;
		});
		
		$('#bn-tree-carousel').mouseover(function() {
			window.clearInterval(intervalID);
		}).mouseout( function() {
			if(showRunning) {
				intervalID = window.setInterval(changeSlide,INTERVAL_TIME);
			}
		}).click( function() {
			showRunning = !showRunning;
		});
		
		
	});
	
	function changeSlide() { 
		$('#bn-tree-carousel img').eq(currentSlide).fadeOut(TRANSITION_TIME);
		currentSlide = (currentSlide + 1) % numSlides;
		$('#bn-tree-carousel img').eq(currentSlide).fadeIn(TRANSITION_TIME);
		$('#bn-tree-carousel .caption')
			.fadeOut(TRANSITION_TIME/2, function() {
				$(this).html(imageData.images[currentSlide].caption);
				$(this).fadeIn(TRANSITION_TIME/2);
			});
	}
})();