var _magicOffset = 15;
function showstuff(boxid) 
{
    document.getElementById(boxid).style.visibility = "visible";
}

function hidestuff(boxid) 
{
    var element = document.getElementById(boxid);
    if (element)
        element.style.visibility = "hidden";
}

function setId(element, id)
{
    if (element && id)
    {
        var original = document.getElementById(id);
        if (original)
            original.id = "";

        element.id = id;
    }
}

//************************************************
// Will attempt to find the element, position it next to the mouse and then display it
//************************************************
function displayElementOverPage(element) 
{
    var divName = element.id + "Div";
    var div = document.getElementById(divName);
    
    if (div == null || element == null)
        return;

    var elementPosition = getElementPosition(element);

    if (!placeDivToRightOfElement(element, elementPosition, div))
    {
        placeDivToLeftOfElementAlways(element, elementPosition, div, true);
    }

    showstuff(divName);
}

function placeDivToRightOfElement(element, elementPosition, div)
{
    var divDimensions = getElementDimensions(div);
    var browserDimensions = getBrowserDimensions();

    var top = calculateTop(divDimensions, browserDimensions, elementPosition.top);

    // Calculate the left value for the div
    var left = elementPosition.left + element.width + _magicOffset; // try to make it to the right of the element

    // Enough room?
    if (left + divDimensions.width + _magicOffset >= browserDimensions.availableWidth)
    {
        return false;
    }

    div.style.left = "" + left + "px";
    div.style.top = "" + top + "px";
    return true;
}

function placeDivToLeftOfElementAlways(element, elementPosition, div)
{
    var divDimensions = getElementDimensions(div);
    var browserDimensions = getBrowserDimensions();

    var top = calculateTop(divDimensions, browserDimensions, elementPosition.top);

    // Calculate the left value for the div
    var left = elementPosition.left - divDimensions.width - _magicOffset; // On the left

    div.style.left = "" + left + "px";
    div.style.top = "" + top + "px";
}

function getDsoc()
{
    //define reference to the body object in IE
    var iebody = (document.compatMode && document.compatMode != "BackCompat") ? document.documentElement : document.body

    //define universal dsoc left point
    var dsocleft = document.all ? iebody.scrollLeft : pageXOffset

    //define universal dsoc top point
    var dsoctop = document.all ? iebody.scrollTop : pageYOffset
    return { left: dsocleft, top: dsoctop };
}

function calculateTop(divDimensions, browserDimensions, requestedTop)
{
    // Calculate the top value for the div
    var top = requestedTop;

    // Enough room?
    if (top + divDimensions.height >= browserDimensions.availableHeight)
        top = browserDimensions.availableHeight - divDimensions.height - _magicOffset * 2;

    return top;
}

function getElementDimensions(element)
{
    var elementHeight = getElementHeight(element);
    var elementWidth = getElementWidth(element);

    return {height: elementHeight, width:elementWidth};
}

function getBrowserDimensions()
{
    var browserHeight = 0;
    var browserWidth = 0;

    if (window.innerHeight && window.innerWidth)
    {
        browserHeight = window.innerHeight;
        browserWidth = window.innerWidth;
    }
    else
    {
        var ieDimensions = getBrowserDimensionsIESpecific();
        browserHeight = ieDimensions.height;
        browserWidth = ieDimensions.width;
    }

    var avalbleHeight = browserHeight + getDsoc().top;
    var avalbleWidth = browserWidth;

    return { height: browserHeight, width: browserWidth, availableHeight: avalbleHeight, availableWidth: avalbleWidth};
}

function getBrowserDimensionsIESpecific()
{
    var height = 0;
    var width = 0;
    if (document.documentElement &&
      (document.documentElement.clientWidth || document.documentElement.clientHeight))
    {
        //IE 6+ in 'standards compliant mode'
        width = document.documentElement.clientWidth;
        height = document.documentElement.clientHeight;
    }
    else if (document.body && (document.body.clientWidth || document.body.clientHeight))
    {
        //IE 4 compatible
        width = document.body.clientWidth;
        height = document.body.clientHeight;
    }

    return { height: height, width: width }
}

function getElementHeight(element) 
{
    var height = 0;
    if (element.offsetHeight) 
    {
        height = element.offsetHeight;
    }
    else if (element.clip && element.clip.height) 
    {
        height = element.clip.height;
    }
    else if (element.style && element.style.pixelHeight) 
    {
        height = element.style.pixelHeight;
    }
    return height;
}

function getElementWidth(element) 
{
    var width = 0;
    if (element.offsetWidth) 
    {
        width = element.offsetWidth;
    }
    else if (element.clip && element.clip.width) 
    {
        width = element.clip.width;
    }
    else if (element.style && element.style.pixelWidth) 
    {
        width = element.style.pixelWidth;
    }
    return width;
}

function getElementPosition(element)
{
    var offsetTrail = element;
    var offsetLeft = 0;
    var offsetTop = 0;
    while (offsetTrail)
    {
        offsetLeft += offsetTrail.offsetLeft;
        offsetTop += offsetTrail.offsetTop;
        offsetTrail = offsetTrail.offsetParent;
    }
    if (navigator.userAgent.indexOf('Mac') != -1 && typeof document.body.leftMargin != 'undefined')
    {
        offsetLeft += document.body.leftMargin;
        offsetTop += document.body.topMargin;
    }
    return { left: offsetLeft, top: offsetTop };
}

function debug(text)
{
    var div = getDebugDiv();
    div.innerHTML = text;
    positionit(div);
}

function getDebugDiv()
{
    var debugDiv = document.getElementById('debugDiv');
    if (!debugDiv)
    {
        debugDiv = document.createElement('debugDiv'); //element type
        debugDiv.setAttribute('id', 'debugDiv');
        document.appendChild(debugDiv);
    }
    return debugDiv;
}