var popupTimer = null;
var popupBookId = null;
var popupDivId = null;
var mouseCoordinates = new Array();

//register an event to capture the mouse pointer location
document.observe('mousemove', function(event) {
    mouseCoordinates = event.pointer();
});

//needed to pause display of skills in order to prevent multiple skills
//being opened if user mouses down list
function prepareToCallGetSkills(bookId, divID, categoryName){
	if(popupTimer != null || bookId == 'none'){
		clearTimeout(popupTimer);
		popupTimer = null;
		if(bookId == 'none'){
			popupDivId = null;
			return;
		}
	}
	popupBookId = bookId;
	popupDivId = divID;
	popupTimer = setTimeout('getSkills(' + bookId + ', \"' +  categoryName +  '\")', 500);

}

//get skills for tooltips
function getSkills(book_id, categoryName){
var myPopupBookID = popupBookId;
    if ($(popupDivId).innerHTML.strip().empty()) {
    	new Ajax.Request('/book-tip.php?id=' + book_id + '&cat=' + categoryName, {
    			method: 'get',
    			onSuccess: function(transport) {
    				if(popupBookId == myPopupBookID){
    					var result = transport.responseText;
    					document.getElementById(popupDivId).innerHTML = result;
    					overlayPopup(popupDivId);
    				}
    			}
    	});
    }else {
        //the div has already been created, just show it
        overlayPopup(popupDivId);
    }
}

function overlayPopup(id) {
    var mouseX = mouseCoordinates['x'];
    var mouseY = mouseCoordinates['y'];
	var viewportWidth = (Prototype.Browser.IE) ? document.viewport.getWidth() : document.viewport.getWidth() - 20;
	var viewportHeight = document.viewport.getHeight();
	var viewportOffsets = document.viewport.getScrollOffsets()
	var viewportOffsetLeft = viewportOffsets['left'];
	var viewportOffsetTop = viewportOffsets['top'];

  var popup = $(String.interpret(id));

  if (popup!=null) {
  	var popupWidth = popup.getWidth();
  	var popupHeight = popup.getHeight();
  	var viewportSpaceRight = viewportWidth - mouseX;
  	var viewportSpaceBelow = viewportHeight - (mouseY - viewportOffsetTop);

  	var popupLeft = viewportWidth > popupWidth && viewportSpaceRight < (popupWidth + 50) ? mouseX - popupWidth - 50 : mouseX + 50;
  	var popupTop = viewportHeight > popupHeight && viewportSpaceBelow < (popupHeight + 5) ? mouseY - (popupHeight - viewportSpaceBelow) - 5 : mouseY + 5;

	popup.setStyle({
		left: popupLeft,
		top: popupTop,
		display: 'block'
	});
  }

}