//Global Variable to hold current page
var currentPage;

function changeDiv(divNumber) {
	currentPage = divNumber;
	//get the divs in the contentHolder Div
	var contentDivs = document.getElementById("contentHolder").getElementsByTagName("div");
	
	//Count the divs that start with "content" ie content1, content2, etc. in the contentHolder div container.
	var counter = 0;
	for(i=0; i<contentDivs.length; i++) {
		if(contentDivs[i].id.substring(0, 7) == "content") {
			counter++;
		}
	}

	// Loop through all of the divs in contentHolder. If a div id contains the passed divNumber, show it.  Otherwise, hide it.
	for(h=0; h<contentDivs.length; h++) {
	
		if(contentDivs[h].id == "content"+divNumber) {
				contentDivs[h].style.display = "block";
		}
		else {
			if(contentDivs[h].id.substring(0, 7) == "content" ) {
				contentDivs[h].style.display = "none";
			}
		}
	}
	//Update the navigation display
	//First, if there's only one div, there's no need for a navigation.  Check to see if counter is more than one.
	if(counter != 1) {
		 navContent = "";
		 
		 if(divNumber != 1) {
		 		var newH = currentPage-1;
				navContent += "<span> <a href='javascript:changeDiv("+newH+")'> <<</a> </span>";
		 }
		 else {
		 	navContent += "<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>";
		 }
		 
		 for(h=1; h<counter+1; h++) {
		 	
			
			
			if(h==divNumber) {
				navContent += "<span> " + h + "</span>";
			}
			else {
				navContent += "<span> <a href='javascript:changeDiv("+h+")'>" + h + "</a> </span>";
			}
		 
		 }
		 
		 if(divNumber != counter) {
		 	var newH = currentPage+1;
				navContent += "<span> <a href='javascript:changeDiv("+newH+")'> >> </a> </span>";
		 }
		 else {
		 	navContent += "<span>&nbsp;&nbsp;</span>";
		 }
		 document.getElementById("navigationDiv").innerHTML = navContent;
	}
	window.location="#top";
}