﻿// POPUP HELP TEXT IN DIVS (helpDivs.js)
// Requires modHelpDivs.vb in the \app_code folder

function helpDivHide(pageObjectName) {
    //This works.
    var targetObject = document.getElementById(pageObjectName);
    var toremove = document.getElementById('helpdiv');
    targetObject.parentNode.removeChild(toremove);
}

function helpDivShow(msg, pageObjectName) {
    //This works.
    var targetObject = document.getElementById(pageObjectName);

    //Get the size of the new div
    var width = 200;
    var height = 100;
    var msgLength = msg.length;

    //Get the top and left for the div
    var top = 0;
    var left = 0;
    top = targetObject.offsetTop + targetObject.offsetHeight;
    left = targetObject.offsetLeft + targetObject.offsetWidth;

    //Create the div
    var doc = document;
    var div = targetObject.parentNode.appendChild(doc.createElement("div"));

    //Add div name
    div.setAttribute("id", "helpdiv");

    //Create the style
    var myStyle = ""
    myStyle += "border: none; "
    myStyle += "padding: 0px; margin: 0px; "
    myStyle += "position: absolute; "
    myStyle += "top: " + top + "px;"
    myStyle += "left: " + left + "px;"
    myStyle += "height: " + height + "px; "
    myStyle += "width: " + width + "px;"
    myStyle += "background-color: white; color: #363636;"
    myStyle += "font-family: Arial, Helvetica, sans-serif; font-size: small;"
    myStyle += "z-index:999;"

    //Add div style
    div.setAttribute("style", myStyle);

    // Construct HTML for inside of helpDiv.
    var myHTML = ""
    myHTML += "<div style='margin:3px; border-width: 2px; border-color: #FFFFFF'>"

    myHTML += "<div style='border: 2px solid #CCCCCC'>"

    myHTML += "<div style='border-style: solid; border-width: 1px; border-color: #8C461F; padding: 3px;>"

    myHTML += "<p style='margin: 3px; padding: 3px; width: 200px; text-align: left;'>"
    myHTML += msg;

    myHTML += "</p>"




    myHTML += "</div>"

    myHTML += "</div>"

    myHTML += "</div>"

    //Later: add image (?)
    //myHTML += " <img alt='' src='Images/bulb2.png' style='width: 17px; height: 30px; float: left; margin-right: 3px; margin-bottom: 2px;' />";

    div.innerHTML = myHTML + "<br />"

}
