/* INFO BOX ------------------------------------------------*/
//globals and preload
var boxOn = false;
var iconOff = new Image;
iconOff.src ="/players/images/icons/icon-info.gif";
var iconOn = new Image;
iconOn.src = "/players/images/icons/icon-info-on.gif";
var boxTop = new Image;
boxTop.src = "/players/img/infobox-top.png";
var boxBot = new Image;
boxBot.src = "/players/img/infobox-bot.png";



function findEventPos (event) {
    var coords = { x: 0, y: 0 };
    coords.x += event.clientX;
    coords.y += event.clientY;
    return coords;
}

function findElementPos (element) {
    var coords = { x: 0, y: 0 };
    while (element) {
    coords.x += element.offsetLeft;
    coords.y += element.offsetTop;
    element = element.offsetParent;
    }
    return coords;
}

function showInfo(objIcon,event, helpText, fixedX, fixedY)
{
    if (!boxOn)
    {
        //toggle question mark icon
        objIcon.src = iconOn.src;
        //identify elements and dimensions
        var box = document.getElementById('infobox');
        var imgBoxTop = document.getElementById('infobox-top');
        var imgBoxBot = document.getElementById('infobox-bot');
        var imgCoords = findElementPos(objIcon);
        var scrollTop = Math.max(document.body.scrollTop,document.documentElement.scrollTop);
        var scrollLeft = Math.max(document.body.scrollLeft,document.documentElement.scrollLeft);
        var browserWidth = document.body.clientWidth;

        if (imgCoords)
        {
            //box.style.display = "block";
            var info = document.getElementById('infoContainer');

            //remove infoText div if exists
            if (info.firstChild)
                info.removeChild(info.firstChild);
            //create infoText div
            var newdiv = document.createElement('DIV');
            info.appendChild(newdiv);
            newdiv.appendChild( document.createTextNode( helpText)) ;
            //apply style to info text
            if (document.all)
                newdiv.className = "infoText";
            else
                newdiv.setAttribute('class', 'infoText');
            //position box, offset by box height
            var xOffset,yOffset,quadrant;

            if (fixedX != undefined)
            {
                box.style.left = imgCoords.x + fixedX + "px";
                //console.log(fixedX);
            }
            else
            {

                //set horizontal position
                if ((imgCoords.x + box.clientWidth+20) - scrollLeft > browserWidth )
                {   //Right edge of screen, set to left of icon
                   xOffset = -(box.clientWidth + 5);// - 35);
                }
                else
                {   //to right of icon
                    xOffset = 25;
                }
                box.style.left = (imgCoords.x + xOffset) + "px";
            }

            if (fixedY != undefined)
            {
                box.style.top = imgCoords.y + fixedY + "px";
            }
            else
            {
                //set vertical position  (above or below info icon)
               if ( (imgCoords.y + box.clientHeight) >=  (scrollTop + window.innerHeight) )
                {   //close to bottom of screen
                    yOffset =  -(box.clientHeight)+16;
                }
                else if ( (imgCoords.y - box.clientHeight/2) <= scrollTop )
                {   //close to top of screen
                    yOffset =  6;
                }
                else
                {   //standard position: middle-aligned
                    yOffset = -(box.clientHeight/2) + 16;
                }
                box.style.top = ((imgCoords.y ) + yOffset) + "px";

            }

            boxOn = true;

        }
    }

}



function destroyInfo(objImg)
{
    //document.getElementById('infobox').style.display = "none";
    document.getElementById('infobox').style.left = "-1000px";
    document.getElementById('infobox').style.top = "-1000px";
    boxOn=false;
    objImg.src = iconOff.src;

}



