//copyright - rights owned by Global Grafix Solutions
//unauthorised changes and replication prohibited


numMenus = 7;


//format of this array is: <value in orange><value in white><link><number of sub elements>

var mainMenu= new Array(7); 
mainMenu[0]=["about&nbsp","us","about.html",4]; 
mainMenu[1]=["proj","ects","projects.html",5];
mainMenu[2]=["volun","teer","volunteer.html",2];
mainMenu[3]=["support&nbsp","us","dontate.html",3];
mainMenu[4]=["ne","ws","news.html",1];
mainMenu[5]=["vacan","cies","vacancies.html",1];
mainMenu[6]=["lin","ks","links.html",1];

var subMenu0 = new Array(4);
subMenu0[0]=["About Us","about.html"];
subMenu0[1]=["Our Mission","mission.html"];
subMenu0[2]=["Our History","history.html"];
subMenu0[3]=["Organisational Chart","org.html"];

var subMenu1 = new Array(5);
subMenu1[0]=["Outreach","outreach.html"];
subMenu1[1]=["Escapade","escapade.html"];
subMenu1[2]=["Mentoring","mentoring.html"];
subMenu1[3]=["Volunteering Programme","volunteering.html"];
subMenu1[4]=["All Projects","projects.html"];

var subMenu2 = new Array(2);
subMenu2[0]=["Become a Volunteer","volunteer.html"];
subMenu2[1]=["Activities","activities.html"];

var subMenu3 = new Array(3);
subMenu3[0]=["Become a Volunteer","volunteer.html"];
subMenu3[1]=["Donate","dontate.html"];
subMenu3[2]=["Become a Member","member.html"];

var subMenu4 = new Array(1);
subMenu4[0]=["News and Events","news.html"];

var subMenu5 = new Array(1);
subMenu5[0]=["Vacancies","vacancies.html"];

var subMenu6 = new Array(1);
subMenu6[0]=["Links","links.html"];


