/*******************************************************
*   Main JavaScripts File                              *
*   (contains general scripts used on multiple pages)  * 
*   include on every page.                             *
*******************************************************/


//global vars:
var theDomain = 'Eldorado Care Center'; // NB, IF CHANGING THIS CHANGE ON CONFIG FILE TOO.



window.onload = activate;
	

// on window load, initialize other functions: 
function activate() {
	blurLinks();
	// include these on the main site only:
	if (onAdminPanel != true) { 
		embedSlideshow(); // (embeds the swf version of the slideshow if on template 1)
		initialize(); // (initialize Google map on page load (in case of user enabling JS then refreshing))
	}
}


	
// blurLinks function
// Gets rid of the annoying dotted line that appears around clicked links.
function blurLinks() {
	
	var links = document.getElementsByTagName('A');
	
	for (var i = 0; i < links.length; i++) { 
		currentLink = links[i];
		currentLink.onfocus = function() { this.blur(); };
	}
	
}



// showHide function
// New style show hide function- receives displayMode (i.e. none / inline / block).
function showHide(itemID, displayMode) {
	
	var theItem = document.getElementById(itemID);
	
	if (theItem) {
		theItem.style.display = displayMode;
	}
	
}



// createCookie function 
// creates a new cookie (used by the new slideshowscripts file in splash).
// taken from http://www.quirksmode.org/js/cookies.html
// nb, days is optional (if not set, cookie expires on browser close)
function createCookie(name, value, days) {
	if (days) {
		var date = new Date();
		date.setTime(date.getTime()+(days*24*60*60*1000));
		var expires = "; expires="+date.toGMTString();
	}
	else var expires = "";
	
	document.cookie = name+"="+value+expires+"; path=/";
}



// readCookie function 
// fetches a cookie value when fed the name.
// taken from http://www.quirksmode.org/js/cookies.html
function readCookie(name) {

	var nameEQ = name + "=";
	var ca = document.cookie.split(';');
	
	for (var i = 0; i < ca.length; i++) {	
		var c = ca[i];
		while (c.charAt(0) == ' ') c = c.substring(1, c.length);
		if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
	}
	
	return null;
}



