// Object displays forms for joining the mail list or submitting a resume

/* ********************************************************************************** 
 *
 *	BigBOverlay Object
 *
 *	Purpose:
 *		Provides a consistent look and feel across all the JoPa sites for signing up
 *		for the mail list or for sending in a resume.
 *
 *	New Dependent Files:
 *		/js/Newletter_Team.js
 *		/css/bigBOverlay.css
 *		/Images/BigB_Overlay_CloseBox_Bkg.gif
 *		/Images/Content_Overlay_Bkg.gif
 *		/Images/Overlay_CloseBox_Bkg_Over.gif
 *
 *	Modified Existing Files:
 *		/css/global.css -- Add rule
 *			@import url(bigBOverlay.css);
 
 *		/css/ie6.css -- Add rules
 *			#opacityOverlay { height:840px; }
 *			#opacityOverlay { filter:alpha(opacity=75); }
 *
 *		/css/ie7.css -- Add rule
 *			#opacityOverlay { filter:alpha(opacity=75); }
 *
 *		/css/site.css -- Add rules
 *			#navBar #navleft #CURRENT_lINK,
 *			#navBarJoin #navright #joinOurTeam,
 *			#navBarNewsletter #navright #newsletter { color:#999; }
 *
 *		/Includes/Nav_Bar.htm  --
 *			This whole file should be copied into all sites
 *			Added appropriate id attribute values to links and contains all the
 *				xhtml code for the overlay content.
 *
 *
 *
 *	User Interface:
 *		When user clicks the "Newsletter" or "Join Our Team" link in the top Navigation Bar
 *		the appropriate content is displayed using an "overlay effect". The current page
 *		remains partially visible as though viewed through a translucent mask and the
 *		appropriate form or link appears in a fully opaque rectangle centered
 *		horizontally on the page appearing to overlay the main page content. 
 *		The main Navigation Bar (at the top of the page) is no longer usable.
 *
 *		When the user is finished with the form or link, he clicks a close box
 *		causing the overlayed form or link to disappear, again revealing the
 *		current page content.
 *
 *	Implementation:
 *		The overlay effect is created by using two absolutely positions div elements
 *		that initially have a display property value of none. When the user clicks
 *		the Navigation Bar link an onclick event script is activated. The script
 *		through manipulation of xhtml element className properties controls the
 *		overlay div elements display property value. That is, the overlays div's
 *		display properties are set to either block or none through the script.
 *
 *		If the User Agent (browser) has JavaScript disabled the Navigation Bar links
 *		operated as normal links to .htm pages that have essentially the same content
 *		as the overlay divs.
 *
 *		The BigBOverlay object is activated by adding an onload event listener to
 *		the window object which calls BigBOverlay.initialize().
 *		
 *		Problem:
 *			Since the Navigation Bar elements the user clicks are xhtml <a> tags they
 *			must and will behave as true <a> link elements; however, the interface
 *			requires that the Newletter and Join Our Team links should behave
 *			as buttons (the browser will not change location) and activate a script.
 *
 *			This is accomplished by the script changing the <a> href attribute value
 *			to "#". If JavaScript has been disabled then the <a> link will work as
 *			expected.
 *
 *		Note:
 *			All CSS style rule changes required are done by this script changing
 *			the xhtml element class attribute values. There is no direct settng
 *			of CSS properties on xhtml elements by this object.
 *
 *
 * ********************************************************************************* */


BigBOverlay = new Object();

