/**
 * Initializes the menu bar behaviour and events
 */
function setMenuBar()
{
	//-------------------------------------------------------------------------
	// if no menu bar is available exit here
	//-------------------------------------------------------------------------
	if (!$('MenuBar1'))
	{
		return;
	}
	
	var menuBarItems = $('MenuBar1').getChildren();
	
	//-------------------------------------------------------------------------
	// assign the event functions to the menu items (see below)
	//-------------------------------------------------------------------------
	menuBarItems.each( function( menuBarItem )
	{
		menuBarItem.addEvent("mouseenter", hoverMenuItem);
	
		menuBarItem.addEvent("mouseleave", resumeMenuItem);

	});
	
}

/*
 *-----------------------------------------------------------------------------
 * this is executed every time when a menu item is hovered (mouse over)
 *-----------------------------------------------------------------------------
 */
function hoverMenuItem(  )
{
	
	var subMenu = this.getChildren("ul");
	if ( subMenu.length == 0 ) return;	
	subMenu[0].style.display = "block";
}

/*
 *-----------------------------------------------------------------------------
 * this is executed every time when a menu item is left (mouse leave)
 *-----------------------------------------------------------------------------
 */
function resumeMenuItem(  )
{
	var subMenu = this.getChildren("ul");
	if ( subMenu.length == 0 ) return;	
	subMenu[0].style.display = "none";
}


//-------------------------------------------------------------------------
// execute the "setMenuBar" function as soon as the DOM tree is ready
// (this maximizes the browser compatibility; always use this instead of
// the native "onload" browser event)
//-------------------------------------------------------------------------
window.addEvent('domready', function() 
{
    setMenuBar();
});