// expandPane function 
// expands one of the white rounded boxes on the left, and shrinks the other 2 (template 1).
function expandPane(paneNo) {
	
	//check cookie that defines the font size:
	var fontSize = readCookie('style_cookie');


	//if expanding pane #1 (site features):
	if (paneNo == 1) {
		
		//show the full features pane:
		showHide('featuresclosex', 'inline'); 
		showHide('featuresdownarr', 'none');
		showHide('initialfeatures', 'block');
		showHide('morefeatures', 'block');
		
		//hide contents of other panes (except the expand arrows):
		showHide('moreinfoclosex', 'none');
		showHide('moreinfodownarr', 'inline');
		
		//some of these may not exist (depend whether form has been submitted with ajax yet) 
		//so check for them first to avoid an error:
		if (document.getElementById('moreinfotable1')) {		
			showHide('moreinfotable1', 'none');
		}
		if (document.getElementById('moreinfotable2')) {
			showHide('moreinfotable2', 'none');
		}
		if (document.getElementById('moreinfobutdiv')) {
			showHide('moreinfobutdiv', 'none');
		}		
		if (document.getElementById('moreinfoerrormsg')) {
			showHide('moreinfoerrormsg', 'none'); 
		}
		if (document.getElementById('moreinfosuccessmsg')) {
			showHide('moreinfosuccessmsg', 'none');
		}
		
		showHide('brochurediv', 'none');
		
		showHide('contactclosex', 'none');
		showHide('contactdownarr', 'inline');
		showHide('contactdiv1', 'none');
		showHide('contactdiv2', 'none');
		
		//fix the margins (shink for collapsed boxes & regrow for current):
		document.getElementById('leftbox1title').style.margin = '8px 0px 8px 4px';		
		document.getElementById('leftbox2title').style.margin = '0px 0px 0px 4px';
		document.getElementById('leftbox3title').style.margin = '0px 0px 0px 4px';
	
		//resize center & right boxes to match:
		if (fontSize == 15) {
			document.getElementById('rightcontent').style.height = '753px';
		}
		else if (fontSize == 14) {
			document.getElementById('rightcontent').style.height = '714px';
		}
		else {
			document.getElementById('rightcontent').style.height = '593px';
		}
	
	}
	
	//if expanding pane #2 (get info):
	else if (paneNo == 2) {
		
		//show the full get info pane:
		showHide('moreinfoclosex', 'inline');
		showHide('moreinfodownarr', 'none');
		
		//some of these may not exist (depend whether form has been submitted with ajax yet) 
		//so check for them first to avoid an error:
		if (document.getElementById('moreinfotable1')) {		
			showHide('moreinfotable1', 'block');
		}
		if (document.getElementById('moreinfotable2')) {
			showHide('moreinfotable2', 'block');
		}
		if (document.getElementById('moreinfobutdiv')) {
			showHide('moreinfobutdiv', 'block');
		}		
		if (document.getElementById('moreinfoerrormsg')) {
			showHide('moreinfoerrormsg', 'block'); 
		}
		if (document.getElementById('moreinfosuccessmsg')) {
			showHide('moreinfosuccessmsg', 'block');
		}

		showHide('brochurediv', 'block');

		//hide contents of other panes (except the expand arrows):
		showHide('featuresclosex', 'none'); 
		showHide('featuresdownarr', 'inline');
		showHide('initialfeatures', 'none');
		showHide('morefeatures', 'none');
		
		showHide('contactclosex', 'none');
		showHide('contactdownarr', 'inline');
		showHide('contactdiv1', 'none');
		showHide('contactdiv2', 'none');

		//fix the margins (shink for collapsed boxes & regrow for current):
		document.getElementById('leftbox1title').style.margin = '0px 0px 0px 4px';		
		document.getElementById('leftbox2title').style.margin = '8px 0px 8px 4px';
		document.getElementById('leftbox3title').style.margin = '0px 0px 0px 4px';

		//shrink center & right boxes back down to default:
		document.getElementById('rightcontent').style.height = '528px';

	}
	
	//if expanding pane #3 (contact):
	else if (paneNo == 3) {
		
		//show the full contact pane:
		showHide('contactclosex', 'inline');
		showHide('contactdownarr', 'none');
		showHide('contactdiv1', 'block');
		showHide('contactdiv2', 'block');

		//hide contents of other panes (except the expand arrows):
		showHide('featuresclosex', 'none'); 
		showHide('featuresdownarr', 'inline');
		showHide('initialfeatures', 'none');
		showHide('morefeatures', 'none');
		
		showHide('moreinfoclosex', 'none');
		showHide('moreinfodownarr', 'inline');
		
		//some of these may not exist (depend whether form has been submitted with ajax yet) 
		//so check for them first to avoid an error:
		if (document.getElementById('moreinfotable1')) {		
			showHide('moreinfotable1', 'none');
		}
		if (document.getElementById('moreinfotable2')) {
			showHide('moreinfotable2', 'none');
		}
		if (document.getElementById('moreinfobutdiv')) {
			showHide('moreinfobutdiv', 'none');
		}		
		if (document.getElementById('moreinfoerrormsg')) {
			showHide('moreinfoerrormsg', 'none'); 
		}
		if (document.getElementById('moreinfosuccessmsg')) {
			showHide('moreinfosuccessmsg', 'none');
		}
		
		showHide('brochurediv', 'none');
		
		//fix the margins (shink for collapsed boxes & regrow for current):
		document.getElementById('leftbox1title').style.margin = '0px 0px 0px 4px';		
		document.getElementById('leftbox2title').style.margin = '0px 0px 0px 4px';
		document.getElementById('leftbox3title').style.margin = '8px 0px 8px 4px';

		//resize center & right boxes to match:
		if (fontSize == 15) {
			document.getElementById('rightcontent').style.height = '809px';
		}
		else if (fontSize == 14) {
			document.getElementById('rightcontent').style.height = '742px';
		}
		else {
			document.getElementById('rightcontent').style.height = '611px';
		}

	}
	
	//hide all the more links (only show when all 3 boxes partially expanded):
	showHide('featuresmorelink', 'none');
	showHide('moreinfomorelink', 'none');
	showHide('contactmorelink', 'none');
	
}



