//
	//	.----------------------------------.
	//		Menu Javascript
	//	*---------------------------------*
	//	
	//	This petty javascript handles onmouseover and onclick events
	//	triggered by the user on the menu arrows.
	//
	
	//	Include event functions:
	include ( "javascripts/event_functions.js" );
	
	//	Include ul menu functions
	include ( "javascripts/ul_menu_functions.js" );
	
	//	Define some global variables
	var imgSrcWhenSubmenuHidden = ""; 
	var imgSrcWhenSubmenuShown = ""; 
	var imgSrcWhenNoSubmenu = "";
	var mainMenuID = ""; 
	var menuEntrySelectedID = "";
	var cssClassOfSelectedMenuEntry = "";
	
	var lastSelectedMenuEntry = null;
	
	//	Set debug to true:
	var DEBUG = true;
	
	function initMenu 	(	aNimgSrcSubmenuShown,
							aNimgSrcSubmenuHidden,
							aNimgSrcNoSubmenu,
							anULMenuID,
							ALISelectedEntryID,
							aCssClassOfSelectedMenuEntry
						)
	{
		//
		//	Initializes the menu. Should be run on page load.
		//
		//	-	imgSrcSubmenuShown:	URL of the image when the submenu is shown
		//	-	imgSrcSubmenuHidden:	URL of the image when the submenu is hidden
		//	-	imgSrcNoSubmenu:	URL of the image when there's no submenu available
		//	-	ulMenuID:			ID of the main menu's <ul>
		//
		
		//	Set some globals:
		mainMenuID = anULMenuID;
		menuEntrySelectedID = ALISelectedEntryID;
		
		imgSrcWhenSubmenuHidden = aNimgSrcSubmenuHidden;
		imgSrcWhenSubmenuShown = aNimgSrcSubmenuShown;
		imgSrcWhenNoSubmenu = aNimgSrcNoSubmenu;
		
		cssClassOfSelectedMenuEntry = aCssClassOfSelectedMenuEntry;
		
		//	Add images recursively to all the menu entries:
		var mainMenu = document.getElementById ( mainMenuID );
		
		if ( DEBUG )
		{
			if ( !mainMenu ) alert ( "The menu javascript could not find the main menu!" );
		}
		
		var mainMenuEntries = getMenuEntriesOf ( mainMenu ); 
		
		for ( var i = 0; i < mainMenuEntries.length; i ++ )
		{
			var mainMenuEntry = mainMenuEntries [ i ];
			
			//	Prepare menu entry and all of its subentries:
			prepareMenuEntry ( mainMenuEntry ); 
		}
		
		//	Select the menu entry which has been selected initially:
		selectMenuEntryWithID ( menuEntrySelectedID );
	}
	
	
	
		
	function getMenuImgOf ( menuEntry )
	{
		//
		//	Returns the arrow / circle image of the corresponding menu entry.
		//
		//	Menu entry should be a <li> node.
		//
		var menuImg = getChildNodesOf ( menuEntry, "img" ) [ 0 ];
		
		return menuImg;
	}
	
	function submenuOfIsHidden ( menuEntry )
	{
		//
		//	Returns true if the submenu of the menu entry is hidden.
		//
		//	menuEntry should be a <li> node.
		//
		submenu = getSubmenuOf ( menuEntry );
		
		return submenu.style.display == "none";	
	}
		
	function hideAllSubmenusOf ( menuEntry )
	{
		//
		//	Hides the submenu and all the sub submenus.
		//
		//	menuEntry argument should be a <li> node.
		//
			
		//	Get the submenu:
		var submenu = getSubmenuOf ( menuEntry );
			
		//	Maybe it doesn't exist?
		if ( submenu )
		{
			//	Get the show/hide submenu image:
			var menuImg = getMenuImgOf ( menuEntry );
		
			//	Turn it to the hidden submenu image:
			menuImg.src = imgSrcWhenSubmenuHidden;

			//	Hide all sub sub menus:
			var menuEntriesOfSubmenu = getMenuEntriesOf ( submenu );
			
			for ( var i = 0; i < menuEntriesOfSubmenu.length; i ++ )
			{
				var menuEntryOfSubmenu = menuEntriesOfSubmenu [ i ];
				
				//	Hide its submenu first:
				hideAllSubmenusOf ( menuEntryOfSubmenu );
			}
			
			//	Now hide the submenu:
			submenu.style.display = "none";
		}
	}
	
	function showSubmenuOf ( menuEntry )
	{
		//
		//	Shows the submenu of the menu entry.
		//
		//	menuEntry argument should be a <li> node.
		//	
		//	Does nothing if there's no submenu!
		//
		
		if ( hasSubmenu ( menuEntry ) )
		{
		
			//	First get the image:
			var menuImg = getMenuImgOf ( menuEntry );
		
			//	Turn it to the hidden submenu image:
			menuImg.src = imgSrcWhenSubmenuShown;
		
			//	Get the submenu:
			var submenu = getSubmenuOf ( menuEntry );
		
			//	Show the submenu:
			submenu.style.display = "";
		}
	}
	
	function prepareMenuEntry ( menuEntry )
	{
		//
		//	Just prepares the menu entry, which should be a <li> node, 
		//	for the usage. 
		//
		
		//	Add an image to the right:
		addMenuImg ( menuEntry );
		
		//	Add link onclick handler:
		addMenuEntryOnLinkClick ( menuEntry );
		
		//	Hide its submenus initially:
		hideAllSubmenusOf ( menuEntry );
	}
	
	function addMenuImg ( menuEntry )
	{
		//
		//	Adds a menu image ( show/hide submenu or neutral if no submenu ) to the 
		//	menu entry and to all the menu entries of the submenu.
		//
		//	menuEntry should be a <li> node.
		//
		
		var submenu = getSubmenuOf ( menuEntry );
		
		var menuImg = new Image();
		
		if ( submenu )
		{
			//	Add source to it:
			menuImg.src = imgSrcWhenSubmenuHidden;
					
			//	Attach an event:
			attachEvent	(	menuImg, 
							"mouseover", 
							handleMenuImgMouseOver, 
							false // useCapture 
						);

			attachEvent	(	menuImg, 
							"mouseout", 
							handleMenuImgMouseOut, 
							false // useCapture 
						);			
						
			attachEvent	(	menuImg, 
							"click", 
							handleMenuImgClick,
							false // useCapture 
						);			
			
			//	Add menu image to all the submenu's entries:
			var submenuEntries = getMenuEntriesOf ( submenu );
			
			for ( var i = 0; i < submenuEntries.length; i ++ )
			{
				addMenuImg ( submenuEntries [ i ] );
			}
		}
		else
		{
			menuImg.src = imgSrcWhenNoSubmenu;
		}
		
		//	Add it as a first child of the menu entry (which is a <li>):
		menuEntry .insertBefore	(	menuImg,
									menuEntry.firstChild
								);		
	}
	
	function addMenuEntryOnLinkClick ( menuEntry )
	{
		//
		//	Adds an onclick event handler to all the links of the menu entry.
		//
		//	menuEntry should be a <li> node.
		//
		//	The function will proceed recursevly if there are submenus.
		//
		
		//	Get links: 
		var links = getChildNodesOf ( menuEntry, "a" );
		
		for ( var i = 0; i < links.length; i ++ )
		{
			var aLink = links [ i ];
			
			//	Add onclick event to the link:
			aLink.onclick = handleMenuLinkOnClick;
			//attachEvent ( aLink, "click", handleMenuLinkOnClick, true );
		}
		
		//	Is there a submenu?
		var submenu = getSubmenuOf ( menuEntry );
		
		if ( submenu )
		{
			var submenuEntries = getMenuEntriesOf ( submenu );
			
			for ( var i = 0; i < submenuEntries.length; i ++ )
			{
				var submenuEntry = submenuEntries [ i ];
				
				//	Proceed recursevly with adding links:
				addMenuEntryOnLinkClick ( submenuEntry );
			}
		}
		
	}
	
	
	function selectMenuEntryWithID ( anID )
	{
		//
		//	Selects the menu entry defined with an ID which should be a string.
		//
		//	Menu entry should be a <li> node!
		//
		var menuEntry = document.getElementById ( anID );
		
		//	Do nothing if the menu entry doesn't exist:
		if ( menuEntry )
		{
			//	find the main menu (which is a <ul> node): 
			var mainMenu = document.getElementById ( mainMenuID );
			
			//	Find all menu entries whose submenus should be shown:
			var menuEntriesToShow = new Array ();
			
			//	Start from the current menu:
			var currentMenu = menuEntry.parentNode;
			
			//	Get the corresponding super menu entry:
			var currenSuperMenuEntry = currentMenu.parentNode;
			
			//	Go all through to the top:
			while ( currentMenu != mainMenu )
			{
				//	Add the current menu to the menuEntriesToShow:
				menuEntriesToShow.push ( currenSuperMenuEntry );
				
				//	Go one level up:
				var currentMenu = currenSuperMenuEntry.parentNode;
			
				//	Get the corresponding super menu entry:
				var currenSuperMenuEntry = currentMenu.parentNode;
			}
			
			//	Show all the menus to be made visible in reverse order
			//	because we started with the highest level:
			for ( var i = menuEntriesToShow.length - 1; i >= 0; i -- )
			{
				showSubmenuOf ( menuEntriesToShow [ i ] );
			}
			
			//	Style it:
			makeMenuEntrySelected ( menuEntry );
			
			//	Show its submenu:
			showSubmenuOf ( menuEntry );
		}
	}
	
	function makeMenuEntrySelected ( menuEntry )
	{
		//
		//	Change the style of the selected menu entry and
		//	undertake all the steps when you want to select it.
		//
	
	
		//	Do we have a last selected menu entry?
		if ( lastSelectedMenuEntry )
		{
			//	Unselect it:
			makeMenuEntryUnselected ( lastSelectedMenuEntry );
		}

		//	Set the last selected menu entry to the new one:
		lastSelectedMenuEntry = menuEntry;
		
		//	Get the links:
		var links = getChildNodesOf ( menuEntry, "a" );
		
		//	Style the links:
		for ( var i = 0; i < links.length; i ++ )
		{
			var aLink = links [ i ];
			
			//	Remember the old style:
			aLink.oldClassName = aLink.className;
			
			//	Set the new one:
			aLink.className = aLink.className + " " + cssClassOfSelectedMenuEntry;	
		}
	}
	
	function makeMenuEntryUnselected ( menuEntry )
	{
		//
		//	Unselects the specified menuEntry
		//
		
		//	Get links:
		var links = getChildNodesOf ( menuEntry, "a" );
		
		for ( var i = 0; i < links.length; i ++ )
		{
			//	Clear the style of the each link:
			var aLink = links [ i ];
			
			//	Does it have an old style?
			if ( aLink.oldClassName )
			{
				aLink.className = aLink.oldClassName;
			}
			else
			{
				//	Just clear the class name because we don't know
				//	what was there before:
				aLink.className = "";
			} 
		}
	}


	//
	//	Event functions:
	//	
	function handleMenuImgClick ( event )
	{
		//
		//	Handles the onClick events on the menu entry image.
		//
		var menuEntryImg = getEventTarget ( event );
		
		//	Get the <li> node:
		menuEntry = menuEntryImg .parentNode;
		
		//	Do we have to show or hide the submenu?
		if ( submenuOfIsHidden ( menuEntry ) )
		{
			//	Show the submenu:
			showSubmenuOf ( menuEntry );
		}
		else
		{
			//	Hide the submenu:
			hideAllSubmenusOf ( menuEntry );
		}
	}
	
	function handleMenuImgMouseOver ( event, data )
	{
		//
		//	Handles the onMouseOver events on the menu entry image.
		//
		var menuEntryImg = getEventTarget ( event );
	
		menuEntryImg .style .cursor = "pointer";
	}

	function handleMenuImgMouseOut ( event )
	{
		//
		//	Handles the onMouseOut events on the menu entry image.
		//
		
		var menuEntryImg = getEventTarget ( event );
		
		menuEntryImg .style .cursor = "auto";
	}	
	
	function handleMenuLinkOnClick ( event )
	{
		//
		//	Handles the click on one of the menu entry's links.
		//

		//	Get the link:
		var link = getEventTarget ( event );
		
		//	Get the menu entry:
		var menuEntry = link.parentNode;
		
		//	Style it:
		makeMenuEntrySelected ( menuEntry );
		
		//	Show its submenu:
		showSubmenuOf ( menuEntry );
	}
	
	//	Include function:
	function include ( script_url ) 
	{
		//
		//	Includes the script. It is not relative, but an absolute url 
		//	or relative to the page's url.
		//
		var head = document.getElementsByTagName ( 'head' ).item(0);
		
		var js = document.createElement ( 'script' );
		js.setAttribute ( 'language', 'javascript');
		js.setAttribute ( 'type', 'text/javascript');
		js.setAttribute ( 'src', script_url );
		
		head.appendChild ( js );
		
		return false;
	}