﻿//Version 2.0 Started Feb 11 2011

//global vars
var loadNumberOfDays = 14; //How many days of events to load when the page is loaded and how may more to show when the "Show More Events" link is clicked.
var dayCount = 0; //How many days have been loaded so far
var loadNumberOfDaysEachCall = 2; //When calling the web service ask for this many days
var daysLeftToLoad = loadNumberOfDays; //Home many days have left to load of the loadNumberOfDays
var maxDaystoLoad = 70; //Don't allow users to load any more than than this. The interface slows down and evanced runs out of things to show.
var animationOpenSteps = 0;
var animationCloseSteps = 7;
var totalEventCount = 0;
var totalEventsShowing = 0;
var desAnimationCurrentH = 0;
var pageId;
var today = new Date();
var eventShowingStatus = new Array(); //true = the event is showing.
var monthNames = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December");
//var eventBlockVertPos = 50;
var descH = "0px" //Height of the description we are opening or closing
var locListArray = new Array();
var eventImage = new Array(); //URLs for event images.
var eventImageLastAdded = 1; //Will have the event number with that last had an image added to its header from the eventImage array
var eventDescOpen = new Array();
var eventObjOpen = new Array(); //Is the event visible because of the filter change
var eventObjClose = new Array(); //Is the event visible because of the filter change
var eventTypeArray = new Array(); //Every events type
//var eventTypeDropdownArray = new Array(); //The event types for the type dropdown filter
var eventLocArray = new Array(); //Every events location/library
var eventId = new Array(); //Links the elementId (eventBlock.id = totalEventCount + "event") to the evanced event id.
var eventsLoading = true; //Use this to disable functions while events are loading
var searchResult = new Array(); //the event number (not evanceId) that returned positive results form web service
var activeLocsInDrop = new Array(); //Set these Locations to active in the location dropdown
var activeTypeInDrop = new Array(); //Set these Types to active in the type dropdown.
var eventDescToOpenClose = 0; //When an event title is clicked we open the description which we get from the webService. This is the dom id (ie 17event) to attach the description to.
var eventImageHDesc = new Array(); //The image height if the user opens the description
var eventImageWDesc = new Array(); //The image width if the user opens the description
var altColor = false; //Keep track of what color the background of an event should be.
//Look to see if a function query string has been passed in
//Get the full URL
var urlString = parent.document.URL;
var urlString = urlString.toLowerCase();
var urlPageId = getQuerystring('pageid', urlString);
var urlEventId = getQuerystring('eventid', urlString);
var urlEventType = getQuerystring('eventtype', urlString);
var urlEventSearch = getQuerystring('eventsearch', urlString);
var urlEventLocation = getQuerystring('eventlocation', urlString);
var urlEventNumberOfDays = getQuerystring('eventnumdays', urlString);
var urlFilterInPlay = false;

if (urlEventNumberOfDays != "") {
	if (urlEventNumberOfDays > maxDaystoLoad) urlEventNumberOfDays = maxDaystoLoad;
	daysLeftToLoad = urlEventNumberOfDays;
};