// resetLeftPanes function
// resets all 3 left white rounded boxes to their initial (partly open) state (template 1).
function resetLeftPanes() { 	
	
	//show only the initial text for all panes (no arrows, close links or expanded text): 
	showHide('featuresclosex', 'none'); 
	showHide('featuresdownarr', 'none');
	showHide('initialfeatures', 'block');
	showHide('morefeatures', 'none');

	showHide('moreinfoclosex', 'none');
	showHide('moreinfodownarr', 'none');
		
	//some of these may not exist (depend whether form has been submitted with ajax yet) 
	//so check for them first to avoid an error:
	if (document.getElementById('moreinfotable1')) {		
		showHide('moreinfotable1', 'block');
	}
	if (document.getElementById('moreinfotable2')) {
		showHide('moreinfotable2', 'none');
	}
	if (document.getElementById('moreinfobutdiv')) {
		showHide('moreinfobutdiv', 'none');
	}		
	if (document.getElementById('moreinfoerrormsg')) {
		showHide('moreinfoerrormsg', 'none'); 
	}
	if (document.getElementById('moreinfosuccessmsg')) {
		showHide('moreinfosuccessmsg', 'block');
	}
		
	showHide('brochurediv', 'none');

	showHide('contactclosex', 'none');
	showHide('contactdownarr', 'none');
	showHide('contactdiv1', 'block');
	showHide('contactdiv2', 'none');

	//show all the more links:
	showHide('featuresmorelink', 'block');
	showHide('moreinfomorelink', 'block');
	showHide('contactmorelink', 'block');

	//fix the margins (regrow for all):
	document.getElementById('leftbox1title').style.margin = '8px 0px 8px 4px';		
	document.getElementById('leftbox2title').style.margin = '8px 0px 8px 4px';
	document.getElementById('leftbox3title').style.margin = '8px 0px 8px 4px';

	//check cookie that defines the font size:
	var fontSize = readCookie('style_cookie');

	//resize center & right boxes back down to defaults:
	if (fontSize == 15) {
		document.getElementById('rightcontent').style.height = '635px';
	}
	else if (fontSize == 14) {
		document.getElementById('rightcontent').style.height = '582px';
	}
	else {
		document.getElementById('rightcontent').style.height = '528px';
	}

}



// killExpandFunction function 
// removes expandPane function from the table when mousing over the close link (template 1).
// (prevents it from immediately opening again).
function killExpandFunction(paneNo) {
	
	document.getElementById('leftbox'+paneNo).onclick = '';

}


// reactivateExpandFunction function
// reinstates expandPane function on the table when mousing off the close link (template 1).
function reactivateExpandFunction(paneNo) {

	document.getElementById('leftbox'+paneNo).onclick = function() { expandPane(paneNo); };

}



// embedSlideshow function 
// replaces the image with the swf slideshow using swfobject (avoid activex etc).
function embedSlideshow() {
	
	//see've we're on template 1
	if (document.getElementById('template1')) {
		
		//replace the image with the swf slideshow:
		swfobject.embedSWF("grafix/slideshow/slideshow.swf", "slideshow", "230", "300", "8.0.0");
	}

}



// scrollToTop function
// scrolls browser smoothly up to the top of the page.
function scrollToTop() {
	
	//get the distance the user has scrolled down the page:
	//(Nb, pageYOffset works for FF, Opera, Saf, Netscape and Chrome. IE sees as "undefined")
	var distScrolled = window.pageYOffset;
	
	//(IE understands document.documentElement.scrollTop):
	if (distScrolled == undefined) {
		distScrolled = document.documentElement.scrollTop;
	}

	
	//scroll up by 30px:
	window.scrollBy(0, -30); 
    
	//if we're not at the top of the page yet, do it again:
	if (distScrolled > 0) {
		setTimeout('scrollToTop()', 10); 
	}

}



