/////////////////////////////////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////////////////////////////////
////	
////	NOTIONAL MENU DROPDOWN TOGGLE
////
////	This script searches the document for items that meet certain criteria for
////	dropdown menus.  It then applies mouseover and mouseout (plus mouseenter 
////	and mouseleave) events to control the dropdowns.
////
////	USAGE:
////
////	Once rendered, the HTML document must link this document and then must contain 3
////	correctly named elements to work:
////	- Anchors that serve as the notional pages, with a class ending in -TopMenuItem, with an id of:
////		<!--xNOTIONAL_UNIQUE_LINK_NAMEx-->,true,-8,22,0,0
////		Which correlates to the Notional Link CICMS, whether it's a top level item, 
////		its x offset, its y offset, its IE x offset and its IE y offset
////	- An object (img or div typically) whose class ends with -MenuItem and with an id of:
////		<!--xNOTIONAL_UNIQUE_LINK_NAMEx-->Img
////	- Generated dropdowns from CICMS whose class ends with -DropdownItem whose id is:
////		<!--xNOTIONAL_UNIQUE_NAMEx-->Div
////
/////////////////////////////////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////////////////////////////////

// The y offset applied to all flyout (not dropdown) menus
var flyoutMenuYOffset = 0;

$(document).ready(function()
{
	var clearMenus = "";
	var menuVars = "";
	var obj; var marker;
	var activeMenus = ""; // Stores the menus that are currently active
	//$("#debug").html($("#debug").html() + " " + left);

	// Event: When a menu item is rolled over, check it's id and move potential
	// dropdown menus to the appropriate location
	$("[class$='MenuItem']").mouseover(
	function()
	{
		// Stop the menus clearing if they've been set to clear
		//if (typeof( window[ 'clearMenus' ] ) != "undefined") { clearTimeout(clearMenus); }
		
		// Split the id into its variables
		var oldMenuVars = menuVars;
		var menuVars = $(this).attr("id").split(",");
		
		if (menuVars[0] == "") { menuVars = oldMenuVars; return false; }
		
		// Set the dropdown and menu objects
		obj = $("#" + menuVars[0] + "Div");
		marker = $("#" + menuVars[0] + "Pos");

		$(obj).prependTo(marker);
		
		$(marker).css("overflow","visible");
		$(marker).css("position","relative");
		
		// IE6 Hack: attach IE6Hover class to markers and make them remove that class when rolled out
		/*if ($(marker).attr("class").search("IE6Hover") == -1) 
		{
			$(marker).attr("class","IE6Hover " + $(marker).attr("class"));
			alert("Attach: " + $(marker).attr("class"));
			$(marker).mouseleave(function()
			{
				if ($(this).attr("class").search("IE6Hover") != -1 && $(this).find(":nth-child(1)").attr("class").search("TopMenuItem") == -1) 
				{
					alert("Remove: " + $(this).attr("class"));
					$(this).attr("class", $(this).attr("class").substr(9, $(this).attr("class").length));
					alert("Remove: " + $(this).attr("class"));
				}
			});
		}*/

		$(obj).css("position","absolute");
		
		// If it is a top level menu item then add the height of the button
		// else add the width of the button and a global yOffset
		if (menuVars[1] == "true")
		{
			var top = $(marker).height();
			$(obj).css("top",top + "px");
			$(obj).css("left", "0px");
		} else {
			var left = $(marker).width();
			$(obj).css("left",left + "px");
			$(obj).css("top", flyoutMenuYOffset + "px");
		}
	});
	
	
	$("li").hover(function()
	{
		$(this).children("ul").addClass('IE6Hover');
	},
	function()
	{
		$(this).children("ul").removeClass('IE6Hover');
	});	
	
	
	/*$("[class$='TopMenuItem']").mouseleave(
	function()
	{
		$("#debug").html($("#debug").html() + " toggle1 ");
		$("[class$='DropdownMenu']").css("display","none");
		$("#debug").html($("#debug").html() + " toggle2 ");
	});
	
	
	// Make sure that dropdown menus remain in place
	$("[class$='DropdownMenu']").mouseover(
	function()
	{
		$("#debug").html($("#debug").html() + " in ");
		//clearTimeout(clearMenus);
		//$(this).css("display","block");
	});
	
	
	
	$("[class$='DropdownMenu']").mouseleave(
	function()
	{
		$("#debug").html($("#debug").html() + " out ");
		$(this).css("display","none");
	});*/

	
	
	$("#debug").click(function()
	{
		$("#debug").html("");	
	});
	
});