//initialize the slide show
function cscInit() {
	//alert('cscInit');
	//set the width of the ul
	$('#spotlightContainer #spotlight').width(560); //560 = (190 * 3) - 10
	//if there are more than 3 images, we need to show the "next" button
	if($('#spotlightContainer .showMultiSlider-entries li').length > 3) {
		//show the "next" button
		$('#spotlightContainer .showMultiSlider-next').css('visibility', 'visible');
	}
	//reposition each li in the list (needed for the slide show to work properly)
	$('#spotlightContainer .showMultiSlider-entries li').each(function(intIndex) {
		$(this).css({position:'absolute',top:'0px',left:(190 * intIndex) + 'px'});
	});
	
	//when moving to the next page, the slide show has to remember its current scroll position
	//by default, tell the click event to update the start position when the user clicks on "next"
	$('.spotlight.showMultiSlider-entries').data('updateStartPos', true);
	//$('#root').append('<input type="hidden" id="spotlightStartPos" name="spotlightStartPos" value="2" />'); //test line
	//find the spotlightStartPos hidden field (keeps track of where to scroll to)
	var spotlightStartPos = $('#spotlightStartPos:first');
	//jQuery returns it in an array, so check to make sure it found it
	if(spotlightStartPos.length > 0) {
		//get the start position (number of times to click "next")  - since, the value coming from LANSA has leading zeroes, make sure to use radix 10 (decimal number) when calling parseInt
		var startPos = parseInt(spotlightStartPos.val(), 10);
		//alert('startPos='+startPos);
		//if start position > 0, we need to click the "next" button
		if(startPos > 0) {
			//add "times" to the data (used by jQuery) to indicate how far to scroll
			$('.spotlight.showMultiSlider-entries').data('times', startPos);
			//tell the click event not to update the start position since the user didn't actually click on "next"
			$('.spotlight.showMultiSlider-entries').data('updateStartPos', false);
			//simulate clicking the "next" button (this will then read the "times" in the data to see how many times to scroll)
			//alert('click goes here');
			$('#spotlightContainer .showMultiSlider-next').click();
			//tell future click events to update the start position when the user clicks on "next"
			$('.spotlight.showMultiSlider-entries').data('updateStartPos', true);
			//for some reason, IE resets the spotlightStartPos hidden field to 000 when you click the back button
			//this reset happens sometime after the $().ready() function and body.onload is done, though not sure where it's being changed at - ugh!
			//so, we'll forcefully reset it after a short wait
			setTimeout("$('#spotlightStartPos:first').val("+startPos+")", 100);
		}
		//alert("after moving it: $('#spotlightStartPos:first').val()="+$('#spotlightStartPos:first').val());
		//setTimeout('alert("setTimeout: $(\'#spotlightStartPos:first\').val()="+$(\'#spotlightStartPos:first\').val())', 1);
	}
	//alert("$('.spotlight.showMultiSlider-entries').data('updateStartPos')="+$('.spotlight.showMultiSlider-entries').data('updateStartPos'));
	
	/*$('#spotlight li a img').each(function(){
		$(this).click(function(){
			alert("img.click: $('#spotlightStartPos').val="+$('#spotlightStartPos').val());
		});
	});*/
}

//preload the images that are not currently visible in the slide show
function cscPreloadImages() {
	//find the first image that has a src that contains "clearpixel.gif"
	var img = $('#spotlightContainer .showMultiSlider-entries li img[src$="clearpixel.gif"]:first');
	if(img) {
		//define the onload function for this image
		img.load(function(){
			//after the new image is loaded, we re-run cscPreloadImages, to preload the next image
			cscPreloadImages();
		});
		//copy the url attribute to the src attribute, making the browser load the correct image, when this image is done loading, the onload event (defined above) will trigger and preload the next image
		img.attr('src', img.attr('url'));
	}
}

function cscPreloadImagesOLD() {
	var imageObj = new Image();
	//find all the images in the slideshow where the src ends in "clearpixel.gif"
	$('#spotlightContainer .showMultiSlider-entries li img[src$="clearpixel.gif"]').each(function() {
		//copy the 'url' attribute over to the src attribute to get the browser to start to download it
		$(this).attr('src', $(this).attr('url'));
		imageObj.src = $(this).attr('url');
	});
}

//when the DOM is ready, initialize the slide show
$().ready(cscInit);
//addLoadEvent(cscInit);
//wait til all the images are loaded before we preload the remaining slide show images)
addLoadEvent(cscPreloadImages);
/*addLoadEvent(function(){
	cscPreloadImages();
	alert("addLoadEvent: $('#spotlightStartPos').val="+$('#spotlightStartPos').val());
});*/