var oMenu = new menu();
var oGroup;
var gTO = 0;
var gShowingSOptions = "";

/*********************************************************/
/* Menu Configuration ************************************/

oGroup = new menuGroup("The Mission", "");			
oGroup.addItem("Who We Are", "");
oGroup.addItem("News", "");
oGroup.addItem("History", "");
oGroup.addItem("Annual Report", "");
oMenu.addGroup(oGroup);

oGroup = new menuGroup("Emergency Services", "");
oGroup.addItem("Meal Program", "");
oGroup.addItem("Hospice", "");
oGroup.addItem("Shelter", "");
oGroup.addItem("Medical Clinic", "");
oGroup.addItem("Dental Clinic", "");
oMenu.addGroup(oGroup);

oGroup = new menuGroup("Client Services", "");
oGroup.addItem("Education & Training", "");
oGroup.addItem("Housing Services", "");
oGroup.addItem("Addiction Counselling", "");
oGroup.addItem("Pastoral Care", "");
oGroup.addItem("Public Health", "");
oGroup.addItem("Referral Service", "");
oGroup.addItem("Life Skills Training", "");
oMenu.addGroup(oGroup);

oGroup = new menuGroup("Giving", "?q=Donate");
oGroup.addItem("Gift Catalogue", "");
oGroup.addItem("Volunteers", "");
oGroup.addItem("Donations", "?q=Donate");
oGroup.addItem("Legacy Giving", "?q=Fund");
oGroup.addItem("Tribute Donation", "?q=Donate/Tribute");
oGroup.addItem("Memorial Donation", "?q=Donate/Memorial");
oMenu.addGroup(oGroup);

oGroup = new menuGroup("Calendar", "");
oGroup.addItem("Coming Events", "");
oMenu.addGroup(oGroup);

oGroup = new menuGroup("Information", "");
oGroup.addItem("Contact", "");
oGroup.addItem("Media Room", "");
oGroup.addItem("Student Resources", "");
oGroup.addItem("Privacy Policy", "");
oMenu.addGroup(oGroup);

/* End Menu Configuration ********************************/
/*********************************************************/

function menu()
{
	this.aGroup = [];
	this.width = 600;
	
	this.addGroup = function (oGroup)
	{
		this.aGroup[this.aGroup.length] = oGroup;
	}
	
	this.render = function ()
	{
		var out = ""; // html to render
		var groupWidth = this.width / this.aGroup.length;
		
		out += "<div class='menuBar'>";
				
		for(var i = 0; i < this.aGroup.length; i++)
		{			
			out += this.aGroup[i].render(i, groupWidth);
		}
		
		out += "</div>";
		
		document.write(out);
	}
}

function menuGroup(text, url)
{
	this.text = text;
	this.url = url;
	this.aItem = [];
	this.isSelected = false;
	
	var currentUrl = getFilenameFromPath(window.location.pathname);
	var groupUrl = getFilenameFromPath(url);				
	if(currentUrl == groupUrl) this.isSelected = true;							
	
	this.addItem = function (text, url)
	{
		this.aItem[this.aItem.length] = new menuItem(text, url);
	}
	
	this.render = function (id, width)
	{
		var out = ""; // html to render
				
		out += "\n<div class='menuHeader' onMouseOver='expand(\"" + id + "\"); this.className=\"menuHeaderHover\"' onMouseOut='collapse(\"" + id + "\"); this.className=\"menuHeader\"' onClick='window.location=\"" + url + "\"'>"; 	
		
		// Group Header
		out += "<div id='menuHeader_" + id + "' class='menuHeaderText'>" + text + "</div>"; 
		
				
		out += "\n<div style='position: relative;'><div id='div_" + id + "' style='position:absolute; display:none;'>";		
		
		// Group Items	
		for(var i = 0; i < this.aItem.length; i++)
		{
			out += this.aItem[i].render(id);
		}
		out += "\n</div></div>"; // div_id / relative
		out += "\n</div>"; // menuHeader
		return out;
	}
	
}	

function menuItem(text, url)
{
	this.text = text;
	this.url = url;
	
	this.render = function (id)
	{
		var out = "";														
		out += "\n<div class='menuItem' onMouseOver='this.className=\"menuItemHover\"' onMouseOut='this.className=\"menuItem\"' onClick='window.location=\"" + url + "\"'>" + text + "</div>";
		return out;
	}
}	

function getFilenameFromPath(s)
{
	var lastslash = s.lastIndexOf('/');
	return s.substr(lastslash + 1);				
}

function expand(id)
{	
	var divid = "div_" + id;
	var menuHeaderId = "menuHeader_" + id;
	
	_collapse(gShowingSOptions);		
	gShowingSOptions = id;		
	if(obj = document.getElementById(divid))
	{
		obj.style.display = 'block';				
	}	
	if(obj = document.getElementById(menuHeaderId))
	{
		obj.className = 'menuHeaderTextHover';				
	}		
	if(gTO > 0) 
	{	
		window.clearTimeout(gTO);
	}
}

function collapse(id)
{
	gTO = window.setTimeout("_collapse(" + id + ")", 1000);
}

function _collapse(id)
{
	var divid = "div_" + id;
	var menuHeaderId = "menuHeader_" + id;
	
	if(obj = document.getElementById(divid))
	{					
		obj.style.display = 'none';					
	}
	if(obj = document.getElementById(menuHeaderId))
	{
		obj.className = 'menuHeaderText';				
	}	
}