//define xmlHttp as global var (this way we can use it to check whether a request is in progress)
var xmlHttp = null;


// ajaxCreate function 
// creates the HttpRequest object for the other ajax functions and passes it back.
//(receives the containerId for use in the onreadystatechange bit)
function ajaxCreate(containerId) {

	try {
		// Firefox, Opera 8.0+, Safari
		xmlHttp = new XMLHttpRequest();
	}
	catch (e) {
		
		try {
			//IE 6+
			xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
		}
		catch (e) {
			//(browser can't understand ajax):
			return false;
		}
	}

	//onreadystatechange property: stores function that will process the response from server.
	xmlHttp.onreadystatechange = function() {
	
		//readyState 4 means the request is complete.
		if (xmlHttp.readyState == 4) {
  			//responseText holds the servers response.
			document.getElementById(containerId).innerHTML = xmlHttp.responseText;
			//set global var back to null when we're done with it (so we know whether it's ok to start another request):
			xmlHttp = null;
		}

	}
	
	return xmlHttp;

}



// ajaxFetch function 
// fetches a seperate page in with ajax and places it in the container.
function ajaxFetch(containerId, fetchPage) {

	//create the HttpRequest object using my seperate function:
	var xmlHttp = ajaxCreate(containerId);
	
	//if HttpRequest object created successfully send request:
	if (xmlHttp != null) {	
		//open takes 3 params: method, url, asyncronous (true/false).
		xmlHttp.open("GET", fetchPage, true);	
		xmlHttp.send(null);
	}
	
}



// ajaxPost function 
// submits the contents of a form to a processing page using ajax.
function ajaxPost(containerId, formId, processingPage) {

	//create the HttpRequest object using my seperate function:
	var xmlHttp = ajaxCreate(containerId);
	
	//if HttpRequest object created successfully...
	if (xmlHttp != null) {	

		//fetch the form & process the contents into a string seperated by &s using my processForm function:
		var theForm = document.getElementById(formId);
		var params = processForm(theForm);
		
		//open takes 3 params: method, url, asyncronous (true/false).
		xmlHttp.open("POST", processingPage, true);
		xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
		xmlHttp.send(params);

	}

}



// processForm function 
// processes the form fields and returns a single & seperated string of name / value pairs.
function processForm(theForm) {

	var str = '';

	//loop through every field in the form:
	for (var i = 0; i < theForm.elements.length; i++) {	
		
		//if text field / textarea:
		if (theForm.elements[i].type == 'text' || theForm.elements[i].type == 'textarea') {	
			str += theForm.elements[i].name + '=' + escape(theForm.elements[i].value) + '&';
		}			
		//if select box:
		else if (theForm.elements[i].type == 'select-one') {
			str += theForm.elements[i].name + '=' + theForm.elements[i].options[theForm.elements[i].selectedIndex].value + '&';
		}				
	
		//(can add more else ifs for processing different types of form field later)
	
	}

	//add a final var (some processing pages need to distinguish between forms sent with php & with ajax:
	str += 'ajaxform=true';
	return str;

}



// showWhatsNew function
//shows the what's new page in the center panel then scrolls to the top of the page.
function showWhatsNew() {

	//place the "what's new" content in the center panel 
	//(use the showPageContent function since it also changes the title):
	showPageContent('whatsnew'); 

	//and smoothly scroll to the top of the page:
	scrollToTop();

}



// searchArray function
// searches a given array for a given value and returns the items position in the array or false
// nb, use === when checking, as 0 is a valid array position.
function searchArray(theArray, val) {
	for (var i = 0; i < theArray.length; i++) {
		if (theArray[i] == val) { return i; }
	}
	return false;
}



