var $j = jQuery.noConflict();
var $slideshowElements;
var $activeBackgroundElement;

$j(function () {
	prepareSlideshow();
});

function prepareSlideshow() {
	//Get all slideshow elements
	$slideshowElements = $j('div.slideshowLayer');
	
	//Perform actions on slideshowElement
	$slideshowElements.each(function () {
		//Hide the element
		$j(this).css({ opacity: 0.0 });
		$j(this).css('z-index', '1');
		//Set background image and remove the actual image
		//var image = $j(this).children('img');
		//$j(this).css('background-image', 'url(' + $j(image).attr('src') + ')');
		//$j(image).remove();
	});

	setTimeout('loadFirst()', 500);
}

function loadFirst() {
	//Get the first element
	$activeBackgroundElement = $slideshowElements.get(0);
	$j($activeBackgroundElement).css('z-index', '2');
	$j($activeBackgroundElement).animate({ opacity: 1.0 }, 2000, function () { setInterval('slideSwitch()', 7000); });
}

function slideSwitch() {
	next = $j($activeBackgroundElement).next().length ? $j($activeBackgroundElement).next() : $slideshowElements.get(0);
	$j(next).css('z-index', '3');
	$j(next).animate({ opacity: 1.0 }, 2000, function () 
	{
		$j($activeBackgroundElement).css({ opacity: 0.0 });
		$j($activeBackgroundElement).css('z-index', '1');
		$activeBackgroundElement = next;
		$j($activeBackgroundElement).css('z-index', '2');
	});
}