/* begin interactive features
*************************************************************/
function changeTabs(tabId)
{
    if (tabId.className == "deselected")
    {
        tabId.className = "selected";
        selectedTab.className = "deselected";
        selectedTab = tabId;
        
        for (var i = 0; i < interactiveLinks.length; i ++)
        {
            if (tabId == interactiveLinks[i])
            {
                interactiveDivs[i].style.display = "block";
                selectedDiv.style.display = "none";
                selectedDiv = interactiveDivs[i];
            }
        }
        return false;
    }
    
    else if (tabId.className == "selected") 
    {
        return false;
    }
}

function showBubble(areaId)
{
    var areaCoords = areaId.getAttribute('coords').split(',');
    var areaLeft = parseInt(areaCoords[0]) + 90;
    var areaTop = parseInt(areaCoords[1]) + 175;
    objDivFeatureBubble.style.display = 'block';
    objDivFeatureBubble.style.left = areaLeft + 'px';
    objDivFeatureBubble.style.top = areaTop + 'px';
    
    for (var i = 0; i < interactiveMapAreas.length; i ++)
    {
        objDivFeatureBubbleDivs[i].style.display = "none";
        
        if (areaId == interactiveMapAreas[i])
        {
            objDivFeatureBubbleDivs[i].style.display = "block";
        }
    }
}

function prepareTabs()
{
    for (var i = 0; i < interactiveLinks.length; i ++)
    {
        interactiveLinks[i].onclick = function()
        {
            return changeTabs(this);
        }
    }
}

function prepareMapAreas()
{
    for (var i = 0; i < interactiveMapAreas.length; i ++)
    {
        interactiveMapAreas[i].onmouseover = function()
        {
            return showBubble(this);
        }
        
        interactiveMapAreas[i].onmouseout = function()
        {
            objDivFeatureBubble.style.display = "none";
        }
        
        interactiveMapAreas[i].onclick = function()
        {
            //return false;
        }
    }
}

/* end interactive features
*************************************************************/

/* begin toggle clickable headers
*************************************************************/

function closePanels()
{
    // swap arrow img
    var arrowImgs = document.getElementById("divBodyCopy").getElementsByTagName("IMG");
    for (var i = 0; i < arrowImgs.length; i ++)
    {
        if(arrowImgs[i].src.indexOf("arrow") != -1)
        {
            arrowImgs[i].src = "/sfxPictures/layout/arrowClosed.gif";
        }
    }

    // close panels on page load
    for (var i = 0; i < divBodyCopyTables.length; i ++)
    {
        divBodyCopyTables[i].getElementsByTagName("TR")[0].style.display = "";   
        divBodyCopyTables[i].getElementsByTagName("TH")[0].colSpan = 3;
        divBodyCopyTables[i].getElementsByTagName("TH")[1].style.display = "none";
        divBodyCopyTables[i].getElementsByTagName("TH")[2].style.display = "none";
    
        var localRows = divBodyCopyTables[i].getElementsByTagName("TR");
        for (var x = 1; x < localRows.length; x ++)
        {
            localRows[x].style.display = "none";
        }
    }
}

function prepareTableHeaders()
{
    for (var i = 0; i < divBodyCopyTableHeaders.length; i ++)
    {  
        divBodyCopyTableHeaders[i].onclick = function()
        {
            // toggle row visibility
            if (this.offsetParent.getElementsByTagName("TR")[1].style.display == "none")
            {
                for (var i = 1; i < this.offsetParent.getElementsByTagName("TR").length; i ++)
                {
                    this.offsetParent.getElementsByTagName("TR")[i].style.display = "";
                }
            }
            else
            {
                for (var i = 1; i < this.offsetParent.getElementsByTagName("TR").length; i ++)
                {
                    this.offsetParent.getElementsByTagName("TR")[i].style.display = "none";
                }
            }
            
            // toggle header cell visibility, colspan and arrow
            if (this.parentNode.getElementsByTagName("TH")[1].style.display == "none")
            {
                for (var i = 1; i < this.parentNode.getElementsByTagName("TH").length; i ++)
                {
                    this.parentNode.getElementsByTagName("TH")[i].style.display = "";
                }
                this.parentNode.getElementsByTagName("TH")[0].colSpan = 1;
                this.parentNode.getElementsByTagName("IMG")[0].src = "/sfxPictures/layout/arrowOpen.gif";
            }
            else
            {
                for (var i = 1; i < this.parentNode.getElementsByTagName("TH").length; i ++)
                {
                    this.parentNode.getElementsByTagName("TH")[i].style.display = "none";
                }
                this.parentNode.getElementsByTagName("TH")[0].colSpan = 3;
                this.parentNode.getElementsByTagName("IMG")[0].src = "/sfxPictures/layout/arrowClosed.gif";
            }
        }
    }
}

/* end toggle clickable headers
*************************************************************/

/* begin toggle info bubble
*************************************************************/

function prepareInfoImgs()
{
    var infoImages = document.getElementById("divBodyCopy").getElementsByTagName("IMG");
    
    for (var i = 1; i < infoImages.length; i++)
    {
        infoImages[i].onmouseover = function()
        {
            if(this.src.indexOf("information.gif") != -1)
            {
               showInfoBubble(this);
            }
        }
        
        infoImages[i].onmouseout = function()
        {
            if(this.src.indexOf("information.gif") != -1)
            {
               hideInfoBubble(this);
            }
        }
    }
}

function showInfoBubble(id)
{
    var divInfoBubble = id.offsetParent.getElementsByTagName("DIV");
    var divContainerTable = id.parentNode.offsetParent;
    var divContainerTD = id.parentNode;
    //document.getElementById("divBodyCopy").style.position = "relative";
    divInfoBubble[0].style.display = "block";
    divInfoBubble[0].style.top = ((divContainerTable.offsetTop + divContainerTD.offsetTop + id.offsetTop) - (divInfoBubble[0].offsetHeight + 10)) + "px";
    divInfoBubble[0].style.left = (id.offsetLeft - 143) + "px"; 
}

function hideInfoBubble(id)
{
    var divInfoBubble = id.offsetParent.getElementsByTagName("DIV");
    divInfoBubble[0].style.display = "none";
}

/* end toggle info bubble
*************************************************************/

/* begin window onload
*************************************************************/

window.onload = function() {

    // interactive features
    if(document.getElementById("divInteractiveFeatures"))
    {
        interactiveUl = document.getElementById("divInteractiveFeatures");
        interactiveLinks = interactiveUl.getElementsByTagName("a");
        interactiveDivs = interactiveUl.getElementsByTagName("div");
        interactiveMapAreas = interactiveUl.getElementsByTagName("area");
        objDivFeatureBubble = document.getElementById("divFeatureBubble");
        objDivFeatureBubbleDivs = objDivFeatureBubble.getElementsByTagName("div");
        selectedTab = interactiveLinks[0];
        selectedDiv = interactiveDivs[0];
        prepareTabs();
        prepareMapAreas();
    }
    
    // toggle clickable table headers
    if(document.getElementsByTagName("TH"))
    {
        divBodyCopyTables = document.getElementById("divBodyCopy").getElementsByTagName("TABLE");
        divBodyCopyTableHeaders = document.getElementById("divBodyCopy").getElementsByTagName("TH");
        prepareTableHeaders();
        closePanels();
        prepareInfoImgs();
    }
}

/* end window onload
*************************************************************/