var navHidden = false; // Remember if nav is hidden or not
var ie = document.all; // Varible to test if browser is IE

// Kick it all off!
function initializeNav() {

    if (!document.getElementById) return false; // Can DOM ?
    
    var nav = document.getElementById('nav');     // Nav
    var con = document.getElementById('content'); //Content
    
    changeNavControlImg(document.getElementById('navControl1'), 'images/interface/contents-closed.gif');
    changeNavControlImg(document.getElementById('navControl2'), 'images/interface/contents-closed.gif');
    
    con.style.width = "95%";
    
    // Set nav position to absolute for over the top effect
    nav.style.position = "absolute";
    nav.style.height = "auto";
    nav.style.top = "142px";  
    nav.style.left = "0px";
        
    // Make Nav invisible
    nav.style.opacity = "0";
    nav.style.MozOpacity = "0";
    nav.style.KhtmlOpacity = "0";
    nav.style.filter = "alpha(opacity=0)";
    nav.style.display = 'none';
    // Turn on Nav Hidden
    navHidden = true;    
    
    // Difference with IE 
    if (ie) {nav.style.margin = "0 10px 0 30px";}
    
}

// Tests if nav is hidden or not and shows / hides it accordingly
function showHide() {
    if (navHidden == false) {
        hideNav();
    } else {
        showNav();
    }        
}

// Changes the images that control the in / out fade of the nav
function changeNavControlImg(img, source) {

    img.src = source; // Change source
    img.title = "Show / Hide Navigation"; // Title
    img.alt = "Show / Hide Navigation"; // Alt
    img.style.cursor = "pointer"; // Cursor
    
    // Add event handlers
    img.onclick = Function("showHide()");
    img.onkeypress = Function("showHide()");
}

// Shows nav by setting style attributes
function showNav() {
    
    // Change Nav on / off button
    changeNavControlImg(document.getElementById('navControl1'), 'images/interface/contents-open.gif');
    changeNavControlImg(document.getElementById('navControl2'), 'images/interface/contents-open.gif');
    

    navHidden = false; // Turn navHidden off

    var nav = document.getElementById('nav');
    
    opacity('nav', 0, 90, 500)
}

// Hides nav by setting style attributes
function hideNav() {
    
    // Change Nav on / off button
    changeNavControlImg(document.getElementById('navControl1'), 'images/interface/contents-closed.gif');
    changeNavControlImg(document.getElementById('navControl2'), 'images/interface/contents-closed.gif');
    
    navHidden = true; // Turn navHidden on

    var nav = document.getElementById('nav');
    
    opacity('nav', 100, 0, 500)
}




function opacity(id, opacStart, opacEnd, millisec) {
    //speed for each frame
    var speed = Math.round(millisec / 100);
    var timer = 0;

    //determine the direction for the blending, if start and end are the same nothing happens
    if(opacStart > opacEnd) {
        for(i = opacStart; i >= opacEnd; i--) {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    } else if(opacStart < opacEnd) {
        for(i = opacStart; i <= opacEnd; i++)
            {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    }
}

//change the opacity for different browsers
function changeOpac(opacity, id) {
    var object = document.getElementById(id).style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
    
    // Turn off nva when opacity is low
    if (opacity < 1) {
        object.display = "none";
    } else {
        object.display = "block";
    }        
} 


//window.onload = initializeNav;