/* Copied from Riverfront imageFader.js file */

$(function(){
	var x = 1;
	var arrLen = arrImages.length;
	var divID = 1;
	var myInterval = "";
	
	$('.nextImg').click(function(){
		x++;
		x = Math.abs(x % arrLen);
		divID = Math.abs(divID-1);
		myDiv = '#img'+divID;
		loadImage(arrImages[x][0], divID, arrImages[x][1]);
		startSlideshow();
		return false;
	});
	
	$('.stopShow').click(function(){
		clearInterval(myInterval);
		return false;
	});
	
	startSlideshow();

	function startSlideshow(){		
		clearInterval(myInterval);		
		if(arrLen >1) {
			//If the random image loaded by the server is same as the image to be loaded by the js then display the next image			 
			var startImg = Math.abs(2% arrLen);			
			if(arrImages[startImg][0] == $('div#img1 img').attr('src')) {
				x++;
			}
			myInterval = setInterval(function(){
			x++;
			x = Math.abs(x % arrLen);		
			divID = Math.abs(divID-1);
			myDiv = '#img'+divID;
			if (arrImages[x][2] == arrImages[x][3]) {
				var captionDates = arrImages[x][3];
			}
			else {
				var captionDates = arrImages[x][2] + " - " + arrImages[x][3];
			}
			loadImage(arrImages[x][0], divID, arrImages[x][1], captionDates, arrImages[x][4]);
			},8000);			
		}		
	}
	
});

function loadImage(imageFile, imageDiv, imageCaption, captionDates, infoLink){
	var myImg = new Image();
	var divToFadeOut = '#img' + Math.abs(imageDiv-1);
	var divToFadeIn = '#img' + imageDiv;
	$(myImg).load(function(){
		$(divToFadeIn).html(this);
		$(divToFadeIn).fadeIn('slow', function(){
			newZ2 = Math.abs($(this).css("z-index") -1);
			$(this).css('z-index',newZ2);
			$("#bannerCaptionHeading").html(imageCaption);
			$("#bannerCaptionDates").html(captionDates);
			$("#bannerCaptionLink").html("<a href='" + infoLink + "'>More Info</a>")
		});
		$(divToFadeOut).fadeOut('slow', function(){
			newZ = Math.abs($(this).css("z-index") -1);
			$(this).css('z-index',newZ);
		});
	}).attr('src',imageFile);
}