function navOn(sElementID) {
    document.getElementById(sElementID).style.backgroundImage = "url(images/button_gradient_active.png)";
    return true;
}
function navOff(sElementID) {
    document.getElementById(sElementID).style.backgroundImage = "url(images/button_gradient.png)";
    return true;
}

function getQStringParameterValue(sParameterName) {
    // Retrieve the query string and drop the question mark from the beginning
    var sQueryString = location.search.substr(1);
    var aParameterPair;
    // Test to see if query string is empty (length is zero). If it is, exit the function and return a value of null.
    if (sQueryString.length == 0) {
        return null;
    }
    // At this point we know that the query string is not empty. We should check to see if the parameter name is even part of the query string.
    // If the indexOf function returns -1, then we know the parameter is not in the query string; thus, we can exit the function and return a value of null.
    if (sQueryString.indexOf(sParameterName) == -1) {
        return null;
    }
    // At this point we know that the query string is not empty and that the parameter name is part of the query string. If we can't find an "&" symbol in the
    // query string, then it means that our parameter is the only parameter in the query string; thus, we can split the parameter into a name and value pair, 
    // which is delimited by the "=" sign. Once we have the pair, return the value portion of the parameter pair.
    if (sQueryString.indexOf("&") == -1) {
        aParameterPair = sQueryString.split("=");
        if (aParameterPair[0] == sParameterName) {
            return aParameterPair[1];
        }
        else {
            return null;
        }
    }
    // At this point we know that the query string is not empty, the parameter name is part of the query string and that there are multiple parameters involved.
    // Now we need to separate the list of parameters (delimited by the "&" sign) into name and value pairs (delimited by the "=" sign). Once we have the array
    // of parameters, loop through it and find the pair whose name matches the parameter name we are looking for. Once we find the pair, return the value
    // portion of the parameter pair.
    var aParameterArray = sQueryString.split("&");
    for (i = 0; i < aParameterArray.length; i++) {
        aParameterPair = aParameterArray[i].split("=");
        if (aParameterPair[0] == sParameterName) {
            return aParameterPair[1]
        }
    }
    // If for some mind-boggling reason we reach this point in the function without returning anything, then just return a value of null.
    return null;
}

function showTopNavBar() {
    // Initialize the sSearchBox value to the empty string.
    var sSearchBoxStyle = "";
    // If the DisableSearchInput parameter is set to "true" (has to be lower case), then set the sSearchBoxStyle value (i.e. the div style) for the SearchBoxWrapper
    // so that the div is hidden on this particular page.
    if (getQStringParameterValue("DisableSearchInput") == "true") {
        sSearchBoxStyle = " style='display:none; position:absolute;'";
    }
    document.write("<div id='MenuBar' class='NoPrint'>" +
                    "<div class=\"NavButtons\" id=\"logo\"><a target=\"_blank\" href=\"http://www.lcra.org\"><img src=\"images/lcralogo.png\" border=\"0\"></a></div>" +
                    "<div id=\"NavDivider\"><img src=\"images/button_divider.png\" border=\"0\"></div>" +
				   "<div class='NavButtons' id='NavAbout' onMouseOver='navOn(\"NavAbout\")' onMouseOut='navOff(\"NavAbout\")'>" +
				   "<a href='http://www.lcra.org/about/index.html' target='_blank'><img src='images/about.png' border='0'></a>" +
				   "</div>" +
				   "<div id='NavDivider'><img src='images/button_divider.png' border='0'></div>" +
				   "<div class='NavButtons' id='NavEnergy' onMouseOver='navOn(\"NavEnergy\")' onMouseOut='navOff(\"NavEnergy\")'>" +
				   "<a href='http://www.lcra.org/energy/index.html' target='_blank'><img src='images/energy.png' border='0'></a>" +
				   "</div>" +
				   "<div id='NavDivider'><img src='images/button_divider.png' border='0'></div>" +
				   "<div class='NavButtons' id='NavWater' onMouseOver='navOn(\"NavWater\")' onMouseOut='navOff(\"NavWater\")'>" +
				   "<a href='http://www.lcra.org/water/index.html' target='_blank'><img src='images/water.png' border='0'></a>" +
				   "</div>" +
				   "<div id='NavDivider'><img src='images/button_divider.png' border='0'></div>" +
				   "<div class='NavButtons' id='NavParks' onMouseOver='navOn(\"NavParks\")' onMouseOut='navOff(\"NavParks\")'>" +
				   "<a href='http://www.lcra.org/parks/index.html' target='_blank'><img src='images/parks.png' border='0'></a>" +
				   "</div>" +
				   "<div id='NavDivider'><img src='images/button_divider.png' border='0'></div>" +
				   "<div class='NavButtons' id='NavJobs' onMouseOver='navOn(\"NavJobs\")' onMouseOut='navOff(\"NavJobs\")'>" +
				   "<a href='http://www.lcra.org/about/employment/index.html' target='_blank'><img src='images/jobs.png' border='0'></a>" +
				   "</div>" +
				   "<div id='NavDivider'><img src='images/button_divider.png' border='0'></div>" +
				   "<div class='NavButtons' id='NavContactUs' onMouseOver='navOn(\"NavContactUs\")' onMouseOut='navOff(\"NavContactUs\")'>" +
				   "<a href='http://www.lcra.org/about/overview/contact.html' target='_blank'><img src='images/contact_us.png' border='0'></a>" +
				   "</div>" +
				   "<div id='NavDivider'><img src='images/button_divider.png' border='0'></div>" +
				   "<div id='SearchBoxWrapper'" + sSearchBoxStyle + ">" +
				   "<form name='gs' action='http://www.lcra.org/search' method='GET' target='_blank'>" +
				   "<table height='39px' border='0' align='right' >" +
				   "<tr>" +
				   "<td valign='middle'>" +
				   "<img src='images/search.png' border='0'>" +
				   "</td>" +
				   "<td>" +
				   "<input type='hidden' name='site' value='dotorg'>" +
				   "<input type='hidden' name='client' value='dotorg_new'>" +
				   "<input type='hidden' name='proxystylesheet' value='dotorg_new'>" +
				   "<input type='hidden' name='output' value='xml_no_dtd'>" +
				   "<input type='text' name='q' size='15' class='SearchInputBox'>" +
				   "</td>" +
				   "<td>" +
				   "<input src='images/search_submit.png' name='search' type='image' alt='Click to submit your search'>&nbsp;" +
				   "</td>" +
				   "</tr>" +
				   "</table>" +
				   "</form>" +
				   "</div>" +
				   "</div>");
}