// pause function
// forces the script to wait until the xmlHttp object has been reset to null before activating next function
// (prevents errors with pieces of content overwritting each other (in the case of page content & templates) 
// or with the xmlHttp object being taken over by another request before the first has finished, and / or 
// content panes being unavailable to fill because that part of the page hasn't loaded yet.
// accepts 2 params- 
// 1. number to indicate which function to run after the pause
// 2. the page we're working on.
function pause(thenWhat, whatPage) {

	//if global xmlHttp var hasn't been set back to null yet:
	if (xmlHttp != null) {

		//a request is still in progress so don't do anything.
		//(try again in 10ms):
		setTimeout('pause("'+thenWhat+'", "'+whatPage+'")', 10);
	}
	else {
		//previous request is finished so do something:
		
		// if 1, go fetch the page content: 
		if (thenWhat == 1) {
			showPageContent(whatPage);
		}
		// if 2, go fetch the subnavs (used on template 2):
		else if (thenWhat == 2) {
			showSubnav(whatPage);
		}
		// if 3, run the linkSwap function (turns subnav link to current page into plain text):
		else if (thenWhat == 3) {
			linkSwap(whatPage);		
		}
		// if 4, initialize the google map (used on contact page):
		else if (thenWhat == 4) {
			initialize();
		}
		// if 5, go fetch the right pane content (used on template 3):
		else if (thenWhat == 5) {
			getTemp3Right(whatPage);
		}
		// if 6, go fetch the left pane content (used on template 3):
		else if (thenWhat == 6) {
			getTemp3Left(whatPage);
		}
		// if 7, set up the jobs page (hide panes that will be shown with script):
		else if (thenWhat == 7) {
			setUpJobsPage();
		}
	}
	
}



// showPage function
// fetches the correct structure template for the given page using ajax
// then activates the function to load in the content for the center pane.
function showPage(whatPage) {
	
	var useTemplate = 1;
	
	//define the pages that need template 2:
	//NB DON'T FORGET PHP USES THIS ARRAY TOO- IF CHANGING, ALSO CHANGE ON FUNCTIONS FILE!	
	var template2Pages = new Array('mission', 'team', 'hotels', 'tour', 'overview', 'subacute', 'postacute', 'jobs', 'worklife', 'apply', 'sendminijobapp');

	//define the pages that need template 3:
	//NB DON'T FORGET PHP USES THIS ARRAY TOO- IF CHANGING, ALSO CHANGE ON FUNCTIONS FILE!	
	var template3Pages = new Array('contact');
	
	//if given page is in the template 2 / 3 arrays update useTemplate var:
	if (searchArray(template2Pages, whatPage) !== false) { // (!== - need to check type as 0 is valid position)
		useTemplate = 2;
	}
	else if (searchArray(template3Pages, whatPage) !== false) { 
		useTemplate = 3;
	}
	
	//check whether we're already using the required template (minimize unnecessary reloading):	
	if (!document.getElementById('template'+useTemplate)) { 
		//if not, swap the template:
		ajaxFetch('pagecontent', 'structure/template'+useTemplate+'.php');
	}	
	
	
	//now go get the page content:
	setTimeout('pause(1, "'+whatPage+'")', 10);

}