//Stub out the eventBody
var eventBody = document.getElementById("eventBody");
//The status section will be in the green bar and show the date range and event count.
eventPageStatus = document.createElement('div');
eventBody.appendChild(eventPageStatus);
eventPageStatus.className = "eventPageStatus";
if (urlEventId != "") eventPageStatus.style.visibility = "hidden";
//The event filters have a the dropdown event type search box and library filter controls.
var eventFilters = document.createElement('div');
eventBody.appendChild(eventFilters);
eventFilters.className = "eventFilters";
if (urlEventId != "") eventFilters.style.display = "none";
//The Main event List
var eventList = document.createElement('div');
eventList.id = "eventList";
eventBody.appendChild(eventList);
//Footer More Button
var eventFooter = document.createElement('div');
eventBody.appendChild(eventFooter);
eventFooter.className = "eventsFooter";
if (urlEventId != "") eventFooter.style.display = "none";
//Status
var eventsNowShowing = document.createElement('span');
eventPageStatus.appendChild(eventsNowShowing);
eventsNowShowing.className = "eventsNowShowing";
eventsNowShowing.innerHTML = "Now showing: " + monthNames[today.getMonth()] + " " + today.getDate() + " <b>-</b> ";
//eventsNowShowing.innerHTML = "Now showing: September 25 <b>-</b> ";
eventPageStatusDate = document.createElement('span');
eventsNowShowing.appendChild(eventPageStatusDate);
eventPageStatusDate.innerHTML = monthNames[today.getMonth()] + " " + today.getDate();
//eventPageStatusDate.innerHTML = " September 25";
//Visible Events for filters
eventPageStatusShowing = document.createElement('span');
eventPageStatus.appendChild(eventPageStatusShowing);
eventPageStatusShowing.className = "eventPageStatusVisible";
//Show More Events Link
eventPageStatusShowMore = document.createElement('span');
eventBody.appendChild(eventPageStatusShowMore);
eventPageStatusShowMore.className = "eventPageStatusShowMore";
eventPageStatusShowMore.innerHTML = "Show More Events";
eventPageStatusShowMore.onmouseover = function () { showMoreOver(this); };
eventPageStatusShowMore.onmouseout = function () { showMoreOut(this); };
eventPageStatusShowMore.onmousedown = function () { showMoreDown(this); };
eventPageStatusShowMore.style.visibility = "hidden";
//Loading message
eventPageStatusLoading = document.createElement('span');
eventBody.appendChild(eventPageStatusLoading);
eventPageStatusLoading.className = "eventPageStatusLoading";
eventPageStatusLoading.innerHTML = "Loading Events";
//Footer
eventPageStatusFoot = document.createElement('div');
eventFooter.appendChild(eventPageStatusFoot);
eventPageStatusFoot.className = "eventPageStatusFoot";
//Footer Status
eventPageStatusFoot.innerHTML = "Now showing: " + monthNames[today.getMonth()] + " " + today.getDate() + " <b>-</b> ";
eventPageStatusDateFoot = document.createElement('span');
eventPageStatusFoot.appendChild(eventPageStatusDateFoot);
eventPageStatusDateFoot.innerHTML = monthNames[today.getMonth()] + " " + today.getDate()
//Footer Show More Events Link
eventPageStatusShowMoreFoot = document.createElement('span'); //Ha Ha He said "show more foot". I'm a boob man myself.
eventPageStatusFoot.appendChild(eventPageStatusShowMoreFoot);
eventPageStatusShowMoreFoot.className = "eventPageStatusShowMoreFoot";
eventPageStatusShowMoreFoot.innerHTML = "Show More Events";
eventPageStatusShowMoreFoot.onmouseover = function () { showMoreOverFoot(this); };
eventPageStatusShowMoreFoot.onmouseout = function () { showMoreOutFoot(this); };
eventPageStatusShowMoreFoot.onmousedown = function () { showMoreDown(this); };
eventPageStatusShowMoreFoot.style.visibility = "hidden";
//Footer Loading message
eventPageStatusLoadingFoot = document.createElement('span');
eventPageStatusFoot.appendChild(eventPageStatusLoadingFoot);
eventPageStatusLoadingFoot.className = "eventPageStatusLoading";
eventPageStatusLoadingFoot.innerHTML = "Loading Events";
eventPageStatusLoadingFoot.style.visibility = "visible";
//Filters
//Type
var eventFilterLabel = document.createElement('span');
eventFilterLabel.innerHTML = "<b>Type: </b>";
eventFilters.appendChild(eventFilterLabel);
eventFilterSelectType = document.createElement('select');
eventFilters.appendChild(eventFilterSelectType);
eventFilterSelectType.id = "ddEventFilterType";
eventFilterSelectType.style.width = "195px";
eventFilterSelectType.disabled = true;
eventFilterSelectType.onchange = function () { filterList(this); };
//Search
var eventSearchLabel = document.createElement('span');
eventFilters.appendChild(eventSearchLabel);
eventSearchLabel.innerHTML = "&nbsp;&nbsp;<b>Search: </b>";
//Search Text Box
//This is a <textarea> not a <input type=text> so the enter button will not submit the asp.net form
//The enter key is set up to search the event items via a JavaScript below
eventSearchInput = document.createElement("textarea");
eventFilters.appendChild(eventSearchInput);
eventSearchInput.id = "tbSearchText";
eventSearchInput.rows = "1";
eventSearchInput.cols = "22";
eventSearchInput.className = "eventSearchInput";
eventSearchInput.disabled = true;
eventSearchInput.onkeyup = function () { submitSearch(this); };
//Search Go Button
btnSearch = document.createElement('span');
eventFilters.appendChild(btnSearch);
btnSearch.className = "btnSearch";
btnSearch.innerHTML = "Go";
btnSearch.onmouseover = function () { searchBtnMouseOver(this); };
btnSearch.onmouseout = function () { searchBtnMouseOut(this); };
btnSearch.onmousedown = function () { goSearch(this); };
//Location List
var eventFilterLocationLabel = document.createElement('span');
eventFilters.appendChild(eventFilterLocationLabel);
eventFilterLocationLabel.innerHTML = "&nbsp;&nbsp;&nbsp;&nbsp;<b>Location: </b>";
eventFilterSelectLocation = document.createElement('select');
eventFilters.appendChild(eventFilterSelectLocation);
eventFilterSelectLocation.id = "ddEventFilterLocation";
eventFilterSelectLocation.className = "eventFilterSelectLocation";
eventFilterSelectLocation.disabled = true;
eventFilterSelectLocation.onchange = function () { filterList(this); };
//Link to found events
copySearchLink = document.createElement('a');
eventFilters.appendChild(copySearchLink);
copySearchLink.href = "?pageId=" + urlPageId + "&eventtype=" + urlEventType + "&eventsearch=" + urlEventSearch + "&eventlocation=" + urlEventLocation + "&eventnumdays=" + urlEventNumberOfDays;
copySearchLink.innerHTML = "&#8734;";
copySearchLink.className = "copySearchLink";
copySearchLink.title = "Link to found events";
//Start the page layout. To do that we need a list of all the locations.
wsLocation.locListSimple("0", onLocListSuccess, onLocListFail);