function buildMenu()
{
  document.write("<table id = linktable cellpadding = 1 cellspacing = 0 width = 800>");
  document.write("<tr><td colspan = 14 id = linktabletop height = 1></td></tr>");
  document.write("<tr><td colspan = 14 bgcolor = white height = 1></td></tr>");
  document.write("<tr><td colspan = 14 id = linktabletop height = 5></td></tr>");
  document.write("<tr>");

  var x=0; 
  var y = 0;

  for (x=0; x<7; x++) 
  { 

        y = x + 1;

	//document.write("<td align = center><font color = black>this is item "+x+"</td>");

	
		
  	document.write("<td><img src = ee_menu/images/divider.png border = 0></td>");
	document.write('<td valign = bottom height = 20>');
        document.write('<div id = "myLabel'+y+'">');
	document.write('<img src = "images/shim.gif" width = "5" height = "10" border = "0" name="myImg'+y+'">');
	
	document.write('<a href = "'+mainMenu[x][2]+'" onMouseover = "return !showMenuTest('+y+', event, myLabel'+y+');" class="History">');	        
	//document.write('<font id = menucolor1>|'+(x+1)+'|&nbsp;</font><font id = menucolor2>'+mainMenu[x][0]+'</font><font id = menucolor3>'+mainMenu[x][1]+'</font>');	
	document.write('<font id = menucolor2>'+mainMenu[x][0]+'</font><font id = menucolor3>'+mainMenu[x][1]+'</font>');	
	document.write('<img src="ee_menu/images/close_menu.gif" border="0">');
	document.write('<img src="ee_menu/images/open_menu.gif" border="0">');
	
	
	document.write('</a>');
        document.write('</div>');


	document.write('<div id="myMenu'+y+'" style="width: 150px; height: 52px; position:absolute; z-index:20; visibility:hidden"onmouseover="event.cancelBubble = true;">');

	document.write('<table border="0" cellspacing="1" cellpadding="0" width="100" bgcolor = gray>');
	document.write('<tr>');
	document.write('<td width="100%">');
	document.write('<table border = 0 cellspacing = 0 cellpadding = 0 width = 100%>');

	if (x==0)
	{	

		var i=0;
		for (i=0; i< mainMenu[x][3]; i++)
		{

		if (i==0)
		{
		
			document.write('<tr><td bgcolor = #E9E9E9 height = 15></td></tr>');

		}

		
		document.write('<tr>');

		document.write('<td width = 100% bgcolor = #E9e9e9 onMouseover="this.style.backgroundColor = #FFFFFF;" onMouseout = "this.style.backgroundColor = #E9E9E9;">');
		document.write('<img src="ee_menu/images/shim.gif" width="5" height="2" border="0"><span class = "menuLink"><a href="'+subMenu0[i][1]+'">'+subMenu0[i][0]+'<span></a>');
		document.write('</td>');
		document.write('</tr>');

		
		if (i< (mainMenu[x][3]-1))
		{
			document.write('<tr><td><img src = "ee_menu/images/spacer.png"></td></tr>');

		}

		else
		{

			document.write('<tr><td bgcolor = "#E9E9E9" height = 7></td></tr>');

		}


		}

	}
	
	else if (x==1)
	{	

		var i=0;
		for (i=0; i< mainMenu[x][3]; i++)
		{

		if (i==0)
		{
		
			document.write('<tr><td bgcolor = #E9E9E9 height = 15></td></tr>');

		}

		
		document.write('<tr>');

		document.write('<td width = 100% bgcolor = #E9e9e9 onMouseover="this.style.backgroundColor = #FFFFFF;" onMouseout = "this.style.backgroundColor = #E9E9E9;">');
		document.write('<img src="ee_menu/images/shim.gif" width="5" height="2" border="0"><span class = "menuLink"><a href="'+subMenu1[i][1]+'">'+subMenu1[i][0]+'<span></a>');
		document.write('</td>');
		document.write('</tr>');

		
		if (i< (mainMenu[x][3]-1))
		{
			document.write('<tr><td><img src = "ee_menu/images/spacer.png"></td></tr>');

		}

		else
		{

			document.write('<tr><td bgcolor = "#E9E9E9" height = 7></td></tr>');

		}

		}

	}

	else if (x==2)
	{	

		

		var i=0;
		for (i=0; i< mainMenu[x][3]; i++)
		{

		if (i==0)
		{
		
			document.write('<tr><td  bgcolor = #E9E9E9 height = 15></td></tr>');

		}

		
		document.write('<tr>');

		document.write('<td width = 100% bgcolor = #E9e9e9 onMouseover="this.style.backgroundColor = #FFFFFF;" onMouseout = "this.style.backgroundColor = #E9E9E9;">');
		document.write('<img src="ee_menu/images/shim.gif" width="5" height="2" border="0"><span class = "menuLink"><a href="'+subMenu2[i][1]+'">'+subMenu2[i][0]+'<span></a>');
		document.write('</td>');
		document.write('</tr>');

		
		if (i< (mainMenu[x][3]-1))
		{
			document.write('<tr><td><img src = "ee_menu/images/spacer.png"></td></tr>');

		}

		else
		{

			document.write('<tr><td bgcolor = "#E9E9E9" height = 7></td></tr>');

		}

		}

	}
	
	
	else if (x==3)
	{	

		var i=0;
		for (i=0; i< mainMenu[x][3]; i++)
		{
		
		if (i==0)
		{
		
			document.write('<tr><td bgcolor = #E9E9E9 height = 15></td></tr>');

		}
		
		document.write('<tr>');

		document.write('<td width = 100% bgcolor = #E9e9e9 onMouseover="this.style.backgroundColor = #FFFFFF;" onMouseout = "this.style.backgroundColor = #E9E9E9;">');
		document.write('<img src="ee_menu/images/shim.gif" width="5" height="2" border="0"><span class = "menuLink"><a href="'+subMenu3[i][1]+'">'+subMenu3[i][0]+'<span></a>');
		document.write('</td>');
		document.write('</tr>');

		
		if (i< (mainMenu[x][3]-1))
		{
			document.write('<tr><td><img src = "ee_menu/images/spacer.png"></td></tr>');

		}

		else
		{

			document.write('<tr><td bgcolor = "#E9E9E9" height = 7></td></tr>');

		}

		}

	}

	
	else if (x==4)
	{	

		var i=0;
		for (i=0; i< mainMenu[x][3]; i++)
		{

		if (i==0)
		{
		
			document.write('<tr><td bgcolor = #E9E9E9 height = 15></td></tr>');

		}
		
		document.write('<tr>');

		document.write('<td width = 100% bgcolor = #E9e9e9 onMouseover="this.style.backgroundColor = #FFFFFF;" onMouseout = "this.style.backgroundColor = #E9E9E9;">');
		document.write('<img src="ee_menu/images/shim.gif" width="5" height="2" border="0"><span class = "menuLink"><a href="'+subMenu4[i][1]+'">'+subMenu4[i][0]+'<span></a>');
		document.write('</td>');
		document.write('</tr>');

		if (i< (mainMenu[x][3]-1))
		{
			document.write('<tr><td><img src = "ee_menu/images/spacer.png"></td></tr>');

		}

		else
		{

			document.write('<tr><td bgcolor = "#E9E9E9" height = 7></td></tr>');

		}

		}

	}

	else if (x==5)
	{	


		

		var i=0;
		for (i=0; i< mainMenu[x][3]; i++)
		{

		if (i==0)
		{
		
			document.write('<tr><td bgcolor = #E9E9E9 height = 15></td></tr>');

		}

		
		document.write('<tr>');

		document.write('<td width = 100% bgcolor = #E9e9e9 onMouseover="this.style.backgroundColor = #FFFFFF;" onMouseout = "this.style.backgroundColor = #E9E9E9;">');
		document.write('<img src="ee_menu/images/shim.gif" width="5" height="2" border="0"><span class = "menuLink"><a href="'+subMenu5[i][1]+'">'+subMenu5[i][0]+'<span></a>');
		document.write('</td>');
		document.write('</tr>');
		
		
		if (i< (mainMenu[x][3]-1))
		{
			document.write('<tr><td><img src = "ee_menu/images/spacer.png"></td></tr>');

		}

		else
		{

			document.write('<tr><td bgcolor = "#E9E9E9" height = 7></td></tr>');

		}
		}

	}

	else if (x==6)
	{	

		var i=0;
		for (i=0; i< mainMenu[x][3]; i++)
		{

		if (i==0)
		{
		
			document.write('<tr><td bgcolor = #E9E9E9 height = 15></td></tr>');

		}		
		
		document.write('<tr>');

		document.write('<td width = 100% bgcolor = #E9e9e9 onMouseover="this.style.backgroundColor = #FFFFFF;" onMouseout = "this.style.backgroundColor = #E9E9E9;">');
		document.write('<img src="ee_menu/images/shim.gif" width="5" height="2" border="0"><span class = "menuLink"><a href="'+subMenu6[i][1]+'">'+subMenu6[i][0]+'<span></a>');
		document.write('</td>');
		document.write('</tr>');

		
		if (i< (mainMenu[x][3]-1))
		{
			document.write('<tr><td><img src = "ee_menu/images/spacer.png"></td></tr>');

		}

		else
		{

			document.write('<tr><td bgcolor = "#E9E9E9" height = 7></td></tr>');

		}
		}

	}


	else

	{
		
		document.write('<tr><td><a href="bla.html">Bla</a></td></tr>');

	}
		
	document.write('</table>');
	document.write('</td>');
	document.write('</tr>');
	document.write('</table>');
	document.write('</div>');
 	document.write('</td>');


  }
  document.write("</tr>");
  document.write("<tr><td colspan = 14 id = linktablebot height = 5></td></tr>");
  document.write("<tr><td colspan = 14 bgcolor = white><img src = ee_menu/images/bottom.png border = 0></td></tr>");
  document.write("</table>");
}