// showPageContent function
// fetches in the content for a given page (fills the center pane)
// and changes the window title to match.
// then activates any extra functions needed by specific pages (e.g. to fill in left / right panes).
function showPageContent(whatPage) {

	//define all valid pages:
	//NB DON'T FORGET PHP USES THIS ARRAY TOO- IF CHANGING, ALSO CHANGE ON FUNCTIONS FILE!	
	//NB2 THIS ARRAY MUST ALSO MATCH WITH PAGETITLES ARRAY BELOW.
	var validPages = new Array('mission', 'team', 'hotels', 'tour', 'overview', 'subacute', 'postacute', 'jobs', 'worklife', 'apply', 
								'testimonials', 'inquire', 'contact', 'features', 'getinfo', 'whatsnew', 'sendminijobapp');
		
	//define titles for each valid page:
	//NB DON'T FORGET PHP USES THIS ARRAY TOO- IF CHANGING, ALSO CHANGE ON FUNCTIONS FILE!	
	//NB2 THIS ARRAY MUST MATCH WITH VALIDPAGES ARRAY ABOVE.
	var pageTitles = new Array('Mission Statement - ', 
							   'Meet The Team At ', 
							   'Find Hotels - ', 
							   'See Photos Of Our Facilities - ', 
							   'Overview Of Care Services - ', 
							   'Sub-Acute Rehabilitation Programs At ', 
							   'Post-Acute Rehabilitation Programs At ', 
							   'Job Vacancies At ', 
							   'Work Life With ', 
							   'Apply For A Job With ', 
							   'What Our Clients Say - ', 
							   'Admission Query - ', 
							   'Our Contact Details - ', 
							   'Site Features - ', 
							   'Get More Information - ', 
							   'Whats New At ', 
							   'Apply For A Job At ');
	
	//define the pages with subnavs:
	//NB DON'T FORGET PHP USES THIS ARRAY TOO- IF CHANGING, ALSO CHANGE ON FUNCTIONS FILE!	
	var pagesWithSubnavs = new Array('mission', 'team', 'hotels', 'tour', 'overview', 'subacute', 'postacute', 'jobs', 'worklife', 'apply', 
									 'sendminijobapp');
	
	//define the pages that use template 3 (will need to fill in left & right panes on these):
	//NB DON'T FORGET PHP USES THIS ARRAY TOO- IF CHANGING, ALSO CHANGE ON FUNCTIONS FILE!	
	var template3Pages = new Array('contact');
	
						 
	//see whether the given page is in the validPages array:
	var arrayPos = searchArray(validPages, whatPage);
	
	//if yes...
	if (arrayPos !== false) {
		
		//load in the page content:
		ajaxFetch('centercontent', 'content/pages/'+whatPage+'.php');
		
		//set the window title from the pageTitles array:
		document.title = pageTitles[arrayPos] + theDomain; //(Nb, theDomain is global defined at the top of the page)		

		//if this page has a subnav, load it in:
		if (searchArray(pagesWithSubnavs, whatPage) !== false) {
			setTimeout('pause(2, "'+whatPage+'")', 10);
		}
		
		//if this page is the contact page, initilize the Google map:
		if (whatPage == 'contact') { 
			setTimeout('pause(4, "'+whatPage+'")', 10);
		}
		
		//if this page is the jobs page, hide the panes that will open with script:
		if (whatPage == 'jobs') {
			setTimeout('pause(7, "'+whatPage+'")', 10);
		}

		//if this page uses template 3...
		if (searchArray(template3Pages, whatPage) !== false) {
			//go fetch the content for the righthand pane:
			setTimeout('pause(5, "'+whatPage+'")', 10);
			//and then the left:
			setTimeout('pause(6, "'+whatPage+'")', 10);	
		}

	}
	//if no...
	else {
		//load index page content as default:
		ajaxFetch('centercontent', 'content/pages/index.php');
		
		//set the window title to default:	
		//NB IF CHANGING THE DEFAULT ALSO CHANGE ON THE FUNCTIONS FILE.
		document.title = 'Elderly Care At ' + theDomain;
	
	}	
	
}



// showSubnav function
// fetches in the correct subnav for the left of the page (used on template 2):
function showSubnav(whatPage) {

	//define the pages that belong to each subnav menu:
	//NB DON'T FORGET PHP USES THESE 3 ARRAYS TOO- IF CHANGING, ALSO CHANGE ON FUNCTIONS FILE!	
	var aboutSubnav = new Array('mission', 'team', 'hotels', 'tour');
	var serviceSubnav = new Array('overview', 'subacute', 'postacute');
	var careersSubnav = new Array('jobs', 'worklife', 'apply', 'sendminijobapp');
	
	//fetch in the relevant subnav for given page:
	if (searchArray(aboutSubnav, whatPage) !== false) {
		ajaxFetch('leftnav', 'content/leftmenus/aboutsubnav.php');
	}	
	else if (searchArray(serviceSubnav, whatPage) !== false) {
		ajaxFetch('leftnav', 'content/leftmenus/servicesubnav.php');
	}
	else if (searchArray(careersSubnav, whatPage) !== false) {
		ajaxFetch('leftnav', 'content/leftmenus/careerssubnav.php'); 
	}
	//(no default needed)
	
	
	//activate linkSwap function to turn current page link to plain text:
	setTimeout('pause(3, "'+whatPage+'")', 10);

}



