﻿/* ////////////////////////////////////////// */
/* ////////////////////////////////////////// */
/* ////////////////////////////////////////// */
/* ////////////////////////////////////////// */
/* ///                                                     ///////////////////////////////////////////// */
/* ///       EC Javascript Library        ///////////////////////////////////////////// */
/* ///                                                    ///////////////////////////////////////////// */
/* ////////////////////////////////////////// */
/* ////////////////////////////////////////// */
/* ////////////////////////////////////////// */
/* ////////////////////////////////////////// */



/* 
This file adds the Javascript Behavior to the page.
*/



/* /////////////////////////// */
/*                                                        */
/*       Javascript Clock                    */
/*                                                        */
/* /////////////////////////// */



function ecClock() {
	// Check to see if the clockBox element exists
	if (document.getElementById("clockBox")) {

		// Define Several arrays; Javascript returns only numbers which represent various values
		// We will define several arrays; they will be carefully ordered so that the numbers which the methods return will be replaced by the corresponding Name
		var namesOfTheDays = new Array("Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday");
		var namesOfTheMonths = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December");
		
		
		// Call the date object and name variables for it's needed components
		var theDate = new Date();

		var	numberOfTheYear = theDate.getFullYear();
		var	zeroCountNumberOfTheMonth = theDate.getMonth();
			var	numberOfTheMonth = zeroCountNumberOfTheMonth + 1;
		var	numberOfTheDate = theDate.getDate();
		var	zeroCountNumberOfTheDay = theDate.getDay();
			var	numberOfTheDay = zeroCountNumberOfTheDay + 1;
		var	numberOfHours = theDate.getHours();
		var	numberOfMinutes = theDate.getMinutes();
		var	numberOfSeconds = theDate.getSeconds();
		var	amOrPm = "";

		// determine whether its am or pm
		if (numberOfHours < 12) {
			amOrPm = "AM";
		}
		else {
			numberOfHours -= 12;
			amOrPm = "PM";
		}
		
		// set hour 0 to hour 12
		if (numberOfHours == 0) {
			numberOfHours = 12;
		}

		//Add a leading zero to single digit numbers (but preserve a single digit numberOfTheDate)
		numberOfHours = twoDigitString(numberOfHours);
		numberOfMinutes = twoDigitString(numberOfMinutes);
		numberOfSeconds = twoDigitString(numberOfSeconds);
		numberOfTheMonth = twoDigitString(numberOfTheMonth);
		displayNumberOfTheDate = twoDigitString(numberOfTheDate);

		//Put it all together
		var formattedDateTime = numberOfTheYear + "/" + numberOfTheMonth + "/" + displayNumberOfTheDate + " (" + namesOfTheMonths[zeroCountNumberOfTheMonth] + " " + numberOfTheDate + "), " + namesOfTheDays[zeroCountNumberOfTheDay] + "   " + amOrPm + " " + numberOfHours + ":" + numberOfMinutes + ":" + numberOfSeconds;

		//Print the clock to the innerHTML of the #clockBox div; reset each second
		document.getElementById('clockBox').innerHTML = formattedDateTime;
		theDate=setTimeout(ecClock,1000); 
	}
}



/* /////////////////////////////////// */
/*                                                                        */
/*       Image Rollover Functions                      */
/*                                                                        */
/* /////////////////////////////////// */



// This is the swap function for image rollovers.
function rollover(newPath) {
		document.images['rolloverImage'].src = newPath;
}

/* 
		This set of event handlers crashes the script if the id does not exist on the page. Therefore it's wrapped in an if statement to sense if the rollover image is present.
		The event handler grabs the ids of the rollover images and monitors their activity sending the image to swap into the rollover() function.
		
		New rollover images, simply need to use name="rolloverImage" and duplicate the if block, modifying it for the id and the image to swap.
		Since there's a lot of repetition if we add more calls, it may be possible to build two or three dimensional arrays that indicate the id, mouseover and mouseout images and looping through. This may also be a case where the event handlers would be better added in a page specific file.
*/

if (document.getElementById("ctl00_ctl00_placeholderForContactForm_component_ContactForm_contactImage")) {
	document.getElementById("ctl00_ctl00_placeholderForContactForm_component_ContactForm_contactImage").onmouseover = function() {rollover("/ECBeta/Images/ContactUsBoxHighlight.jpg")};
	document.getElementById("ctl00_ctl00_placeholderForContactForm_component_ContactForm_contactImage").onmouseout = function() {rollover("/ECBeta/Images/ContactUsBox.jpg")};
}

if (document.getElementById("ctl00_ctl00_placeholderForContactForm_component_EcContactForm_contactImage")) {
	document.getElementById("ctl00_ctl00_placeholderForContactForm_component_EcContactForm_contactImage").onmouseover = function() {rollover("/EC/Images/ContactUsBoxHighlight5.jpg")};
	document.getElementById("ctl00_ctl00_placeholderForContactForm_component_EcContactForm_contactImage").onmouseout = function() {rollover("/EC/Images/ContactUsBox5.jpg")};
}



/* /////////////////////////// */
/*                                                        */
/*       Helper Functions                    */
/*                                                        */
/* /////////////////////////// */



// Adds a leading zero to single digit number (string)
function twoDigitString(data) {
	if (data < 10) {
		data = "0" + data;
		return data;
	} else {
		return data;
	}
}



/*  addLoadEvent allows you to call any number of functions when the onload event occurs
		It is fully compatible with other scripts without wiping out their onload functions.
	addLoadEvent function was designed by Sitepoint guru Simon Willison  */
	
function addLoadEvent(func) {
	
	//assigns a variable for the onload event
	var oldOnload = window.onload;
	
	// checks to see if there is a function already assigned to onload
	if (typeof window.onload != 'function') {
		window.onload = func; // if not, onload executes the function
	} 
	
	// otherwise the variable is called to run the previously called function(s)
	else {
		window.onload = function() {
			if (oldOnload) {
				oldOnload(); //calls the old function(s)
			}
			func(); //calls the new function
		}
	}
}

// Call the functions you want to insert, one per addLoadEvent
addLoadEvent(ecClock);