/************************************************/
/* Javascript Behaviour for the TopMenu control */
/* Requires JQuery 1.3			                */
/************************************************/

var menuVariables = 
{
	//the interval id of the timeout method that will be called when the current link should be selected
	currentLinkTimeoutId : 0,

	// the delay after moving off a menu item before the current link should be selected.
	selectDelay : 1000,

	// the last final position of the animated menu bar
	lastMenuXOffset : 0,

	// the element id of the last selected secondary menu item
	lastSubItemMenuId : '',

	// the element id of the container with the primary menu items
	primaryMenuContainerId : '', /* must set in the code behind */

	// the element id of the container with the secondary menu items
	subMenuContainerId : '' /* must set in the code behind */
};

function addMenuHoverClass(menuItemId)
{
	jQuery('#' + menuItemId)
		.parent()
		.children('a')
		.removeClass('MenuItemHover')
		.filter('#' + menuItemId)
		.addClass('MenuItemHover');
}

function removeMenuHoverClass(menuItemId)
{
	//default unhighlight link if it is not a primary menu item.
	if (!jQuery('#' + menuItemId).hasClass('TopPrimaryMenuItem'))
	{
		jQuery('#' + menuItemId).removeClass('MenuItemHover');
	}

	//the current link must be selected after a short delay
	menuVariables.currentLinkTimeoutId = window.setTimeout(selectCurrentLink, menuVariables.selectDelay);
}

// Makes sub menu for the highlighted top menu item visible
function showSubMenu(selectedMenuId)
{
	if (!selectedMenuId || selectedMenuId === '')
	{
		return;
	}

	//before selecting a different menu item, all menu selection timeouts must be cleared
	window.clearTimeout(menuVariables.currentLinkTimeoutId);

	var $selectedMenuItem = jQuery('#' + selectedMenuId);
	var menuOffset = $selectedMenuItem.position().left - $selectedMenuItem.parent().position().left;

	// hide all other submenus
	var $subContainer = jQuery('#' + menuVariables.subMenuContainerId);    
	$subContainer.children('div').each(function(i)
	{
		var subMenuName = '';
		if($selectedMenuItem[0].getAttribute('submenuid'))
		{
			subMenuName = $selectedMenuItem[0].getAttribute('submenuid');
		}

		if(this.id == subMenuName)
		{
			jQuery(this).css('display', ''); // jquery show() was not working in safari 2
			jQuery(this).css('padding-left', menuOffset + 'px');
		}
		else
		{
			jQuery(this).css('display', 'none'); // jquery hide() was not working in safari 2
		}
	});

	//show and position the submenu
	addMenuHoverClass(selectedMenuId);

	//move the bar in the middle to the corresponding top menu item.
	moveMainBar(menuOffset);
	jQuery('#SubBarContainerDiv').fadeOut(500);
	menuVariables.lastSubItemMenuId = '';
}

//highlights the sub menu item, and animates the menu bar
function highlightSubMenuItem(selectedMenuId)
{
	//before selecting a different menu item, all menu selection timeouts must be cleared
	window.clearInterval(menuVariables.currentLinkTimeoutId);

	addMenuHoverClass(selectedMenuId);

	var $subMenuItem = jQuery('#' + selectedMenuId);
	var $subBarContainerDiv = jQuery('#SubBarContainerDiv');

	var subBarOffset = $subMenuItem.position().left - $subMenuItem.parent().position().left - menuVariables.lastMenuXOffset;

	if (menuVariables.lastSubItemMenuId != selectedMenuId)
	{
		$subBarContainerDiv.fadeIn(300);
		menuVariables.lastSubItemMenuId = selectedMenuId;
		$subBarContainerDiv.animate(
			{
				paddingLeft : subBarOffset + 'px',
				width : $subMenuItem.width() + 'px'
			}, 
			{
				duration: 500,
				queue: false,
				easing : 'swing'
			});
	}
}

function moveMainBar(xOffset)
{
	var $barContainerDiv = jQuery('#BarContainerDiv');
	if (menuVariables.lastMenuXOffset != xOffset)
	{
		$barContainerDiv.stop();
		menuVariables.lastMenuXOffset = xOffset;
		$barContainerDiv.animate({ paddingLeft : xOffset + 'px' }, 500, 'swing');
	}
}

//sets the selected menu item, and sets the timeout function for always reverting back to it.
function setCurrentLink(menuItemId)
{
	menuVariables.currentMenuItemId = menuItemId;
	selectCurrentLink();
}

// the function that actually locates and selects the link
function selectCurrentLink()
{
	var $currentMenuItem = jQuery('#' + menuVariables.currentMenuItemId);

	//the menu item is a secondary  menu item if it is in the secondary menu container.
	var $subMenuContainer = jQuery('#' + menuVariables.subMenuContainerId);
	if ($subMenuContainer.find('#' + menuVariables.currentMenuItemId).length > 0)
	{
		
		// the corresponding primary menu item is calculated by finding out which element in the primary menu container
		// has a submenuid attribute with the name of the sub menu container of the current menu item
		var primaryElementExpression = 'a[submenuid="' + $currentMenuItem.parent()[0].id + '"]';
		var $primaryMenuItem = jQuery(primaryElementExpression);
		
		//the primary and secondary menu can now be selected.
		showSubMenu($primaryMenuItem[0].id);
		highlightSubMenuItem(menuVariables.currentMenuItemId);
	}
	else
	{
		//it is a primary menu item
		showSubMenu(menuVariables.currentMenuItemId);
	}
}