var currentLayer = null;

function toggle(layerId) {
    if (currentLayer == layerId) {
        hideLayer(currentLayer);
        return;
    } 
    
    if (currentLayer != null) {
        hideLayer(currentLayer);
    }
    showLayer(layerId);
}

function hideLayer(layerId) {
    currentLayer = null;
    document.getElementById(layerId).style.visibility = 'hidden';
    showSelects();
}

function showLayer(layerId) {
    currentLayer = layerId;
    document.getElementById(layerId).style.visibility = 'visible';
    hideSelects();
}

function hideSelects() {
    var sidebar = document.getElementById("sidebar");
    if (sidebar != null) {
        var aSelects = sidebar.getElementsByTagName("SELECT");
        for (var i = 0; i < aSelects.length; i++) {
            aSelects[i].style.visibility = 'hidden'; 
        }
    }
}

function showSelects() {
    var sidebar = document.getElementById("sidebar");
    if (sidebar != null) {
        var aSelects = sidebar.getElementsByTagName("SELECT");
        for (var i = 0; i < aSelects.length; i++) {
            aSelects[i].style.visibility = 'visible'; 
        }
    }
}

document.onclick = function bodyClick(e) {
    if (currentLayer != null) {
        e = e || window.event;
        var target = e.target || e.srcElement;    

        while (target.tagName != 'BODY' && target.className != 'foldout' && target.id != 'subtop') {
            target = target.parentNode;
        }

        if (target.tagName == 'BODY') {
            hideLayer(currentLayer);
        }
    }
}