function addEventsSuccess(result) {

	//The end element is an error from the web service. Most likely because there are no elements returned from evanced
	if (result.getElementsByTagName("end")) {
		daysLeftToLoad = daysLeftToLoad - loadNumberOfDaysEachCall;
		dayCount = dayCount + loadNumberOfDaysEachCall;

		var totalEventCountLoop = result.getElementsByTagName("e").length;

		//Get the type selected from the type dropdown.
		var typeSelected = "-- All Types --";
		if (eventFilterSelectType.length > 0) {
			typeSelected = eventFilterSelectType.options[eventFilterSelectType.selectedIndex].value;
		}
		//Get the location selected from the location dropdown
		var locSelected = "-1";
		locSelected = eventFilterSelectLocation.options[eventFilterSelectLocation.selectedIndex].value;

		//Event Items
		for (i = 0; i < totalEventCountLoop; i++) {
			totalEventCount++;
			eventId[totalEventCount] = result.getElementsByTagName("i")[i].childNodes[0].nodeValue;
			eventDescOpen[totalEventCount] = false; //We will use this to keep track of the description being open or closed.
			//Get the type and library data
			var type = result.getElementsByTagName("g")[i].childNodes[0].nodeValue;
			var locPageId = result.getElementsByTagName("w")[i].childNodes[0].nodeValue;
			eventLocArray[totalEventCount] = result.getElementsByTagName("x")[i].childNodes[0].nodeValue;

			//Event Block
			var eventBlock = document.createElement('div');
			eventList.appendChild(eventBlock);
			eventBlock.id = totalEventCount + "event";
			//Set the css class for eventBlock below after we determine if the event will be showing		

			//Open and close the description
			if (urlEventId == "") {
				eventBlock.onclick = function () { descriptionOpenClose(this) };
				eventBlock.onmouseover = function () { eventBlockMouseOver(this) };
				eventBlock.onmouseout = function () { eventBlockMouseOut(this) };
			}

			//Right side header info
			var rightHeader = document.createElement('div');
			eventBlock.appendChild(rightHeader);
			rightHeader.className = "rightHeader";
			var evancedLibraryId = "-1";

			if (locPageId != "0") {
				//Library link
				var rightHeaderLibrary = document.createElement('a');
				rightHeader.appendChild(rightHeaderLibrary);
				rightHeaderLibrary.href = "?pageId=" + locPageId;
				rightHeaderLibrary.innerHTML = result.getElementsByTagName("l")[i].childNodes[0].nodeValue;
				//Dash
				var rightHeaderDashA = document.createElement('b');
				rightHeader.appendChild(rightHeaderDashA);
				rightHeaderDashA.innerHTML = "&nbsp;-&nbsp;";
				//Library Map Link
				var rightHeaderMap = document.createElement('a');
				rightHeaderMap.href = "?pageId=" + result.getElementsByTagName("m")[i].childNodes[0].nodeValue;
				rightHeaderMap.innerHTML = "Map";
				rightHeader.appendChild(rightHeaderMap);
			}

			//Date And Time
			var rightHeaderDateTime = document.createElement('span');
			rightHeader.appendChild(rightHeaderDateTime);
			var eventDateTime = result.getElementsByTagName("d")[i].childNodes[0].nodeValue;
			//Update "Now Showing" at the top and footer
			var eventDateOnly = eventDateTime.substring(0, eventDateTime.indexOf(",")) + "&nbsp;&nbsp;";
			//Add the date and time to the event
			eventPageStatusDate.innerHTML = eventDateOnly;
			eventPageStatusDateFoot.innerHTML = eventDateOnly;

			rightHeaderDateTime.innerHTML = "<br />" + eventDateTime + "<br />";
			//Sign-Up
			if (result.getElementsByTagName("r")[i].childNodes[0].nodeValue == "1") {
				var rightHeaderSignUp = document.createElement('span');
				rightHeaderSignUp.className = "linkOut";
				rightHeaderSignUp.id = result.getElementsByTagName("i")[i].childNodes[0].nodeValue;
				rightHeaderSignUp.innerHTML = "Registration is required to attend";
				rightHeaderSignUp.onclick = function () { openSignUpWindow(this) };
				rightHeaderSignUp.onmouseover = function () { overSignUp(this) };
				rightHeaderSignUp.onmouseout = function () { outSignUp(this) };
				rightHeader.appendChild(rightHeaderSignUp);
			}
			//Left side header info
			var leftHeader = document.createElement('div');
			eventBlock.appendChild(leftHeader);

			//Image Icon
			eventImage[totalEventCount] = "";
			if (result.getElementsByTagName("p")[i].hasChildNodes()) {
				//Load up the array with the image URLs
				eventImage[totalEventCount] = result.getElementsByTagName("p")[i].childNodes[0].nodeValue;
				//Add and empty image tag we will add the src after all the events are on the page. That will speed up the initial load.
				if (urlEventId == "") {
					var descImage = document.createElement('img');
					descImage.id = "headImg" + totalEventCount;
					leftHeader.appendChild(descImage);
					descImage.className = "headingImage";
					descImage.src = "http://www.saclibrary.org/image/UI/eventsImagePlaceHolder.gif";
				}
			};
			//Title
			var leftHeaderTitle = document.createElement('div');
			leftHeader.appendChild(leftHeaderTitle);
			leftHeaderTitle.className = "eventTitle";
			var title = result.getElementsByTagName("t")[i].childNodes[0].nodeValue;
			leftHeaderTitle.innerHTML = title;
			//Event Type
			var leftHeaderType = document.createElement('span');
			leftHeader.appendChild(leftHeaderType);
			leftHeaderType.className = "leftHeaderType";
			leftHeaderType.innerHTML = type;
			eventTypeArray[totalEventCount] = type;
			//eventTypeDropdownArray[eventTypeDropdownArray.length] = type;

			//If there is something selected in the type, location or search filter or some tithing comes in on the query string when 
			//adding a new event should we show this event?
			var showThisOne = true;
			//Type
			if (typeSelected != "--alltypes--" & typeSelected != type.replace(/\s/g, '').toLocaleLowerCase()) showThisOne = false;
			//Location
			if (locSelected != "-1" & locSelected != eventLocArray[totalEventCount]) showThisOne = false;
			//Search
			if (searchResult.length > 0 & showThisOne) {
				for (var sr = 0; sr < searchResult.length; sr++) {
					if (searchResult[sr] != eventId[totalEventCount]) {
						showThisOne = false;
					} else {
						showThisOne = true;
						break;
					}
				}
			};

			if (!showThisOne) {
				eventBlock.style.display = "none";
				eventBlock.style.overflow = "visible";
				eventBlock.style.height = "auto";
				eventBlock.className = "eventBlock1"; //doesn't matter what class it's not showing
				eventShowingStatus[totalEventCount] = false;
			} else {
				totalEventsShowing++;
				eventShowingStatus[totalEventCount] = true;
				//alternate the color on the event block now that we know if this is showing or not
				if (altColor) {
					eventBlock.className = "eventBlock1";
					altColor = false;
				} else {
					eventBlock.className = "eventBlock0";
					altColor = true;
				};
			}

			eventPageStatusShowing.innerHTML = "Visible " + totalEventsShowing + " of " + totalEventCount + " events"

			//Description
			//Only if we are calling a single event via the query string.
			//In every other case we add the description as requested by the user.
			if (urlEventId != "") {
				var descDiv = document.createElement('div');
				eventBlock.appendChild(descDiv);
				descDiv.style.clear = "both";
				descDiv.style.margin = "30px";
				//Image
				if (eventImage[totalEventCount]) {
					var descImage = document.createElement('img');
					descDiv.appendChild(descImage);
					descImage.className = "floatRight";
					descImage.style.height = "400px";
					descImage.style.width = "400px";
					descImage.style.visibility = "hidden";
					descImage.onload = function () { setLargeDimensions(this) };
					descImage.src = result.getElementsByTagName("p")[i].childNodes[0].nodeValue;
				};
				//Description
				var descText = document.createElement('span');
				descDiv.appendChild(descText);
				var description = result.getElementsByTagName("m")[i].childNodes[0].nodeValue;
				descText.innerHTML = description + "<br /><br />";
			}
		}; //For Next Loop i

		//Change the loading status display
		eventsLoading = false;
		//Enable filters
		eventFilterSelectType.disabled = false;
		eventSearchInput.disabled = false;
		eventFilterSelectLocation.disabled = false;

		//Highlight locations in the locations dropdown if there are events are showing for the location
		for (l = 1; l < eventId.length; l++) {
			var loc = eventLocArray[l];
			var type = eventTypeArray[l].replace(/\s/g, '').toLocaleLowerCase();
			if (eventShowingStatus[l]) {
				for (m = 1; m < eventFilterSelectLocation.length; m++) {
					var locDropdown = eventFilterSelectLocation.options[m].value;
					if (locDropdown == loc) {
						eventFilterSelectLocation.options[m].className = "optionActive";
						break;
					}
				}
				for (u = 1; u < eventFilterSelectType.length; u++) {
					var typeDrop = eventFilterSelectType.options[u].value;
					if (typeDrop == type) {
						eventFilterSelectType.options[u].className = "optionActive";
						break;
					}
				}
			}
		}

		//Do we need to load anymore events?
		if (daysLeftToLoad > 0 & urlEventId == "") {
			wsEvent.wsEventAll(loadNumberOfDaysEachCall, dayCount, addEventsSuccess, addEventsFail);
		} else {
			if (dayCount < maxDaystoLoad) {
				eventPageStatusShowMore.style.visibility = "visible";
				eventPageStatusLoading.style.visibility = "hidden";
				eventPageStatusShowMoreFoot.style.visibility = "visible";
				eventPageStatusLoadingFoot.style.visibility = "hidden";
			} else {
				eventPageStatusShowMore.style.visibility = "hidden";
				eventPageStatusLoading.style.visibility = "hidden";
				eventPageStatusShowMoreFoot.style.visibility = "hidden";
				eventPageStatusLoadingFoot.style.visibility = "hidden";
			}
			imageAddToHeader();
		}
	}

	if (urlEventType != "" || urlEventSearch != "" || urlEventLocation != "" || urlEventNumberOfDays != "") {
		//These are only used on page load so clear them
		urlEventId = "";
		urlEventType = "";
		urlEventSearch = "";
		urlEventLocation = "";
		urlEventNumberOfDays = "";
		//filterList();
	}
}; //addEventsSuccess

