	
	/**
	 *	Functions to hide and re-show all select fields as there is a bug in IE6
	 *  that means these will always be above any overlay. 
	 */ 
	function hideSelects() {
		// loop through all forms on the page
		for (f=0; f<document.forms.length; f++) {
			var elements = document.forms[f].elements;
			// loop through all elements on form
			for(e=0; e<elements.length; e++) {
				if (elements[e].type == 'select-one') {
					elements[e].style.visibility = 'hidden';
				}
			}
		}
	}
				
	function showSelects() {
		// loop through all forms on the page
		for (f=0; f<document.forms.length; f++) {
			var elements = document.forms[f].elements;
			// loop through all elements on form
			for(e=0; e<elements.length; e++) {
				if(elements[e].type == 'select-one') {
			    	elements[e].style.visibility = 'visible';
			    }
			}
		}
	}
	
	
	/**
	*	Function to output the passed system message
	*
	*/
	function displaySystemMessage(message, messageTitle, messageType, animate, closeButton) {
		
		// Hide all select fields
		hideSelects();

	
		// If animate messages is activated
		if(animate) {
			// create overlay using Scriptaculous fade function to hide the overlay on click
			var overlayDiv = document.createElement('div');
			overlayDiv.setAttribute('id', 'overlay');
			overlayDiv.setAttribute('onclick','$(\'overlay\').fade({ duration: 0.5 }); $(\'systemMessage\').fade({ duration: 0.5 });showSelects();return false;');
			
			// create system message using Scriptaculous to fade in and a close button using Scriptaculous to fade out
			var messageDiv = document.createElement('div');
			messageDiv.setAttribute('id', 'systemMessage');
			messageDiv.setAttribute('class', messageType);
			messageDiv.setAttribute('style', 'display:none;');
			var html = '<h2>'+messageTitle+'</h2>'+message;
			if(closeButton) {
				html += '<ul><li><a href="#" class="button buttonClose" onclick="$(\'overlay\').fade({ duration: 0.5 }); $(\'systemMessage\').fade({ duration: 0.5 });showSelects();return false;">Close</a></li></ul>';
			} 
			messageDiv.innerHTML = html;

		} else {
			// create overlay with simple hide on click
			var overlayDiv = document.createElement('div');
			overlayDiv.setAttribute('id', 'overlay');
			overlayDiv.setAttribute('onclick','document.getElementById(\'overlay\').style.display=\'none\';document.getElementById(\'systemMessage\').style.display=\'none\';showSelects();return false;');
			
			// create system message with simple hide close button
			var messageDiv = document.createElement('div');
			messageDiv.setAttribute('id', 'systemMessage');
			messageDiv.setAttribute('class', messageType);
			messageDiv.setAttribute('style', 'display:none;');
			var html = '<h2>'+messageTitle+'</h2>'+message;
			if(closeButton) {
				html += '<ul><li><a href="#" onclick="document.getElementById(\'overlay\').style.display=\'none\';document.getElementById(\'systemMessage\').style.display=\'none\';showSelects();return false;">Close</a></li></ul>';
			} 
			messageDiv.innerHTML = html;
			
		}
		
		// Calculate page height
		var docHeight;
		if (window.innerHeight && window.scrollMaxY) {// Firefox
			docHeight = window.innerHeight + window.scrollMaxY;
		} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
			docHeight = document.body.scrollHeight;
		} else { // works in Explorer 6 Strict, Mozilla (not FF) and Safari
			docHeight = document.body.offsetHeight;
	  	}
		
		// Calculate the top of the viewport
		var viewportTop = 0;
		if (self.pageYOffset) { // all except Explorer
			viewportTop = self.pageYOffset;
		} else if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 Strict
			viewportTop = document.documentElement.scrollTop;
		} else if (document.body) { // all other Explorers
			viewportTop = document.body.scrollTop;
		}
		
		// Calculate the height of the viewport
		var viewportHeight;
		if (window.innerheight) { // mozilla/netscape/opera/IE7
		     viewportHeight = window.innerHeight;
		} else if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientHeight != 0) { // IE6
		      viewportHeight = document.documentElement.clientHeight;
		} else { // older versions of IE
		      viewportHeight = document.getElementsByTagName('body')[0].clientHeight
		}
		
		// Set the overlay to be the full available height
		if(viewportHeight > docHeight) {
			docHeight = viewportHeight;
		}
		overlayDiv.style.cssText = 'height:'+docHeight+'px;';
		
		// Set the system message to be positioned relative to the top of the viewport
		var y = viewportTop + (0.32 * viewportHeight);
		messageDiv.style.cssText = 'top:'+y+'px;';
		
		// Remove overlay and message if currently part of the document
		if(document.getElementById('overlay') != null) {
			document.body.removeChild(document.getElementById('overlay'));
		}
		if(document.getElementById('systemMessage') != null) {
			document.body.removeChild(document.getElementById('systemMessage'));
		}
		
		// Add overlay and message to document
		document.body.appendChild(overlayDiv);
		document.body.appendChild(messageDiv);
		
		// show message now
		if(animate) {
			$('systemMessage').appear();
		} else {
			document.getElementById('systemMessage').style.display = 'block';
		}
		
	}
