/**
 * A location suggest div control
 * @class
 * @scope public
 */
function HoverTextDiv(oPositionAnchor /*:Anchor to use as position offset point */,
									oLeftOffset, oTopOffset) {
    
    this.leftOffset = oLeftOffset;
    this.topOffset = oTopOffset;

    /**
     * The dropdown list layer.
     * @scope private
     */
    this.layer = null;
    
    /**
     * An anchor to use as an offset position point
     * @scope private
     */
    this.positionAnchor /*:HTMLInputElement*/ = oPositionAnchor;
   /**
     * The selected location code
     * @scope private
     */

    //initialize the control
    this.init();
    
}

/**
 * Creates Layer
 * Initializes layer with event functions
 * auto suggest functionality.
 * @scope private
 */
HoverTextDiv.prototype.init = function () {
    var oThis = this;
    this.createLayer();
    this.layer.onkeydown = this.layer.onblur = function(oEvent){
	    oThis.hideHoverText();
    };
  
};

/**
 * Creates the dropdown layer to display multiple suggestions.
 * @scope private
 */
HoverTextDiv.prototype.createLayer = function () {
    var existingLayer = document.getElementById("wellChargeInfoDiv");
    if (!existingLayer) {
    	//create the layer and assign styles
	    this.layer = document.createElement("div");
   	 	this.layer.id = "wellChargeInfoDiv";
    	this.layer.className = "hoverText";
    	this.layer.style.visibility = "hidden";
    	document.body.appendChild(this.layer);
    } else {
    	this.layer = existingLayer;
    }
};

/**
 * Gets the left coordinate of the textbox.
 * @scope private
 * @return The left coordinate of the textbox in pixels.
 */
HoverTextDiv.prototype.getLeft = function () {

    var oNode = this.positionAnchor;
    var iLeft = 0;
    
    while(oNode.tagName != "BODY") {
        iLeft += oNode.offsetLeft;
        oNode = oNode.offsetParent;        
    }
    
    return iLeft + this.leftOffset;
};

/**
 * Gets the top coordinate of the textbox.
 * @scope private
 * @return The top coordinate of the textbox in pixels.
 */
HoverTextDiv.prototype.getTop = function ()  {

    var oNode = this.positionAnchor;
    var iTop = 0;
    
    while(oNode.tagName != "BODY") {
        iTop += oNode.offsetTop;
        oNode = oNode.offsetParent;
    }
    
    return iTop + this.topOffset;
};


/**
 * Hides the suggestion dropdown.
 * @scope private
 */
HoverTextDiv.prototype.hideHoverText= function () {
    this.layer.style.visibility = "hidden";
};


/**
 * Builds the suggestion layer contents, moves it into position,
 * and displays the layer.
 * @scope private
 * @param aSuggestions An array of suggestions for the control.
 */
HoverTextDiv.prototype.showHoverText = function (wellchargeFields,commDescriptions) {
    this.layer.innerHTML = "";  //clear contents of the layer
    var tableEl = document.createElement("table");
    tableEl.className = "wellChargeInfo";
    this.layer.appendChild(tableEl);
    var tbody = document.createElement("tbody");
    var headerRow = document.createElement("tr");
    var headerCell = document.createElement("td");
    headerCell.colSpan = 2;
    headerCell.className = "titleText";
    headerCell.textAlign = "center";
    headerCell.innerHTML = "Hit Any Key to Close";
    headerRow.appendChild(headerCell);
    tbody.appendChild(headerRow);
    tableEl.appendChild(tbody);
    var tableRow = document.createElement("tr");
    tbody.appendChild(tableRow);
    var labelCell = document.createElement("td");
    labelCell.className = "detailHoverGridLabel";
    labelCell.innerHTML = "Commodities";
    tableRow.appendChild(labelCell);
    var valueCell = document.createElement("td");
    valueCell.className = "detailHoverGridValue";

    var commList = "";
    for (var i=0; i < commDescriptions.length; i++) {
		commList += commDescriptions[i] + "<br/>";
    }
    valueCell.innerHTML = commList;
    tableRow.appendChild(valueCell);
    for (var i=0; i < wellchargeFields.length; i++) {
        tableRow = document.createElement("tr");
        tbody.appendChild(tableRow);
        labelCell = document.createElement("td");
        labelCell.className = "detailHoverGridLabel";
        labelCell.innerHTML = wellchargeFields[i][0];
        valueCell = document.createElement("td");
        valueCell.className = "detailHoverGridValue";
        valueCell.innerHTML = wellchargeFields[i][1];
        tableRow.appendChild(labelCell);
        tableRow.appendChild(valueCell);       
    }
    this.layer.style.left = this.getLeft() + "px";
    this.layer.style.top = this.getTop() + "px";
    this.layer.style.visibility = "visible";
    this.layer.focus();
};