function addEventsFail() {
	eventBody.innerHTML = "Events failed to load.";
}; //addEventsFail

function desOpenAnimation(openSteps) {
	//See if the animation is done
	if (openSteps > 10) {
		if ((Math.round(descH / 10) * openSteps) < descH) {
			document.getElementById(eventDescToOpenClose + "description").style.height = descH + "px";
		}
	} else {
		var thisStep = Math.round(descH / 10) * openSteps;
		document.getElementById(eventDescToOpenClose + "description").style.height = thisStep + "px";
		//Do it again
		openSteps++;
		setTimeout("desOpenAnimation(" + openSteps + ")", 20);
	};
}; //desOpenAnimation

function desCloseAnimation(closeSteps) {
	//See if the animation is done
	if (closeSteps < 1) {
		var killTheKidOfMe = document.getElementById(eventDescToOpenClose + "event");
		var killMe = document.getElementById(eventDescToOpenClose + "description");
		killTheKidOfMe.removeChild(killMe);
	} else {
		var thisStep = Math.round(descH / 10) * closeSteps;
		document.getElementById(eventDescToOpenClose + "description").style.height = thisStep + "px";
		//Do it again
		closeSteps--;
		setTimeout("desCloseAnimation(" + closeSteps + ")", 20);
	};
}; //desCloseAnimation

function descriptionOpenClose(domObj) {
	eventDescToOpenClose = domObj.id.replace("event", "");
	var descriptionOpenCloseEventId = eventId[eventDescToOpenClose];
	//Is the event open or closed
	if (eventDescOpen[eventDescToOpenClose]) {
		//open (close it)
		eventDescOpen[eventDescToOpenClose] = false;
		descH = document.getElementById(eventDescToOpenClose + "description").scrollHeight;
		desCloseAnimation(10);
	} else {
		//closed (open it)
		wsEvent.wsEventDescription(descriptionOpenCloseEventId, onDescriptionOpenSuccess, onDescriptionOpenFail);
	}
}; //descriptionOpenClose

