//--------------------------------------------------
//Info Bubble Script - display rollover popup info
//--------------------------------------------------
//Use onmouseover="showInfoBubble(this, position);" to display bubble, text will be taken from the 'title' parameter (bubble size will adjust to length of the text). Use 'position' to manually position the bubble on the 'left' or 'right'
//Use onmouseout="hideInfoBubble(this);" to hide bubble
//Alternatively, use initInfoBubbble(); to enable info bubble for all tags ('a', 'div', 'img) that have a 'title' parameter defined

var position='auto';

function updateInfoBubblePosition(e) {
	var posX = 0;
	var posY = 0;
	var infoObj = document.getElementById('infoBubble');
	var infoBubblePointObj = document.getElementById('infoBubblePoint');
	var infoBubbleContentObj = document.getElementById('infoBubbleContent');
	var infoObjWidth = (infoObj.style.width).replace('px', '');
	
	if (!e) var e = window.event;
	if (e.pageX || e.pageY) 	{
		posX = e.pageX;
		posY = e.pageY;
	}
	else if (e.clientX || e.clientY) 	{
		posX = e.clientX + document.body.scrollLeft
			+ document.documentElement.scrollLeft;
		posY = e.clientY + document.body.scrollTop
			+ document.documentElement.scrollTop;
	}					
	
	if (position=='left'){
		//set info bubble to position on the left
		infoBubblePointObj.className = "infoBubblePointRight";
		infoBubbleContentObj.className = "infoBubbleContentRight";	
		infoObj.style.left = (posX-10-infoObjWidth) + 'px'; //set info bubble horizontal offset from mouse pointer position (take into account the width of the bubble)
	}
	else if (position=='right'){
		//set info bubble to position on the right
		infoBubblePointObj.className = "infoBubblePoint";
		infoBubbleContentObj.className = "infoBubbleContent";	
		infoObj.style.left = (posX+10) + 'px'; //set info bubble horizontal offset from mouse pointer position		
	}
	else {
		//position auto: determine if bubble is aligned to the left or right (depends if the bubble is near the right edge)
		if (posX > ((document.documentElement.clientWidth) / 1.2)){
			//set info bubble to position on the left
			infoBubblePointObj.className = "infoBubblePointRight";
			infoBubbleContentObj.className = "infoBubbleContentRight";	
			infoObj.style.left = (posX-10-infoObjWidth) + 'px'; //set info bubble horizontal offset from mouse pointer position (take into account the width of the bubble)
		}
		else {
			//set info bubble to position on the right
			infoBubblePointObj.className = "infoBubblePoint";
			infoBubbleContentObj.className = "infoBubbleContent";	
			infoObj.style.left = (posX+10) + 'px'; //set info bubble horizontal offset from mouse pointer position		
		}
	}
	
	//set info bubble vertical offset from mouse pointer position
	infoObj.style.top = (posY-13) + 'px';	
	
	//bubble becomes visible only after it is in the correct position, and if there's content
	if (infoObj.title)	
		infoObj.style.visibility = 'visible';
}

function showInfoBubble(targetObj, targetPosition){
		
	var infoObj = document.getElementById('infoBubble');
	var childNodeObj = infoObj.childNodes;
	var infoInnerObj = childNodeObj[0];
	var infoInnerContent = targetObj.title;
	
	//set alignment option
	position = targetPosition;
	
	// Detect if the browser is IE or not.
	var IE = document.all?true:false

	// Set up for mouse capture, a special case if not IE
	if (!IE) {
		document.captureEvents(Event.MOUSEMOVE)
	}
	document.onmousemove = updateInfoBubblePosition;
	
	// If IE -- force a position update immediately
	if (IE) {
		var e=window.event;
		updateInfoBubblePosition(e);
	}
	
	// set wrap or nowrap to text depending on the length
	if (infoInnerContent.length > 35){
		infoObj.style.width = '175px';
		infoObj.style.whiteSpace = 'normal';
	}
	else{
		infoObj.style.width = infoInnerContent.length*10 + 'px';
		infoObj.style.whiteSpace = 'nowrap';
	}
	
	//display infoBubble, get text from 'title', remove text from 'title' to prevent triggering the default info bubble
	infoInnerObj.innerHTML = infoInnerContent + '<div class="infoBubbleShadow"></div>';		
	infoObj.title = targetObj.title;
	if (infoObj.title)
		targetObj.title = '';
	
	//make bubble display (so it's position/width can be set)
	infoObj.style.display = 'block';
	
	//make bubble invisible (until it is placed in the correct position)
	infoObj.style.visibility = 'hidden';	
}

function hideInfoBubble(targetObj){
	var infoObj = document.getElementById('infoBubble');
		  			
	//hide infoBubble, replcae 'title' with the text
	infoObj.style.display = 'none';	
	if (infoObj.title)
		targetObj.title = infoObj.title;	
	
	// Detect if the browser is IE or not.
	var IE = document.all?true:false

	// Remove mouse capture, a special case if not IE
	if (!IE) {
		document.releaseEvents(Event.MOUSEMOVE);
	}
	document.onmousemove = null;
		
}	

function initInfoBubbble(){
	var objects = new Array();
	var targetTags = new Array('a', 'div', 'img');
	
	for (i=0; i<targetTags.length; i++){
		
		//get all objects with the target tag name
		objects = document.body.getElementsByTagName(targetTags[i]);
		
		//define onmouseover and onmouseout events for all tag objects with contents in 'title'
		for (j=0; j<objects.length; j++){
			if (objects[j].title.length > 0){
				//if onmouseover and onmouseout events already exists: do nothing
				if ((objects[j].onmouseover == null) || (objects[j].onmouseout == null)){
					objects[j].onmouseover = function onmouseover() {showInfoBubble(this, 'auto')};
					objects[j].onmouseout = function onmouseout() {hideInfoBubble(this)};
					objects[j].style.cursor = 'default';  //set cursor to a pointer to fix an IE6 pointer glitch
				}				
			}
		}
	}
	
}