/* Hover info box*/
Element.prototype.addHover = function(content) {
	this.onmouseover = function() {
		toolTipBox(content);
	};
	this.onmouseout = function() {
		clearToolTipBox();
	};	
}

document.onmousemove = function(evt) {
	if (!evt) evt = window.event;
	mousex = evt.clientX;
	mousey = evt.clientY;
	moveTtBox();
}

function toolTipBox(x) {
	if (!$id('tip')) {
		var newDiv = document.createElement("div");
		newDiv.id = "tip";
		newDiv.className = "tip";
		newDiv.style.visibility = 'hidden';
		newDiv.style.display = 'none';
		newDiv.style.zIndex = '255';
		newDiv.style.width = 'auto';
		//newDiv.style.maxWidth = '300px';

		tip_content = '<div class="tt_content" id="tip_content"></div>';

		newDiv.innerHTML = tip_content;		
		document.body.appendChild(newDiv);
	}
	showElement('tip');
	if (typeof(x) == "string") {
		$id('tip_content').innerHTML = x;
	} else {
		$id('tip_content').innerHTML = "";
		$id('tip_content').appendChild(x);
	}
	if ($id('tip_content').clientWidth>300) { $id('tip').style.width = '300px'; }
	if ($id('tip_content').offsetWidth>300) { $id('tip').style.width = '300px'; }
}

function clearToolTipBox() {
	if ($id('tip')) {
		hideElement('tip');
	}
}

function moveTtBox(x) {
	if ($id('tip')) {
		var left = (mousex + 12);
		var top = (mousey + 10);
		$id('tip').style.left = left + 'px';
		$id('tip').style.top = top + 'px';
	}
}