function eventOpenCloseAnimation(loopCount, frameCount, frameDelay) {
	//frameCount is the last frame so close/open the div completely by changing the style display
	if (loopCount == frameCount) {

		//Open
		for (i = 0; i < eventObjOpen.length; i++) {
			var lindsayWagner = document.getElementById(eventObjOpen[i] + "event");
			lindsayWagner.removeAttribute("style");

		};
		//Close
		for (i = 0; i < eventObjClose.length; i++) {
			var lindsayWagner = document.getElementById(eventObjClose[i] + "event");
			lindsayWagner.removeAttribute("style");
			lindsayWagner.className = "eventBlockHide";
		};
		//Alternate colors on events that will be open
		//Got to do it in a separate loop. 
		//The Open section is only the event blocks opening not the ones already open
		//This will get them all
		for (i = 0; i < eventShowingStatus.length; i++) {
			if (eventShowingStatus[i]) {
				var lindsayWagner = document.getElementById(i + "event");
				if (altColor) {
					lindsayWagner.className = "eventBlock1";
					altColor = false;
				} else {
					lindsayWagner.className = "eventBlock0";
					altColor = true;
				}
			}
		}


		//Enable filters
		eventFilterSelectType.disabled = false;
		eventSearchInput.disabled = false;
		eventFilterSelectLocation.disabled = false;
	} else {

		if (loopCount == 0) {
			//Disable filters
			eventFilterSelectType.disabled = true;
			eventSearchInput.disabled = true;
			eventFilterSelectLocation.disabled = true;
		}
		var hSizeOpen = 0;
		var hSizeClose = 0;

		if (frameCount == 10) {
			hSizeOpen = (loopCount * 5) + 1;
			hSizeClose = 51 - (loopCount * 5);
		}
		if (frameCount == 5) {
			hSizeOpen = (loopCount * 10) + 1;
			hSizeClose = 51 - (loopCount * 10);
		}
		if (frameCount == 3) {
			hSizeOpen = (loopCount * 15) + 1;
			hSizeClose = 51 - (loopCount * 15);
		}
		if (frameCount == 1) {
			hSizeOpen = (loopCount * 20) + 1;
			hSizeClose = 51 - (loopCount * 20);
		}
		for (i = 0; i < eventObjOpen.length; i++) {
			var lindsayWagner = document.getElementById(eventObjOpen[i] + "event");
			lindsayWagner.className = "eventBlockAnimate";
			lindsayWagner.style.height = hSizeOpen + "px";
		};
		for (i = 0; i < eventObjClose.length; i++) {
			var lindsayWagner = document.getElementById(eventObjClose[i] + "event");
			lindsayWagner.className = "eventBlockAnimate";
			lindsayWagner.style.height = hSizeClose + "px";
		};
		loopCount++;
		setTimeout("eventOpenCloseAnimation(" + loopCount + "," + frameCount + "," + frameDelay + ")", frameDelay);
	};
}; //eventOpenCloseAnimation

function eventBlockMouseOver(eventBlockToHighligt) {
	backColor = eventBlockToHighligt.style.backgroundColor;
	eventBlockToHighligt.style.backgroundColor = "#bcb2a4";
}; //eventBlockMouseOver

function eventBlockMouseOut(eventBlockToHighligt) {
	eventBlockToHighligt.style.backgroundColor = backColor;
}; //eventBlockMouseOut

