//Lists----------------------------------------------------------------------------

//this is a list of all the total images
//to add more type the name and location of the image.
//use the large image in this list. the smaller version will be called in the script
//do not include the .jpg extension here.
//make sure image name and file path are surrounded by quotation marks and each image is separated by a comma 
var allPicturesList = ["event_special/0009", "event_special/0028", "event_special/0043", "event_special/0044", "event_special/0045"]

//This is a list of all the layers of content.
//the layers are turned on an off as needed to match the appropriate image
//you will need ad here as well to add images
var allPicturesDescriptionList = ["image0009", "image0028", "image0043", "image0044", "image0045"]



//Variables------------------------***DO NOT EDIT ANY OF THESE***-----------------------------------------------

//this is a variable to store the current image number from the the list
//***********************
//***DO NOT EDIT THIS!***
//***********************
var currentImage = 0

//this is a varible used to create a new window for the large images
//***********************
//***DO NOT EDIT THIS!***
//***********************
var theBigPicture


//Functions------------------------***DO NOT EDIT ANY OF THESE***-----------------------------------------------


//this function cycles ahead one picture on click
//***********************
//***DO NOT EDIT THIS!***
//***********************
function nextImage() {
	currentImage = currentImage + 1
	if (currentImage > allPicturesList.length - 1) {
		currentImage = 0
	}
	document.theImage.src = allPicturesList[currentImage] + "small.jpg"
	document.getElementById(allPicturesDescriptionList[currentImage]).style.visibility = "visible"
	updatePage()
}

//this function cycles backward one picture on click
//***********************
//***DO NOT EDIT THIS!***
//***********************
function prevImage() {
	currentImage = currentImage - 1
	if (currentImage < 0) {
		currentImage = allPicturesList.length - 1
	}
	document.theImage.src = allPicturesList[currentImage] + "small.jpg"
	document.getElementById(allPicturesDescriptionList[currentImage]).style.visibility = "visible"
	updatePage()
}

//this fuction creates a new window and put a large veiw of the current image in to it.
//***********************
//***DO NOT EDIT THIS!***
//***********************
function largeView() {
	document.getElementById("theImage").blur()
	theBigPicture = window.open(allPicturesList[currentImage] + ".jpg", allPicturesList[currentImage], "scrollbars");
	theBigPicture.focus( );
}

//function allows the user to choose which picture they want to view next from a list of thumbs at the bottom of the page
//to add more pictures here and the following line to the history.html page:
// <a href="#" title="picture [number]" onclick="changeImage(*)"<img src.../> </a>
//where the * is the number of the image in the list
//***********************
//***DO NOT EDIT THIS!***
//***********************
function changeImage(a) {
	currentImage = a - 1
	document.theImage.src = allPicturesList[currentImage] + "small.jpg"
	updatePage()
}

//this function puts the correct text layer on the page.
//and highlights the current image in the nav.
//***********************
//***DO NOT EDIT THIS!***
//***********************
function updatePage() {
	document.getElementById(allPicturesDescriptionList[currentImage]).blur()
	document.getElementById(allPicturesDescriptionList[currentImage]).style.visibility = "visible"
	document.getElementById(allPicturesDescriptionList[currentImage] + "thumb").style.borderColor = "#0C7706"
	for (i = currentImage + 1; i <= allPicturesDescriptionList.length - 1; i = i + 1) {
		document.getElementById(allPicturesDescriptionList[i]).style.visibility = "hidden";
		document.getElementById(allPicturesDescriptionList[i] + "thumb").style.borderColor = "#ffffff";
	}
		for (i = currentImage - 1; i <= allPicturesDescriptionList.length - 1; i = i - 1) {
		document.getElementById(allPicturesDescriptionList[i]).style.visibility = "hidden";
		document.getElementById(allPicturesDescriptionList[i] + "thumb").style.borderColor = "#ffffff";
	}
}