BigBOverlay = {
	
	CLOSE_RO_PATH		: '/Images/Overlay_CloseBox_Bkg_Over.gif', //cache a roll over image for close box
	
	JOIN_ID 			: 'joinOurTeam',	   //xhtml <a> tag id attribute value
	TEAM_ID				: 'newsletter',		   //xhtml <a> tag id attribute value
	
	OPACITY_OVERLAY_ID	: 'opacityOverlay',	   //xhtml <div> opacity layer, black bkg
	CONTENT_OVERLAY_ID  : 'contentOverlay',    //xhtml <div> holds content, white bkg
	JOINCONTENT_ID		: 'joinContent', 	   //xhtml join our team content
	NEWSCONTENT_ID		: 'newsletterContent', //xhtml newsletter content
	EMAIL_ID			: 'emailIn',           //xhtml newsletter email <input>
	
	CLOSE_BUTTON_CLASS	: 'closeBut', 		   //css class for identifying overlay close button
	ON_CLASS			: 'on',				   //css class for display block
	OFF_CLASS			: 'off', 			   //css class for display none
	
	
	initialize	:	function() {
		//Used if getting the current page background-color value
		var body = document.getElementsByTagName('body')[0];
		var bkgColor = null;
		
		resetLink(document.getElementById(BigBOverlay.JOIN_ID));
		resetLink(document.getElementById(BigBOverlay.TEAM_ID));
		setCloseBoxes();
		
		//cache roll over image
		var cachedImg = new Image(16,16);
		cachedImg.src = BigBOverlay.CLOSE_RO_PATH;
		
		
		function resetLink(linkElem){
			linkElem.onclick = BigBOverlay.clickHandler;
			linkElem.href = '#'; //+ BigBOverlay.OPACITY_OVERLAY_ID;
		}
		
		//Adds the onclick event handler to the overlay close box
		//	Note the use of the literal className in the test
		//	this must be in the xhtml!!
		
		function setCloseBoxes() {
			var buttons = document.getElementsByTagName('button');
			for (var i = 0; i < buttons.length; i++) {
				if (buttons[i].className.search(BigBOverlay.CLOSE_BUTTON_CLASS) > -1) {
					buttons[i].onclick = BigBOverlay.closeOverlay;
					buttons[i].onmouseover = function() { this.className = 'over'; }
					buttons[i].onmouseout = function() { this.className = ''; }
				}
			}
		}//end setCloseBoxes
	},//end initialize
	
	
	// Main Navigation Bar click handler for the Newletter or Join Our Team links
	clickHandler	:	function() {
		
		switch(this.id) {
			case BigBOverlay.JOIN_ID:  BigBOverlay.openOverlay(BigBOverlay.JOINCONTENT_ID); break;
			case BigBOverlay.TEAM_ID:  BigBOverlay.openOverlay(BigBOverlay.NEWSCONTENT_ID);
									   document.getElementById(BigBOverlay.EMAIL_ID).focus();
									   break;
			default:break;
		}
	}, //end clickHandler
	
	
	openOverlay		:	function (contentElemId){
		BigBOverlay.turnOn(document.getElementById(BigBOverlay.CONTENT_OVERLAY_ID));
		BigBOverlay.turnOn(document.getElementById(BigBOverlay.OPACITY_OVERLAY_ID));
		BigBOverlay.turnOn(document.getElementById(contentElemId));
	},
	
	
	closeOverlay	:	function() {
		BigBOverlay.turnOff(document.getElementById(BigBOverlay.OPACITY_OVERLAY_ID));
		BigBOverlay.turnOff(document.getElementById(BigBOverlay.CONTENT_OVERLAY_ID));
		BigBOverlay.turnOff(document.getElementById(BigBOverlay.JOINCONTENT_ID));
		BigBOverlay.turnOff(document.getElementById(BigBOverlay.NEWSCONTENT_ID));
		
	}, //end closeOverlay
	
	turnOff	:	function(xhtmlElem) {
		xhtmlElem.className = xhtmlElem.className.replace(BigBOverlay.ON_CLASS, BigBOverlay.OFF_CLASS);
	},//end turnOff
	
	turnOn	:	function(xhtmlElem) {
		xhtmlElem.className = xhtmlElem.className.replace(BigBOverlay.OFF_CLASS, BigBOverlay.ON_CLASS);
	}
	
} //end BigBOverlay


/* Activate the BigBOverlay object */

if (window.addEventListener) {
	window.addEventListener ('load', BigBOverlay.initialize, false);
}
else if (window.attachEvent) {
	window.attachEvent ('onload', BigBOverlay.initialize);
}