document.onmouseover = hideAllMenusTest;

function showMenuTest(menuNumber, eventObj, labelID) {
    hideAllMenusTest();
	if(document.layers) {
	img = getImage("myImg" + menuNumber);
 	x = getImagePageLeft(img);
 	y = getImagePageTop(img);
 	menuTop = y + 10; // LAYER TOP POSITION
	eval('document.layers["myMenu'+menuNumber+'"].top="'+menuTop+'"');
 	eval('document.layers["myMenu'+menuNumber+'"].left="'+x+'"');
	}
	eventObj.cancelBubble = true;
    var menuId = 'myMenu' + menuNumber;
    if(changeObjectVisibility(menuId, 'visible')) {
	return true;
    } else {
	return false;
    }
}

function hideAllMenusTest() {
    for(counter = 1; counter <= numMenus; counter++) {
	changeObjectVisibility('myMenu' + counter, 'hidden');
    }
}

function getStyleObject(objectId) {
    // cross-browser function to get an object's style object given its id
    if(document.getElementById && document.getElementById(objectId)) {
	// W3C DOM
	return document.getElementById(objectId).style;
    } else if (document.all && document.all(objectId)) {
	// MSIE 4 DOM
	return document.all(objectId).style;
    } else if (document.layers && document.layers[objectId]) {
	// NN 4 DOM.. note: this won't find nested layers
	return document.layers[objectId];
    } else {
	return false;
    }
} 
// getStyleObject

function changeObjectVisibility(objectId, newVisibility) {
    // get a reference to the cross-browser style object and make sure the object exists
    var styleObject = getStyleObject(objectId);
    if(styleObject) {
	styleObject.visibility = newVisibility;
	return true;
    } else {
	//we couldn't find the object, so we can't change its visibility
	return false;
    }
} 
// changeObjectVisibility

function getImagePageLeft(img) {
  var x, obj;
  if (document.layers) {
    if (img.container != null)
      return img.container.pageX + img.x;
    else
      return img.x;
  }
  return -1;
}

function getImagePageTop(img) {
  var y, obj;
  if (document.layers) {
    if (img.container != null)
      return img.container.pageY + img.y;
    else
      return img.y;
  }
  return -1;
}