// Open hyperlink in a new window
function newBrowserWin(url,name,prop){
    var newWin = window.open(url,name,prop);
    if(!newWin.opener) newWin.opener = self;
    if(newWin.focus) newWin.focus();
}
// Hide all layers on event
function hideAllEntities(hideAll) {return true} // overwrite function
// Show layer on event
function showEntity(id) {
    indexTop += 10;
    elementID = document.getElementById(id)
    elementID.style.zIndex     = indexTop;
    elementID.style.visibility = "visible";
    elementID.style.display    = "block";
}
// Hide layer on event
function hideEntity(id) {
    elementID = document.getElementById(id)
    elementID.style.visibility = "hidden";
    elementID.style.display    = "none";
}
// Show or hide (toggle) layers on event
function showHideEntity(id,hideAll,pos,end) {
    elementID = document.getElementById(id)
    if(hideAll==1){
        if(pos==1 && elementID.style.visibility == "hidden"){hideAllEntities(hideAll);showEntity(id);}
        else if (elementID.style.visibility == "hidden"){showEntity(id)}
        else if(pos==end && elementID.style.visibility == "visible"){hideAllEntities(hideAll);}
    }
    else{
        if(elementID.style.visibility == "hidden"){showEntity(id);}
        else{hideEntity(id);}
    }
}
var prevUniqueID  = 0;
var prevCalloutID = 0;
var prevKeywordID = 0;
var prevCalloutX  = 0;
var prevCalloutY  = 0;
function togglecallout(id,uniqueID){
    calloutID = document.getElementById(id)
    if(prevCalloutID != 0 && id != prevCalloutID){
        document.getElementById(prevCalloutID).style.visibility = "hidden";
        document.getElementById(prevCalloutID).style.display = "none";
    }
    if (prevCalloutID == id && prevUniqueID == uniqueID && calloutID.style.visibility == "visible"){
        calloutID.style.visibility = "hidden";
        calloutID.style.display = "none";
    }
    else{
        // browser window size
        var browserWidth = 0;
        if( typeof( window.innerWidth ) == 'number' ){
            browserWidth = window.innerWidth
            browserHeight = window.innerHeight
        }
        else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ){
            browserWidth = document.documentElement.clientWidth
            browserHeight = document.documentElement.clientHeight
        }
        else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ){
            browserWidth = document.body.clientWidth;
            browserHeight = document.body.clientHeight;
        }
        // adjust x coordinate if pages is aligned center/top or center/middle
        if((lyrPageAlign == 1 || lyrPageAlign == 2) && lyrPageWidth < browserWidth){
            var dx = (browserWidth-lyrPageWidth) / 2;
            mouseposx += dx;
        }
        // adjust y coordinate if pages is aligned center/middle
        if(lyrPageAlign == 2 && lyrPageHeight < browserHeight){
            var dy = (browserHeight-lyrPageHeight) / 2;
            mouseposy += dy;
        }
        // element size
        var elementWidthStr = calloutID.style.width.substring(0,calloutID.style.width.length-2);
        var elementWidth = elementWidthStr * 1;
        // open callout inside existing layer
        if (uniqueID == 0){
            var prevGlossaryXStr = prevCalloutX.substring(0,prevCalloutX.length-2);
            var prevGlossaryX = prevGlossaryXStr * 1;
            // callout x-position
            if (browserWidth-prevGlossaryX < 0)
                calloutID.style.left = prevGlossaryX - (elementWidth/2) + "px"
            else if (browserWidth-prevGlossaryX < elementWidth)
                calloutID.style.left = prevGlossaryX - 25 - (elementWidth - (browserWidth-prevGlossaryX)) + "px"
            else
                calloutID.style.left = prevGlossaryX - 5 + "px";
            // glossary y-position
            calloutID.style.top = prevCalloutY;
        }
        // open callout at new x,y coordinates
        else{
            // callout x-position
            if (browserWidth-mouseposx < 0)
                calloutID.style.left = mouseposx - (elementWidth/2) + "px"
            else if (browserWidth-mouseposx < elementWidth)
                calloutID.style.left = mouseposx - 25 - (elementWidth - (browserWidth-mouseposx)) + "px"
            else
                calloutID.style.left = mouseposx - 5 + "px";
            // callout y-position
            calloutID.style.top = mouseposy + 10 + "px";
        }
        // Show callout
        calloutID.style.visibility = "visible";
        calloutID.style.display = "block";
    }
    prevUniqueID  = uniqueID;   
    prevCalloutID = id;
    prevCalloutX  = calloutID.style.left;
    prevCalloutY  = calloutID.style.top;
}
function showcallout(id){
    document.getElementById("calloutDiv").style.visibility = "hidden";
    document.getElementById("calloutDiv").style.display = "none";
    document.getElementById("calloutDiv").innerHTML = document.getElementById("desc" + id).innerHTML;
    document.getElementById("calloutDiv").style.zindex = 100000;
    document.getElementById("calloutDiv").style.visibility = "visible";
    document.getElementById("calloutDiv").style.display = "block";
}
function showcalloutXY(id,x,y){
    calloutID = document.getElementById(id)
    calloutID.style.left = x + 18 + "px";
    calloutID.style.top = y + 18 + "px";
    calloutID.style.visibility = "visible";
    calloutID.style.display = "block";
}
function hidecallout(id){
    document.getElementById(id).style.visibility = "hidden";
    document.getElementById(id).style.display = "none";
}
function highlightkeyword(id){
    document.getElementById(id).style.color = "red";
    if(prevKeywordID != 0 && id != prevKeywordID)
        document.getElementById(prevKeywordID).style.color = "blue";
    prevKeywordID = id;
}