function filterList(domObj) {
	//Build an array of events to open and close.
	//Clear the array here.
	eventObjOpen.length = 0;
	eventObjClose.length = 0;
	var arrayOpenPos = -1;
	var arrayClosePos = -1;

	var openCount = 0; //How many event items are open.

	//Get the filter values
	//Type
	var typeHasSelection = false; //the type dropdown has a section
	var typeDropdownValue = eventFilterSelectType[eventFilterSelectType.selectedIndex].value;
	if (typeDropdownValue != "--alltypes--") typeHasSelection = true;

	//Search
	var searchHasContent = false; //the search box has a content
	if (document.getElementById("tbSearchText").value != "") {
		searchHasContent = true;
	} else {
		searchResult.length = 0;
	}

	//Location
	var locHasSelection = false; //the location dropdown has a section
	var locDropdownValue = eventFilterSelectLocation[eventFilterSelectLocation.selectedIndex].value;
	if (locDropdownValue != "-1") locHasSelection = true;

	//Get the value of the search box
	//var searchText = document.getElementById("tbSearchText").value.toLowerCase();
	//Loop thru all events

	//These arrays are used to mark locations and types in the dropdowns that have active content under the current filter selections
	activeLocsInDrop.length = 0;
	activeTypeInDrop.length = 0;

	//Set href for the filter link
	copySearchLink.href = "?pageId=" + urlPageId + "&eventtype=" + typeDropdownValue + "&eventsearch=" + document.getElementById("tbSearchText").value + "&eventlocation=" + locDropdownValue + "&eventnumdays=" + dayCount;

	for (e = 1; e < totalEventCount + 1; e++) {
		//Build a test
		//If this event passes all the tests open it
		//If the event fails even on one of the tests close it

		//Test 1 TYPE
		var typeOpen = true;
		if (eventTypeArray[e].replace(/\s/g, '').toLocaleLowerCase() != typeDropdownValue & typeHasSelection) {
			typeOpen = false;
		} else {
			//If there is nothing in the search box mark matching locations as having active content under the current filter selections
			if (!searchHasContent) activeLocsInDrop[activeLocsInDrop.length] = eventLocArray[e];
		}

		//Test 2 SEARCH
		var searchOpen = true;
		if (searchHasContent) {
			if (searchResult.length > 0) {
				for (sr = 0; sr <= (searchResult.length - 1); sr++) {
					if (searchResult[sr] == eventId[e]) {
						searchOpen = true;
						//Mark matching locations and types as having active content under the current filter selections
						activeLocsInDrop[activeLocsInDrop.length] = eventLocArray[e];
						activeTypeInDrop[activeTypeInDrop.length] = eventTypeArray[e].replace(/\s/g, '').toLocaleLowerCase();
						break;
					} else {
						searchOpen = false;
					}
				}
			} else {
				searchOpen = false;
			}
		}

		//Test 3 LOCATION
		var locOpen = true;
		if (eventLocArray[e] != locDropdownValue & locHasSelection) {
			locOpen = false;
		} else {
			//If there is nothing in the search box mark matching types as having active content under the current filter selections
			if (!searchHasContent) activeTypeInDrop[activeTypeInDrop.length] = eventTypeArray[e].replace(/\s/g, '').toLocaleLowerCase();
		}

		//Tally them up and set animation and status vars the open 
		//If the event is not showing
		if (!eventShowingStatus[e]) {
			if (typeOpen & searchOpen & locOpen) {
				totalEventsShowing++;
				eventShowingStatus[e] = true;
				arrayOpenPos++;
				eventObjOpen[arrayOpenPos] = e;
			}
		} else {
			if (!typeOpen || !searchOpen || !locOpen) {
				totalEventsShowing--;
				eventShowingStatus[e] = false;
				arrayClosePos++;
				eventObjClose[arrayClosePos] = e;
			}
		}
	}; //Loop thru all events e

	//Set the css for the type and location dropdowns to shaded or not (optionInactive/optionActive)
	if (!searchHasContent) {
		//No content in the seach box
		//Did the type dropdown change or the search box just get cleared
		if (domObj.id == "ddEventFilterType" || domObj.id == "tbSearchText") {
			for (var ld = 1; ld <= eventFilterSelectLocation.options.length - 1; ld++) {
				var ddLoc = eventFilterSelectLocation.options[ld].value;
				eventFilterSelectLocation.options[ld].className = "optionInactive";
				for (var la = 0; la <= activeLocsInDrop.length; la++) {
					var arLoc = activeLocsInDrop[la];
					if (ddLoc == arLoc) {
						eventFilterSelectLocation.options[ld].className = "optionActive";
						break;
					}
				}
			}
		}
		//Did the location dropdown get changed or the search box just get cleared
		if (domObj.id == "ddEventFilterLocation" || domObj.id == "tbSearchText") {
			for (var dt = 1; dt <= eventFilterSelectType.options.length - 1; dt++) {
				var ddType = eventFilterSelectType.options[dt].value;
				eventFilterSelectType.options[dt].className = "optionInactive";
				for (var at = 0; at <= activeTypeInDrop.length; at++) {
					var arType = activeTypeInDrop[at];
					if (ddType == arType) {
						eventFilterSelectType.options[dt].className = "optionActive";
						break;
					}
				}
			}
		}
	} else {
		//So there is something in the search box
		//no matter what filter was changed its a slave to that search box
		//Set the css for the type and location dropdowns to shaded or not (optionInactive/optionActive)
		//Type dropdown
		if (domObj.id == "ddEventFilterLocation" || domObj.id == "tbSearchText") {
			for (var dt = 1; dt <= eventFilterSelectType.options.length - 1; dt++) {
				var ddType = eventFilterSelectType.options[dt].value;
				eventFilterSelectType.options[dt].className = "optionInactive";
				for (var at = 0; at <= activeTypeInDrop.length; at++) {
					var arType = activeTypeInDrop[at];
					if (ddType == arType) {
						eventFilterSelectType.options[dt].className = "optionActive";
						break;
					}
				}
			}
		}
		//Location dropdown
		if (domObj.id == "ddEventFilterType" || domObj.id == "tbSearchText") {
			for (var ld = 1; ld <= eventFilterSelectLocation.options.length - 1; ld++) {
				var ddLoc = eventFilterSelectLocation.options[ld].value;
				eventFilterSelectLocation.options[ld].className = "optionInactive";
				for (var la = 0; la <= activeLocsInDrop.length; la++) {
					var arLoc = activeLocsInDrop[la];
					if (ddLoc == arLoc) {
						eventFilterSelectLocation.options[ld].className = "optionActive";
						break;
					}
				}
			}
		}
	}

	eventPageStatusShowing.innerHTML = "Visible " + totalEventsShowing + " of " + totalEventCount + " events";

	//Throttle the frame count based on the number of events that are animating
	//On many computers (2011) the animation is slow in most browsers
	var eventsAnimatingCount = eventObjOpen.length + eventObjClose.length;

	if (eventsAnimatingCount < 100) {
		eventOpenCloseAnimation(0, 10, 25);
	} else {
		if (eventsAnimatingCount > 99 & eventsAnimatingCount < 200) {
			eventOpenCloseAnimation(0, 5, 50);
		} else {
			if (eventsAnimatingCount > 199 & eventsAnimatingCount < 300) {
				eventOpenCloseAnimation(0, 3, 100);
			} else {
				if (eventsAnimatingCount > 299) {
					//Don't animate it
					//Open
					for (i = 0; i < eventObjOpen.length; i++) {
						var lindsayWagner = document.getElementById(eventObjOpen[i] + "event");
						lindsayWagner.removeAttribute("style");
					};
					//Close
					for (i = 0; i < (eventObjClose.length); i++) {
						var lindsayWagner = document.getElementById(eventObjClose[i] + "event");
						lindsayWagner.className = "eventBlockHide";
					};
					//Alternate colors on events that will be open
					//Got to do it in a separate loop. 
					//The Open section is only the event blocks opening not the ones already open
					//This will get them all
					for (i = 0; i < eventShowingStatus.length; i++) {
						if (eventShowingStatus[i]) {
							var lindsayWagner = document.getElementById(i + "event");
							if (altColor) {
								lindsayWagner.className = "eventBlock1";
								altColor = false;
							} else {
								lindsayWagner.className = "eventBlock0";
								altColor = true;
							}
						}
					}
				} //if(eventsAnimatingCount 
			} //if (eventsAnimatingCount 
		}
	}
}; //filterList

function goSearch(domObj) {
	var caryGrant = document.getElementById("tbSearchText").value;
	if (caryGrant == "") {
		filterList(domObj);
	} else {
		wsEvent.wsEventSearch("90", caryGrant, goSearchSuccess, goSearchFail);
	}
}; //goSearch

function goSearchSuccess(result) {
	//Clear previous Results if any
	searchResult.length = 0;
	var melCooley = result.getElementsByTagName("i").length;
	for (r = 0; r < melCooley; r++) { //loop thru the results
		searchResult[r] = result.getElementsByTagName("i")[r].childNodes[0].nodeValue;
	}
	var domObj = document.getElementById("tbSearchText");
	filterList(domObj);
}; //goSearchSuccess

function goSearchFail(result) {
	alert("Could not load search results. Please try again later.");
}; //goSearchFail

function getQuerystring(key, url) {
	key = key.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
	var regex = new RegExp("[\\?&]" + key + "=([^&#]*)");
	var qs = regex.exec(url);
	if (qs == null) {
		return "";
	} else {
		return qs[1];
	};
}; //getQuerystring

