function DisplayPhotos () { }

DisplayPhotos.HTMLFilePath = '/include/photos/';
DisplayPhotos.makeVisibleBool;

/************************************************************************************
	Requires function createRequestObject in creaetRequestObject.js
************************************************************************************/

// This function makes changes according to user input. 
// It checks when the server is ready to make the changes: readyState=4
// Also checks that the request was handles correctly: status=200
function handleResponse () {

		// year clicked? then this stores event boxes, else stores year boxes
		var checkBoxes;	
		var clickedYear;	// boolean
		var eventElement;
		var eventHTML;
		var elementClicked;
		var elementID;		// Used to store ID (year or event)

		if(xmlHttpRequestObject.readyState==4) {
			if(xmlHttpRequestObject.status==200) {

				// Find out if a year's or event's checkbox was clicked & store result.
				// Storing the inner HTML lets us use the value to form IDs for 
				// the elements we're inverested in.
				elementClicked = document.getElementById ("store year").innerHTML;

				// Remember if a year (true) or an event (false) was clicked
				if (elementClicked) {
					clickedYear = true;
					checkBoxes = document.getElementsByName("sel_events[]");
				}
				else {
					elementClicked = document.getElementById ("store event").innerHTML;
					if (elementClicked) {
//						alert ("in handleResponse, Event stored: " + elementClicked);
						checkBoxes = document.getElementsByName("years[]");
					}
				}
//				alert ("in handleResponse, elementClicked: " + elementClicked);

				if (elementClicked) {

					// Cycle thru every event check box in form to generate IDs 
					// for the elements we have to show/hide. For each pass through 
					// the 'for' loop:      (replace text #### with 'event' or 'year')
					// 2.	Only hide/show ####s that are checked. 
					//		The visibility of non-checked (hidden) ####s is not effected.
					// 3.	Verify that there is an element with the generated element ID
					// 1. 	Check if we are displaying photos (making photos visible),
					//		or hiding photos
					for (var eIndex = 0 ; eIndex < checkBoxes.length ; eIndex++) {

						if (clickedYear) {
							elementID = checkBoxes[eIndex].value + " " + elementClicked;
						}
						else {
							elementID = elementClicked + " " + checkBoxes[eIndex].value;
						}
//						alert ("in handleResponse, elementID: " + elementID);

						if (checkBoxes[eIndex].checked == true) { // 2.
							eventElement = document.getElementById (elementID);
							if (eventElement) { // 3.
								if (DisplayPhotos.makeVisibleBool) { // 1. Show
									if (clickedYear) {
										displayEventPhotos (checkBoxes[eIndex].value, elementClicked);
									}
									else {
										displayEventPhotos (elementClicked, checkBoxes[eIndex].value);
									}
								}

								// Else, makeVisibleBool = false, so hide visible events 
								else {										// 1. Hide
									document.getElementById(elementID).innerHTML = "";
								}

							} 
						}

					} // End for loop
				} // End if elementClicked
			}
			else {
				var errorMessage = "Bad status in handleResponse " + xmlHttpRequestObject.status + ".";
				if(xmlHttpRequestObject.status==404) {
					errorMessage += " The URL does not exist.";
				}
				alert (errorMessage);
				alert ("response text: " + xmlHttpRequestObject.statusText);
			}
		}
}

/*********************************************************************************
	sendRequest is called when user clicks a checkbox
*********************************************************************************/
function sendRequest (url) {
	// open & send methods send a request to the server
	// Need to see what this does....
//	alert ("in sendRequest function " + url);
	xmlHttpRequestObject.open("GET", url, true);
	xmlHttpRequestObject.onreadystatechange = handleResponse;
	xmlHttpRequestObject.send(null);
}

