/*   These functions allow mouse overs without setting handlers in the HTML

******* top nav ********
It gets a nodeList of imgs, which are children of the container you specify.
It sets up mouse and keyboard events, assigned to the roll function.
It checks for a valid node.
It strips the file extension and then looks for _on in the remaining string
and uses that to determine which file path to use for the img src.
It checks the A element id against the current URL and if it matches
the id substring in the URL, it sets the image On, and disables events for that element.
*/
function doTopNav(navroot) {
    var imgs=document.getElementById(navroot).getElementsByTagName('img');
    var flag = false;
    for(var i=0 ;i < imgs.length; i++) {
        // sets On state for top nav
        if(!flag && matchPathTopNav(imgs[i].parentNode) ){
            roll(imgs[i].parentNode);
            flag = true;
            continue;
        }
        imgs[i].parentNode.onmouseover=function(){roll(this);};
        imgs[i].parentNode.onmouseout=function(){roll(this);};
        imgs[i].parentNode.onfocus=function(){roll(this);};
        imgs[i].parentNode.onblur=function(){roll(this);};
    }
}
// the swapper
function roll(o) {
    var node, src, filetype, newsrc, currentNode;
    // make sure its an img tag node
    for (var i=0; i < o.childNodes.length; i++) {
        currentNode=o.childNodes[i];
        if(currentNode.nodeType==1 && /img/i.test(currentNode.nodeName)) {
            node=i;
            break;
        }
    }
    // get src and switch the file path
    src = o.childNodes[node].src;
    filetype = src.substring(src.lastIndexOf('.'), src.length);
    if(/_on/.test(src)) { newsrc = src.replace('_on','');  }
    else{ newsrc = src.replace(filetype, '_on'+filetype); }
    o.childNodes[node].src=newsrc;
}
// searches location for substring that matches A id
// for some reason, the regex approach would not work so we use indexOf
function matchPathTopNav(node){
    var filePath = window.location.pathname;
     if( filePath.indexOf( node.getAttribute("id") ) != -1 ){ 
            return true;
     }
    return false;
}

/******* left nav *******/

// sets On state for left nav
function setLeftNavState(navroot){
    var node = matchPaths(navroot);
    if( node != null ){
        node.style.backgroundColor = mapSectionColors(window.location.pathname);
        node.style.color = "#FFF";
    }
}
// matches the entire current file path against the href paths in the left nav
function matchPaths(navroot){ 
    var filePath = window.location.pathname;
    var hostStr = window.location.protocol +"//" + window.location.hostname;
    var aNodes=document.getElementById(navroot).getElementsByTagName('a');
    var tempStr = null;
    for(var i=0; i < aNodes.length; i++){
        // IE uses the entire URL path from href, so we strip it out.
        tempStr = aNodes[i].getAttribute("href").replace(hostStr,'');
        var re = new RegExp(filePath,"g");
        if(re.test(tempStr)){
            return aNodes[i];
        }
    }
    return null;
}
// each section uses different colors, so we need to deal with that.
function mapSectionColors(path){
    var colorMap = { about : "#005A9B", programs : "#E66C32", support : "#CC3333", volunteer : "#006C3D", students: "#005A9B", alumni: "#005A9B", educators: "#F5CA5A" };
    for(var item in colorMap){
        var re = new RegExp(item,"g");
        if(re.test(path))
            return colorMap[item];
    }
}
// make sure we have elements to operate on first, by calling onload
window.onload=function(){ 
    if( document.getElementById("topnav-box") )
        doTopNav("topnav-box");
    if( document.getElementById("content-left") )
        setLeftNavState("content-left");
}