/////////////////  MENU   //////////////////////////////

function switchButtonOn(id) 
{
    var obj = document.getElementById(id);
    obj.style.backgroundColor = "#448844";
    obj.style.color = "#FFFBFF";
    var lin = obj.firstChild;
    lin.style.backgroundColor = "#448844";
    lin.style.color = "#FFFBFF";
}


function switchButtonOff(id) 
{
    var obj = document.getElementById(id);
    obj.style.backgroundColor = "#FFFBFF";
    obj.style.color = "#337733";
    var lin = obj.firstChild;
    lin.style.backgroundColor = "#FFFBFF";
    lin.style.color = "#337733";
}


function activate(id) 
{
    var lin = document.getElementById(id).firstChild;
    window.location.href = lin;
}


function display(txt) 
{ 
    document.write(txt); 
}


function menu(path, current_page) 
{   
    //Page references
    var array_pagename = new Array("home", "projects", "members", "publications", "openings", "partners", "links", "contact");
    var array_id = new Array("toc_pr", "toc_pr", "toc_me", "toc_pu", "toc_op", "toc_sp", "toc_li", "toc_co");
    var array_link = new Array("index.php", "projects.php", "members.php", "publications.php", "openings.php", "partners.php", "links.php", "contact.php");
       
    //Dislay the head of the menu
    display("<div id='head_div'>"); 
    display("<table id='head' class='box contents_table'>");
    display("<tr>");
    display("<th id='logo'><a href='http://www.t2i.se'><img class='noborder' src='"+path+"images/t2i.png' alt=''/></a><br><a href='"+path+"auth.php' style='background:#448844;color:#FFFFFF;'>Sign in</a></th>");
    display("<th colspan='5' id='department'><a href='http://www.t2i.se'>TableTop Interaction Laboratory</a><br /><a href='http://www.cs.chalmers.se/idc/' target=_blank>ID|C</a>, <a href='http://www.chalmers.se/cse/EN/' target=_blank>CSE</a>, <a href='http://www.chalmers.se' target=_blank>Chalmers TH</a></th>");
    display("<th colspan='2'><a href='http://www.chalmers.se/cse/EN/' target=_blank><img class='noborder' src='"+path+"images/chalmers.png' alt=''/></a></th>");
    display("</tr>"); 
    
    display("<tr id='toc'>");

    //Display the icons of the menu
    for(var i=0; i<8; i++) 
    {
        //current page => green background
        if (current_page == array_pagename[i])
        {
            display("<td class='active' id='array_id[i]'><a href='"+path+array_link[i]+"'>"+array_pagename[i]+"</a></td>");
        }
        //white background
        else
        {
            display("<td id='array_id[i]' onClick='activate('array_id[i]');' onMouseOver='switchButtonOn('array_id[i]');' onMouseOut='switchButtonOff('array_id[i]');'><a href='"+path+array_link[i]+"'>"+array_pagename[i]+"</a></td>");
        }
    } 
    
    //Dislay the end of the menu
    display("</tr></table></div>");    
    display("<div id='padding'>&nbsp;</div>");    
}
