var CURRENT_TITLE_POPUP;
var CURRENT_TITLE_TEXT;

function findPosition(opener)
	{
	if (opener.offsetParent)
		{
		for (var posX = 0, posY = 0; opener.offsetParent; opener = opener.offsetParent)
			{
			posX += opener.offsetLeft;
			posY += opener.offsetTop;
			}
		return [posX, posY];
		}
	else
		{
		return [opener.x, opener.y];
		}
	}


function CategoryPopups(){

	var Categorys = document.getElementsByClassName('popTitle');

	for (var i = 0; i <  Categorys.length  ; i++)  {
		//alert(Categorys[i].getAttribute("title"));
		
		
			Categorys[i].onmouseover = function(){
			
				//alert("mouse over! " + findPosition(this)[0] + " " + findPosition(this)[1]);
				var bodyTag = document.getElementsByTagName('body')[0];
				var xPosition = findPosition(this)[0];
				var yPosition = findPosition(this)[1];
				var popupWidth = 300;
				
				var popupBox = document.createElement("span")
				popupBox.className = "titlePopup";
				popupBox.style.position = "absolute";
				popupBox.style.left = (xPosition+80) + "px";
				popupBox.style.top = (yPosition-150) + "px";
				popupBox.style.width = popupWidth + "px";
						
				var windowWidth = "";
				if(window.innerWidth){
					windowWidth = window.innerWidth;
				}
				if(document.body.scrollWidth){
					windowWidth = document.body.scrollWidth;
				}	
				if((xPosition+popupWidth+50) > windowWidth){
			        popupBox.style.left = (windowWidth - popupWidth - (windowWidth-xPosition)) + 'px';
				}	
					
				var smartTitle = 	this.getAttribute("title")
				/*smartTitle += " windowWidth: " + windowWidth + " | ";
				smartTitle += " xPosition: " + xPosition + " | ";
				smartTitle += " popupWidth: " + popupWidth + " | ";*/
			
				/*popupBox.appendChild(document.createTextNode(smartTitle));*/
				popupBox.innerHTML = this.getElementsByTagName('span')[0].innerHTML;
				CURRENT_TITLE_TEXT = this.getAttribute("title");
				this.removeAttribute("title");
				bodyTag.appendChild(popupBox)
				CURRENT_TITLE_POPUP = popupBox
				
			}
			
			Categorys[i].onmouseout = function(){
				if (CURRENT_TITLE_POPUP){
					this.setAttribute("title", CURRENT_TITLE_TEXT);
					CURRENT_TITLE_TEXT = "";
					document.getElementsByTagName('body')[0].removeChild(CURRENT_TITLE_POPUP);
					CURRENT_TITLE_POPUP = null;
				}
			}		
			
		
					
	}//end for	

}

/*addToLoader("CategoryPopups()");*/