window.onload = function(){
	BubbleTips.activateTipOn("AREA");
};

var ToolTipEvents = {
	horzOffset  : -5,
	showTooltip : function(e){
		ToolTipEvents._cleanup();
		BubbleTips.bubbleNode.appendChild(this.tooltip);
		if(event.x > 530){
			ToolTipEvents.horzOffset = -427;
			BubbleTips.bubbleNode.lastChild.lastChild.className = "bottomShowLeft";
		}else{
			ToolTipEvents.horzOffset = -5;
			BubbleTips.bubbleNode.lastChild.lastChild.className = "bottomShowRight";
		};
		ToolTipEvents.setOpacity(this.tooltip,BubbleTips.opacity);
		ToolTipEvents.followMouse(e);
	},
	hideTooltip : function(e){
		ToolTipEvents._cleanup();
	},
	followMouse : function(e){
		BubbleTips.bubbleNode.style.top  = event.clientY + document.body.scrollTop  - BubbleTips.bubbleNode.offsetHeight; + "px";
		BubbleTips.bubbleNode.style.left = event.clientX + document.body.scrollLeft + ToolTipEvents.horzOffset + "px";
	},
	setOpacity : function (elem,opac){
		elem.style.filter="alpha(opacity:"+ ((+opac)*100) +")";
		elem.style.KHTMLOpacity=opac;
		elem.style.MozOpacity=opac;
		elem.style.opacity=opac;
	},
	_cleanup : function(){
		if(BubbleTips.bubbleNode.childNodes.length > 0){
			BubbleTips.bubbleNode.removeChild(BubbleTips.bubbleNode.firstChild);
		}
	}
};

var BubbleTips = {
	opacity       : "1",
	bubbleNode    : null,
	activateTipOn : function(type){
		var bubble = document.createElement("span");
		bubble.style.position = "absolute";
		bubble.style.zIndex = "9";
		this.bubbleNode = bubble;
		document.getElementsByTagName("body")[0].appendChild(bubble);
		var tipTags = document.getElementsByTagName(type);
		for(var i = 0; i < tipTags.length; i++){
			this.bindBubbleTip(tipTags[i]);
		}
	},
	bindBubbleTip : function(elem) {
		var tipText = elem.getAttribute("title");
		if(tipText != null && tipText.length != 0){
			elem.removeAttribute("title");
			var bubble = this.createElem("span","bubbleTooltip");
			var tipTop = this.createElem("span","top");
			tipTop.innerHTML = tipText;
			bubble.appendChild(tipTop);
			bubble.appendChild(this.createElem("span","bottomShowRight"));
			ToolTipEvents.setOpacity(bubble,this.opacity);
			elem.tooltip = bubble;
			elem.onmouseover = ToolTipEvents.showTooltip;
			elem.onmouseout  = ToolTipEvents.hideTooltip;
			elem.onmousemove = ToolTipEvents.followMouse;
		}
	},
	createElem : function(tag,className){
		var elem = document.createElement(tag);
		elem.className = className;
		elem.style.display = "block";
		return elem;
	}
};