/*********************************************************************************
	Called by displayPhotos & handleResponse to display photos.

	8-11-08 See if this will work if we pass in the element & use it to change innerHTML
*********************************************************************************/
function displayEventPhotos (eventStr, yearStr) {
	var photosFilename = DisplayPhotos.HTMLFilePath + eventStr + yearStr + '.php';

	// Use the request object to read a file with the HTML
	xmlHttpRequestObject.open("GET", photosFilename, false);
//	alert ('In displayEventPhotos, photosFilename: ' + photosFilename);
	xmlHttpRequestObject.setRequestHeader("User-Agent", navigator.userAgent);
	xmlHttpRequestObject.send(null);
	if (xmlHttpRequestObject.status==200) {
//		alert(xmlHttpRequestObject.responseText);
		document.getElementById(eventStr + ' ' + yearStr).innerHTML = xmlHttpRequestObject.responseText;
	}
	else {
		alert ("Bad status in displayEventPhotos " + xmlHttpRequestObject.status + ".");
//		alert("Error executing XMLHttpRequest call!");
	}
}




/***********************************************************************
	These 2 functions are not part of AJAX. 
	They are used to store values for AJAX in invisible HTML elements.
	INPUT:
		year (or event) -	string with year (or event name)
		checked -			boolean. Is the check box now checked?
***********************************************************************/
function storeYear (year, checked) {
//	alert ("in storeYear, box checked?: " + (checked ? "YES" : "NO") + " " + checked);
	if (checked) {
//		alert ("checked");
		DisplayPhotos.startText = DisplayPhotos.startHide;
		DisplayPhotos.endText = DisplayPhotos.endHide;
		DisplayPhotos.makeVisibleBool = true;
	}
	else {
//		alert ("not checked");
		DisplayPhotos.startText = DisplayPhotos.startShow;
		DisplayPhotos.endText = DisplayPhotos.endShow;
		DisplayPhotos.makeVisibleBool = false;
	}
	document.getElementById("store year").innerHTML = year;
	document.getElementById("store event").innerHTML = "";
//	alert ("end of storeYear function, box checked?: " + (checked ? "YES" : "NO") + " " + checked);
}

function storeEvent (event, checked) {
	if (checked) {
		DisplayPhotos.startText = DisplayPhotos.startShow;
		DisplayPhotos.endText = DisplayPhotos.endShow;
		DisplayPhotos.makeVisibleBool = true;
	}
	else {
		DisplayPhotos.startText = DisplayPhotos.startHide;
		DisplayPhotos.endText = DisplayPhotos.endHide;
		DisplayPhotos.makeVisibleBool = false;
	}
	document.getElementById("store year").innerHTML = "";
	document.getElementById("store event").innerHTML = event;
//	alert ("End of function storeEvent, box checked?: " + (checked ? "YES" : "NO") + " " + checked);
}

/*********************************************************************************
	Handle initial hiding or displaying of photos when the page is 1st loaded.
	The function needs to check which years & events are selected for display
*********************************************************************************/
function displayPhotos () {
	var eventID;
	var eventElement;
	var eventHTML;
	var checkBoxes = document.getElementsByName("sel_events[]");
	var yearsSelected = document.getElementsByName("years[]");

	for (var eventIndex = 0 ; eventIndex < checkBoxes.length ; eventIndex++) {
		if (checkBoxes[eventIndex].checked) {
			for (var yearIndex = 0 ; yearIndex < yearsSelected.length ; yearIndex++) {
				if (yearsSelected[yearIndex].checked) {
					eventID = "" + checkBoxes[eventIndex].value + " " + yearsSelected[yearIndex].value;
//					alert ("Year checked " + yearsSelected[yearIndex].value + "\n" + eventID);
					eventElement = document.getElementById(eventID);
					if (eventElement) {
						
						displayEventPhotos (checkBoxes[eventIndex].value, yearsSelected[yearIndex].value);
//						alert (eventHTML);
					}
					else {  // I should make it so this is not commented out when using my server
//						alert ("No such element ->" + eventID + "<-");
					}
				}
			}
		}
	}
}	// End of displayPhotos
/*********************************** end of functions ****************************/

// Make a global XMLHttpRequest Object
var xmlHttpRequestObject = createRequestObject();

/*if (xmlHttpRequestObject) {
	alert ("Request object created");
}
else {
	alert ("Problem creating request object");
}*/

window.onload=displayPhotos;        /* <- does this line work????? working */