function imageAddToHeader() {
	if (urlEventId == "") {
		for (h = eventImageLastAdded; h < (eventImage.length - 1); h++) {
			eventImageLastAdded = h;
			if (eventImage[h] != "") {
				var thing1 = document.getElementById("headImg" + h);
				thing1.onload = function () { setLargeDimensions(this) };
				thing1.src = eventImage[h];

				//This is for resizing the image into it true aspect. Right now 50x50
				//At this point I'm leaving it that way. It may even look better.
				//			thing1.removeAttribute("style", 0);
				//Size the image in aspect.. give or take. The H is fixed at 50px make the width work around that
				//This ass(of you and me)umes the image is already bigger than 50px tall.
				//			var imageW = thing1.offsetWidth;
				//			var imageH = thing1.offsetHeight;
				//			thing1.style.height = "50px";
				//			thing1.style.margin = "3px";
				//			thing1.style.width = imageW + "px";
				//			var imageWIcon = imageW / (imageH / 50);
				//			if (imageWIcon > 175) imageWIcon = 175;
				//			thing1.style.width = imageWIcon + "px";


			}
		}
	}
}; //imageAddToHeader

function onLocListSuccess(result) { //This only runs one time when the page first loads. It puts all the filters at the top of the page.
	var locCount = result.getElementsByTagName("location").length;

	//Set the first one
	var opDefault = document.createElement('option');
	eventFilterSelectLocation.appendChild(opDefault);
	opDefault.innerHTML = "-- All Locations --";
	opDefault.value = "-1";

	for (z = 0; z < locCount; z++) {
		var op = document.createElement('option');
		eventFilterSelectLocation.appendChild(op);
		op.innerHTML = result.getElementsByTagName("locationNameShort")[z].childNodes[0].nodeValue;
		op.value = result.getElementsByTagName("evancedId")[z].childNodes[0].nodeValue;
		if (z > -1) op.className = "optionInactive"; //Make all but the --All Locations-- option inactive we will make the active as we load events.
		if (result.getElementsByTagName("evancedId")[z].childNodes[0].nodeValue == urlEventLocation) op.selected = true; 
	};

	//Now load the event types
	wsEvent.wsEventTypes(onTypeSuccess, onTypeFail);

}; //onLocListSuccess

function onLocListFail(result) {
	alert("Failed to load locations and events.");
}; //onLocListFail

function onTypeSuccess(result) {
	var typeCt = result.getElementsByTagName("g").length;
	
	//Set the first one
	var opDefault = document.createElement('option');
	eventFilterSelectType.appendChild(opDefault);
	opDefault.innerHTML = "-- All Types --";
	opDefault.value = "--alltypes--";

	for (z = 0; z < typeCt; z++) {
		var op = document.createElement('option');
		eventFilterSelectType.appendChild(op);
		var buzzLightyear = result.getElementsByTagName("g")[z].childNodes[0].nodeValue;
		op.innerHTML = buzzLightyear;
		op.value = buzzLightyear.replace(/\s/g, '').toLocaleLowerCase();
		if (z > -1) op.className = "optionInactive"; //Make all but the --All Types-- option inactive we will make the active as we load events.
		if (buzzLightyear.replace(/\s/g, '').toLocaleLowerCase() == urlEventType) op.selected = true;
	};
	
	//Now load the events
	//If we are call a single event from the query string else get them all
	if (urlEventId != "") {
		wsEvent.wsEventOne(urlEventId, addEventsSuccess, addEventsFail);
	} else {
		//if we have a search in the query string then we would need to collect results from the search web service before we load events
		if (urlEventSearch == "") {
			wsEvent.wsEventAll(loadNumberOfDaysEachCall, dayCount, addEventsSuccess, addEventsFail);
		} else {
			wsEvent.wsEventSearch("90", urlEventSearch, onSearchFromUrlSuccess, onSearchFromUrlFail);
		}
	};	
}

function onTypeFail(result) {
	alert("Could not load event types.");
}

function onSearchFromUrlSuccess(result) {
	document.getElementById("tbSearchText").value = urlEventSearch;
	//Clear previous Results if any
	searchResult.length = 0;
	var melCooley = result.getElementsByTagName("i").length;
	for (r = 0; r < melCooley; r++) { //loop thru the results
		searchResult[r] = result.getElementsByTagName("i")[r].childNodes[0].nodeValue;
	}
	wsEvent.wsEventAll(loadNumberOfDaysEachCall, dayCount, addEventsSuccess, addEventsFail);
}

function onSearchFromUrlFail(result) {
	alert("Failed to load search results fro query string.");
}

function onDescriptionOpenSuccess(result) {
	eventDescOpen[eventDescToOpenClose] = true;
	var eventBloctForDesc = document.getElementById(eventDescToOpenClose + "event");
	var descDiv = document.createElement('div');
	eventBloctForDesc.appendChild(descDiv);
	descDiv.id = eventDescToOpenClose + "description";
	descDiv.style.clear = "both";
	descDiv.style.height = "1px";
	descDiv.style.overflow = "hidden";

	var innerDiv = document.createElement('div');
	descDiv.appendChild(innerDiv);
	innerDiv.style.margin = "20px";

	//Image
	if (eventImage[eventDescToOpenClose] != "" & eventImageWDesc[eventDescToOpenClose] != undefined & eventImageWDesc[eventDescToOpenClose] != "" & eventImageHDesc[eventDescToOpenClose] != undefined & eventImageHDesc[eventDescToOpenClose] != "") {
		var descImage = document.createElement('img');
		innerDiv.appendChild(descImage);
		descImage.className = "floatRight";
		descImage.src = eventImage[eventDescToOpenClose];
		descImage.style.height = eventImageHDesc[eventDescToOpenClose];
		descImage.style.width = eventImageWDesc[eventDescToOpenClose];
	};
	//Description
	var descText = document.createElement('span');
	innerDiv.appendChild(descText);
	var description = result.getElementsByTagName("desc")[0].childNodes[0].nodeValue;
	descText.innerHTML = description + "<br />";
	descH = descDiv.scrollHeight;
	//Link to this event only
	var copyLink = document.createElement('a');
	descText.appendChild(copyLink);
	copyLink.href = "?pageId=" + urlPageId + "&eventId=" + eventId[eventDescToOpenClose];
	//Move to the bottom right corner of the description
	copyLink.style.position = "absolute";
	copyLink.style.bottom = "0px";
	copyLink.style.left = "775px";
	copyLink.innerHTML = "&#8734;";
	copyLink.title = "Link to this event";
	desOpenAnimation(1);
}