// linkSwap function 
// fetches back the link to the current page and turns it into plain text. 
function linkSwap(whatPage) {
			
	document.getElementById('leftnav'+whatPage+'link').style.display = 'none';
	document.getElementById('leftnav'+whatPage+'text').style.display = 'inline';	

}



// getTemp3Right function
// fetches in the content for the righthand pane of template 3.
function getTemp3Right(whatPage) { 

	//(nb, so far there is only one possibility):
	if (whatPage == 'contact') {
		ajaxFetch('template3right', 'content/smallboxes/contactpageright.php');
	}

}



// getTemp3Left function
// fetches in the content for the lefthand pane of template 3.
function getTemp3Left(whatPage) { 

	//(nb, so far there is only one possibility):
	if (whatPage == 'contact') {
		ajaxFetch('template3left', 'content/smallboxes/contactpageleft.php');
	}

}



// setUpJobsPage function
// sets up the jobs page when it is fully loaded (hides panes that will be shown with script)
// (this allows us to show a different configuration on JS-free version).
function setUpJobsPage() {
	
	var allDivs = document.getElementsByTagName('div');
	
	for (var i = 0; i < allDivs.length; i++) {
		//if viewjobinfo div, show it:
		if (allDivs[i].className == "viewjobinfo") {
			allDivs[i].style.display = 'block'; 
		}
		//if jobcontent div, hide it:
		else if (allDivs[i].className == "jobcontent") {
			allDivs[i].style.display = 'none'; 
		}
		//if jobapplybut div, show it:
		else if (allDivs[i].className == "jobapplybut") {
			allDivs[i].style.display = 'block';
		}
		//if jobappform div, hide it:
		else if (allDivs[i].className == "jobappform") {
			allDivs[i].style.display = 'none';
		}
	}
	
}



// showJobInfo function 
// shows the description / salary etc info for a job when the title is clicked (jobs page).
function showJobInfo(jobId) {
	
	//show the jobcontent div for this job:
	document.getElementById('jobcontent'+jobId).style.display = 'block';
	
	//fetch the view details link and swap it for a hide link:
	var viewInfoDiv = document.getElementById('viewjobinfo'+jobId);
	viewInfoDiv.innerHTML = '<a href="" title="hide details for this job" onclick="return false;">Hide Details</a>';	
	
	//fetch the relevant jobtitle div and change the onclick function to hideJobInfo:
	document.getElementById('jobtitle'+jobId).onclick = function() { hideJobInfo(jobId); };

}



// hideJobInfo function 
// hides the description / salary etc info for a job when the title is clicked (jobs page).
function hideJobInfo(jobId) {
	
	//hide the jobcontent div for this job:
	document.getElementById('jobcontent'+jobId).style.display = 'none';
	
	//fetch the hide details link and swap it for a view link:
	var viewInfoDiv = document.getElementById('viewjobinfo'+jobId);
	viewInfoDiv.innerHTML = '<a href="" title="view details and application form" onclick="return false;">View Details</a>';	
	
	//fetch the relevant jobtitle div and change the onclick function to showJobInfo:
	document.getElementById('jobtitle'+jobId).onclick = function() { showJobInfo(jobId); };

}



// showJobAppForm function
// displays the application form below the given job (jobs page).
function showJobAppForm(jobId) {

	//hide the apply now button: 
	document.getElementById('jobapplybut'+jobId).style.display = 'none';
	
	//show the application form:
	document.getElementById('jobappform'+jobId).style.display = 'block';

}