document.observe("dom:loaded", function() { //Convert <span class="help"> to clickable tooltips
	$$('span.help').each(function(element) {
		$(element).observe('click',showtooltip);
		if ($(element).hasClassName('noimage')) {
			element.insert("");
		} else if(!isIE6()) {
			element.insert("<img src=\"/images/icon-help.png\" width=\"16\" height=\"17\" />");
		} else {
			element.insert("<img src=\"/images/icon-help-ie.png\" width=\"16\" height=\"17\" />");
		}
			
		
   });
	
	$$('a[rel]').each(function(element) {
		// Handle tooltips
		if($(element).rel == "tooltip") {
			$(element).observe('click',showtooltip).writeAttribute('href',false).setStyle({cursor: 'pointer'});
		}
   });
	
});

showtooltip = function(event) { //Function called when <span class="help"> is clicked

	var element = event.element(event);
	var elt = Event.findElement(event, 'span'); //Pick up the span
	var textfile = elt.readAttribute('rel'); //Grab the tooltip file location

	//Generate a unique ID to prevent IE caching the pages during development.
	var randomnumber = Math.floor(Math.random()*10001)
	if (textfile.indexOf("?")!=-1) {textfile = textfile + "&uid="+randomnumber;}
	else {textfile = textfile + "?uid="+randomnumber;}
	//End
	
	new Effect.Appear('tooltipcontent', {duration:0.3,from:0,to:1}); //Show the tooltip and overlay
	if (!isIE6()) new Effect.Appear('tooltipoverlay', {duration:0.3,from:0,to:0.5});

	new Ajax.Request(textfile, {
		method: 'get',
		onCreate: function() { //Loading image
			$('tooltipoverlay').observe('click',closetooltip);
			$('tooltipcontent').update("<div id=\"tooltipborder\"><div><a href=\"javascript:closetooltip()\" class=\"closetooltip\">Close</a><img src=\"/images/tooltip-loading.gif\" class=\"tooltiploading\" /></div></div><div id=\"tooltipfooter\"></div>");
			if (isIE6()) {$$('select').each(function(e){e.hide();})}
			center('tooltipcontent');
		},
		onSuccess: function(transport) { //Write out tooltip
			$('tooltipcontent').update("<div id=\"tooltipborder\"><div><a href=\"javascript:closetooltip()\" class=\"closetooltip\">Close</a>"+transport.responseText+"</div></div><div id=\"tooltipfooter\"></div>");
			center('tooltipcontent');
		},
		onFailure: function() { //Something went wrong
			$('tooltipcontent').update("<div id=\"tooltipborder\"><div><a href=\"javascript:closetooltip()\" class=\"closetooltip\">Close</a><h1>Error</h1><p>Something went wrong loading the tooltip. Please try again later.</p><p>Tooltip filename: "+textfile+"</div></div><div id=\"tooltipfooter\"></div>");
			center('tooltipcontent');
		}
	});
}

center = function(element){
	try{
		element = document.getElementById(element);
	}catch(e){
		return;
	}
	var windowSize = this.getPageDimensions();
	var window_width  = windowSize[0];
	var window_height = windowSize[1];
	
	$('tooltipoverlay').style.height = windowSize[3] + 'px';
	
	element.style.position = 'absolute';
	element.style.zIndex   = 99;

	var scrollY = 0;

	if ( document.documentElement && document.documentElement.scrollTop ){
		scrollY = document.documentElement.scrollTop;
	}else if ( document.body && document.body.scrollTop ){
		scrollY = document.body.scrollTop;
	}else if ( window.pageYOffset ){
		scrollY = window.pageYOffset;
	}else if ( window.scrollY ){
		scrollY = window.scrollY;
	}

	var elementDimensions = Element.getDimensions(element);
	var setX = ( window_width  - elementDimensions.width  ) / 2;
	var setY = ( window_height - elementDimensions.height ) / 2 + scrollY;

	setX = ( setX < 0 ) ? 0 : setX;
	setY = ( setY < 0 ) ? 0 : setY;

	element.style.left = setX + "px";
	element.style.top  = setY + "px";
	Element.show(element);
}

closetooltip = function() { //Close the tooltip and overlay
	new Effect.Fade('tooltipcontent', {duration:0.3,from:1,to:0});
	new Effect.Fade('tooltipoverlay', {duration:0.3,from:0.5,to:0});
	if (isIE6()) {$$('select').each(function(e){e.show();})}
}

getPageDimensions = function(){
	var xScroll, yScroll;
	if (window.innerHeight && window.scrollMaxY) {	
		xScroll = document.body.scrollWidth;
		yScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
		xScroll = document.body.scrollWidth;
		yScroll = document.body.scrollHeight;
	} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		xScroll = document.body.offsetWidth;
		yScroll = document.body.offsetHeight;
	}	
	var windowWidth, windowHeight;
	if (self.innerHeight) {	// all except Explorer
		windowWidth = self.innerWidth;
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) { // other Explorers
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}	
	if(yScroll < windowHeight){
		pageHeight = windowHeight;
	} else { 
		pageHeight = yScroll;
	}
	if(xScroll < windowWidth){	
		pageWidth = windowWidth;
	} else {
		pageWidth = xScroll;
	}
	arrayPageSize = new Array(windowWidth,windowHeight,pageWidth,pageHeight) 
	return arrayPageSize;
}