function displayHelp(event,helpId){
	var box = document.getElementById(helpId);
	box.style.left = "";
	box.style.top = "";
	box.style.right = "";
	box.style.bottom="";
	if(!event){
      event = window.event;   
    }
    
    var width = 0, height = 0;
    if(typeof( window.innerWidth ) == 'number' ) {
      width = window.innerWidth;
      height = window.innerHeight;
    } 
    else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
      width = document.documentElement.clientWidth;
      height = document.documentElement.clientHeight;
    } 
    else if( document.body && ( document.body.clientWidth || document.body.clientHeight)){
      width = document.body.clientWidth;
      height = document.body.clientHeight;
    }
    else{
      width = 740;
      height = 570;
   }

    
    if(document.addEventListener){
        document.addEventListener("mousemove", moveHandler, true);
        document.addEventListener("mouseout", upHandler, true);
      }
      else if(document.attachEvent){
        document.attachEvent("onmousemove", moveHandler);
        document.attachEvent("onmouseout", upHandler);
      }
      else{
       var oldmovehandler = document.onmousemove;
       var olduphandler = document.onmouseup;
       document.onmousemove = moveHandler;
       document.onmouseup = upHandler;
      }
      if(event.stopPropagation) {
        event.stopPropagation();
      }
      else{
        event.cancelBubble = true;
      }
      if(event.preventDefault){
        event.preventDefault();
      }
      else{
        event.returnValue = false;
      }
      function moveHandler(event){
        if(!event){
          event = window.event;   
        }
	    var cx = event.clientX;
	    var cy = event.clientY - (document.getElementById("dataWrapper").offsetTop + document.getElementById("topNav").offsetHeight);
	    //determine where the box should go
	    if(width - cx < 150 && cx > width - cx){
	    	//cx = cx - 10;
	    	//box.style.right = cx;
	    	box.style.left = cx - box.offsetWidth -10 + getScrollXY()[0];
	    }
	    else{
	    	cx = cx + 10;
	    	box.style.left = cx + getScrollXY()[0];
	    }
	    if(height - cy < box.offsetHeight + 130 && cy > height - cy){
	    	box.style.top = cy - box.offsetHeight - 10 + getScrollXY()[1];
	    }
	    else{
	    	cy = cy + 10 ; 
	    	box.style.top = cy + getScrollXY()[1];
	    }
	box.className="help-box-on";
        if(event.stopPropagation) {
          event.stopPropagation();
        }
        else{
          event.cancelBubble = true;
        }
        return false;
      }
      function upHandler(event){
        if(!event){
          event = window.event;
        }
        box.className="help-box-off";
        if(document.removeEventListener){
          document.removeEventListener("mouseup", upHandler, true);
          document.removeEventListener("mousemove", moveHandler, true);
        }
        else if (document.detachEvent){
          document.detachEvent("onmouseup", upHandler);
          document.detachEvent("onmousemove", moveHandler);
        }
        else{
          document.onmouseup = olduphandler;
          document.onmousemove = oldmovehandler;
        }
        if(event.stopPropagation){
          event.stopPropagation();
        }
        else{
          event.cancelBubble = true;
        }
      }
}
function closeHelp(helpId){
	var box = document.getElementById(helpId);
	box.className="help-box-off";
}

function initHelps(){
	var spanArray = document.getElementsByTagName("span");
	for(var i = 0; i < spanArray.length; i++){
		if(spanArray[i].className == "help"){
			var helpId = spanArray[i].getAttribute("point");
			spanArray[i].onmouseover = function(event){displayHelp(event,this.getAttribute('point'));};
		}
	}
}
function leftNavDisplay(){
	var leftNav = document.getElementById("left-nav");
	if(leftNav.className == "left-nav-on"){
		leftNav.className = "left-nav-off";
		document.getElementById("left-nav-options").className="left-nav-options-off";
	}
	else{
		leftNav.className = "left-nav-on";
		document.getElementById("left-nav-options").className="left-nav-options-on";
	}
}
function getScrollXY() {
  var scrOfX = 0, scrOfY = 0;
  if( typeof( window.pageYOffset ) == 'number' ) {
    scrOfY = window.pageYOffset;
    scrOfX = window.pageXOffset;
  } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    scrOfY = document.body.scrollTop;
    scrOfX = document.body.scrollLeft;
  } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    scrOfY = document.documentElement.scrollTop;
    scrOfX = document.documentElement.scrollLeft;
  }
  return [ scrOfX, scrOfY ];
}