var buttons = new Array(
    "Home|main.html|home.jpg",
    "About CCC Toastmasters|about.html|about.jpg",
    "What`s New|news.html|news.jpg",
    "Our Meeting|meeting.html|meeting.jpg",
    "Our Committee|com.html|committee.jpg",
    "Become a Member|member.html|member.jpg",
    "Communication and Leadership Programme|program.html|communication.jpg",
    "Tips for Public Speaking|tips.html|tips.jpg",
    "Photo Gallery|photo.html|photoGallery.jpg",
    "Contact Us|contact.html|contactUs.jpg"
);
var subButtons = new Array(
    "Weekly Agenda|agenda.html",
    "Speakers` Rota|rota.html"
);
function start(){
    var HTML=""; 
    HTML = "<table width=\"100%\" cellpadding=0 border=0 cellspacing=0 align=center>";
    
    for(var i=0; i<buttons.length;i++){
        var button = buttons[i].split("|");
        HTML +="<tr>";
        HTML +="<td>";	
        if(i == 0){
            HTML += "<a href=\""+button[1]+"\" target=\"main\" ID=\""+button[0]+"\" onclick=\"change('"+button[0]+"','"+button[2]+"')\" class=\"selectedLink\" >"+ button[0]+"</a>";		
        }else{
            HTML += "<a href=\""+button[1]+"\" target=\"main\" ID=\""+button[0]+"\" onclick=\"change('"+button[0]+"','"+button[2]+"')\" class=\"menulink\" >"+ button[0]+"</a>";		
            if(button[0] == "Our Meeting"){                            
                for(var j=0; j<subButtons.length;j++){
                    var subtn = subButtons[j].split("|");
                    
                    HTML += "<a href=\""+subtn[1]+"\" target=\"main\" ID=\""+subtn[0]+"\" onclick=\"change('"+subtn[0]+"','"+button[2]+"')\" class=\"subMenulink\" >"+ subtn[0]+"</a>";		
                }
            }
        }
           
        HTML +="</td>";
        HTML +="</tr>";        
    }
    HTML +="</table>";
    menu.innerHTML=HTML;       
}

function change(selectItem,selectItemPic){
    
    for(var i=0; i<buttons.length;i++){
        var button = buttons[i].split("|");
        var name = button[0]+"";   
        if(button[0]=="What's New"){
            name="news";
        }
        document.getElementById(name).className="menulink";
        
    }
    for(var j=0; j<subButtons.length;j++){
        var subtn = subButtons[j].split("|");
        var name = subtn[0]+""; 
        document.getElementById(name).className="subMenulink";
    }
    if(document.getElementById(selectItem).className == "subMenulink"){
        document.getElementById(selectItem).className="selectedsubLink"; 
    }else
        document.getElementById(selectItem).className="selectedLink"; 
    subHeading.innerHTML = "<img src=\"pic/"+selectItemPic+"\" >";
}