function onDescriptionOpenFail(result) {
	alert("Failed to load event description.");
}

function openSignUpWindow(obj) {
	var urlString = "http://cal.saclibrary.org/SPLeventsignup.asp?ID=" + obj.id;
	window.open(urlString, "", "width=760px,height=720px,menubar=no,resizable=no,titlebar=no,toolbar=no,status=no,scrollbars=yes,location=no");
}; //openSignUpWindow

function overSignUp(obj) {
	obj.className = "linkOver";
}; //overSignUp

function outSignUp(obj) {
	obj.className = "linkOut";
} // outSignUp

function searchBtnMouseOver(goBtn) {
	goBtn.style.backgroundColor = "#996699";
}; //searchBtnMouseOver

function searchBtnMouseOut(goBtn) {
	goBtn.style.backgroundColor = "#659A41";
}; //searchBtnMouseOut

function setLargeDimensions(obj) {
	var imgSrc = obj.src;
	var eventNumber = obj.id.replace("headImg", "");
	//Size the image if its really big. No bigger than 400 in any direction
	var newImg = new Image();
	newImg.src = imgSrc;
	var imageH = newImg.height;
	var imageW = newImg.width;
	if (imageW > 400 || imageH > 400) {
		if ((imageH * 0) > (imageW * 0)) {
			eventImageWDesc[eventNumber] = Math.round(imageW / (imageH / 400));
			eventImageHDesc[eventNumber] = 400;
		} else {
			eventImageHDesc[eventNumber] = Math.round(imageH / (imageW / 400));
			eventImageWDesc[eventNumber] = 400;
		};
	} else {
		eventImageHDesc[eventNumber] = imageH;
		eventImageWDesc[eventNumber] = imageW;
	}
	if (urlEventId != "") {
		obj.style.width = eventImageWDesc[eventNumber];
		obj.style.height = eventImageHDesc[eventNumber];
		obj.style.visibility = "visible";
	}
}; //setLargeDimensions

function showMoreOver(obj) {
	if (!eventsLoading) {
		obj.className = "eventPageStatusShowMoreHover";
	}
}; //showMoreOver

function showMoreOverFoot(obj) {
	if (!eventsLoading) {
		obj.className = "eventPageStatusShowMoreHoverFoot";
	}
}; //showMoreOver

function showMoreOut(obj) {
	if (!eventsLoading) {
		obj.className = "eventPageStatusShowMore";
	}
}; //showMoreOut

function showMoreOutFoot(obj) {
	if (!eventsLoading) {
		obj.className = "eventPageStatusShowMoreFoot";
	}
}; //showMoreOut

function showMoreDown(obj) {
	if (urlEventId != "") {
		//remove event 1 it's the only one because it was called be the query string (urlEventId)
		//also reset all status vars as if its a fresh page
		eventPageStatusShowMore.style.visibility = "hidden";
		eventPageStatusLoading.style.visibility = "visible";
		eventPageStatusShowMoreFoot.style.visibility = "hidden";
		eventPageStatusLoadingFoot.style.visibility = "visible";
		if (document.getElementById("1event")) {
			eventList.removeChild(document.getElementById("1event"));
		}
		dayCount = 0; //How many days have been loaded so far
		daysLeftToLoad = loadNumberOfDays;
		totalEventCount = 0;
		totalEventsShowing = 0;
		urlEventId = "";
		eventImage.length = 0; //URLs for event images.
		eventLocArray.length = 0;
		eventId.length = 0; //Links the elementId (eventBlock.id = totalEventCount + "event") to the evanced event id.
		eventShowingStatus.length = 0; //true = the event is showing.
		eventFilters.style.display = "block";
		eventPageStatusShowing.style.display = "block";
		eventFooter.style.display = "block";
		eventPageStatus.style.visibility = "visible";
		eventImageHDesc.length = 0;
		eventImageWDesc.length = 0;
		//Now add more events
		wsEvent.wsEventAll(loadNumberOfDaysEachCall, dayCount, addEventsSuccess, addEventsFail);
	} else {
		if (!eventsLoading) {
			eventsLoading = false;
			eventPageStatusShowMore.style.visibility = "hidden";
			eventPageStatusLoading.style.visibility = "visible";
			eventPageStatusShowMoreFoot.style.visibility = "hidden";
			eventPageStatusLoadingFoot.style.visibility = "visible";
			daysLeftToLoad = loadNumberOfDays;
			//Set the filter link with the added days
			//Get the filter values
			//Type
			var typeDropdownValue = eventFilterSelectType[eventFilterSelectType.selectedIndex].value;
			//Search
			var searchValue = document.getElementById("tbSearchText").value
			//Location
			var locDropdownValue = eventFilterSelectLocation[eventFilterSelectLocation.selectedIndex].value;
			//Set href for the filter link
			copySearchLink.href = "?pageId=" + urlPageId + "&eventtype=" + typeDropdownValue + "&eventsearch=" + searchValue + "&eventlocation=" + locDropdownValue + "&eventnumdays=" + (dayCount + loadNumberOfDays);
		
			wsEvent.wsEventAll(loadNumberOfDaysEachCall, dayCount, addEventsSuccess, addEventsFail);
		}
	}
}; //showMoreDown

function submitSearch(domObj) {
	//Look for the enter key unicode == 10 or 13
	var rtn = domObj.value;
	if (rtn == "") {
		searchResult.length = 0;
		filterList(domObj);
	}
	if (rtn.length > 20) {
		domObj.value = rtn.slice(0, 20);
	} else {
		var unicode = rtn.charCodeAt(rtn.length - 1);
		var unicodeB = rtn.charCodeAt(rtn.length - 2);
		//if it's a carriage return
		if (unicode == 10) {
			if (unicodeB == 13) {
				domObj.value = rtn.slice(0, rtn.length - 2);
			} else {
				domObj.value = rtn.slice(0, rtn.length - 1);
			}
			goSearch(domObj);
		};
	};
}; //submitSearch



