var HelpTooltip = {

  enabled : true,

  mouseX : 0,
  mouseY : 0,

  descriptions : {
    formattedDate : "Date",
    distance : "Distance (m)",
    trapNo : "Trap",
    sectionalTime : "Break Time",
    bendPosition : "Bends",
    position: "Finishing Position",
    comment : "Comment",
    winningTime: "Winning Time",
    goingAllowance : "Going Allowance",
    racingClass : "Grade",
    adjustedTime : "Adjusted Time"
  },

  init: function() {
    this.loadState();
    this.updateState();
  },

  toggleHelp: function() {
    this.enabled = !this.enabled;        
    this.updateState();
    this.storeState();
  },

  updateState: function() {
    //document.body.style.cursor = this.enabled ? "help" : "default"; // toggle help cursor
    document.getElementById("helpState").innerHTML = this.enabled ? "ON" : "OFF";
  },


  storeState: function() {
    var nextYear = new Date();
    nextYear.setFullYear(nextYear.getFullYear()+1);
    document.cookie = "help="+this.enabled +"; expires="+nextYear.toGMTString();
  },

  loadState: function() {
    var cookies = document.cookie;
    var start = cookies.indexOf("help=");
    if( start > -1 ) {
      start += 5;
      var end = cookies.indexOf(";",start);
      if( end == -1 ) end = cookies.length;
      this.enabled = cookies.substring(start, end) != "false";
    } else {
      this.enabled = true;
    }
  },

  show: function( event ) {
    if( this.enabled ) {
      var tooltip = this.tooltipNode();
      tooltip.style.display = "block";

      var cs;

      if(event) {
        cs = event.target.className;
      } else {
        cs = window.event.srcElement.className;        
      }

      tooltip.innerHTML = this.descriptions[cs];
    }
  },

  hide: function() {
    this.tooltipNode().style.display = "none";
  },

  mouseEvent : function(event) {
    if(!event) event = window.event;
    this.mouseX = event.clientX;
    this.mouseY = event.clientY;
    this.updateTooltipPos();
  },

  updateTooltipPos : function() {
    var tooltip = this.tooltipNode();

    var width, height, screenwidth, screenheight, left, top;
    var offsetx = 10;
    var offsety = 10;
    var buffer = 10;

    // get the computed size of the div
    if (document.all) {
      width = tooltip.offsetWidth;
      height = tooltip.offsetHeight;
    } else {
      width = parseInt(document.defaultView.getComputedStyle(tooltip, '').getPropertyValue("width"));
      height = parseInt(document.defaultView.getComputedStyle(tooltip, '').getPropertyValue("height"));
    }    

    if (window.innerWidth) {
      screenwidth = window.innerWidth;
      screenheight = self.innerHeight;
  	} else if (document.documentElement && document.documentElement.clientWidth) {
		  screenwidth = document.documentElement.clientWidth;
		  screenheight = document.documentElement.clientHeight;
	  } else if (document.body) {
		  screenwidth = document.body.clientWidth;
		  screenheight = document.body.clientHeight;
	  }

    // compute if div is going offscreen, if so set it to inside + buffer

    left = this.mouseX + offsetx;
    if (left + width + buffer >= screenwidth) {
      left = screenwidth - width - buffer;
    }

    top = this.mouseY + offsety;
    if (top + height + buffer >= screenheight) {
      top = screenheight - height - buffer;
    }


    left = left + (window.window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0 );
    top = top + (window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0 );

    // set the coords
    tooltip.style.left = left + "px";
    tooltip.style.top  = top + "px";
  },

  tooltipNode : function() {
    return document.getElementById("tooltip");
  }

}
// set the page mouse event
document.onmousemove = FunctionUtil.scopedPointer( HelpTooltip, "mouseEvent" );