@canonical/yui 3.18.2-pre

package/build/node-menunav/node-menunav.js

@@ -0,0 +1,2188 @@
+YUI.add('node-menunav', function (Y, NAME) {
+
+/**
+* <p>The MenuNav Node Plugin makes it easy to transform existing list-based
+* markup into traditional, drop down navigational menus that are both accessible
+* and easy to customize, and only require a small set of dependencies.</p>
+*
+*
+* <p>To use the MenuNav Node Plugin, simply pass a reference to the plugin to a
+* Node instance's <code>plug</code> method.</p>
+*
+* <p>
+* <code>
+* &#60;script type="text/javascript"&#62; <br>
+* <br>
+* 		//	Call the "use" method, passing in "node-menunav".  This will <br>
+* 		//	load the script and CSS for the MenuNav Node Plugin and all of <br>
+* 		//	the required dependencies. <br>
+* <br>
+* 		YUI().use("node-menunav", function(Y) { <br>
+* <br>
+* 			//	Use the "contentready" event to initialize the menu when <br>
+* 			//	the subtree of element representing the root menu <br>
+* 			//	(&#60;div id="menu-1"&#62;) is ready to be scripted. <br>
+* <br>
+* 			Y.on("contentready", function () { <br>
+* <br>
+* 				//	The scope of the callback will be a Node instance <br>
+* 				//	representing the root menu (&#60;div id="menu-1"&#62;). <br>
+* 				//	Therefore, since "this" represents a Node instance, it <br>
+* 				//	is possible to just call "this.plug" passing in a <br>
+*				//	reference to the MenuNav Node Plugin. <br>
+* <br>
+* 				this.plug(Y.Plugin.NodeMenuNav); <br>
+* <br>
+* 			}, "#menu-1"); <br>
+* <br>
+* 		}); <br>
+* <br>
+* 	&#60;/script&#62; <br>
+* </code>
+* </p>
+*
+* <p>The MenuNav Node Plugin has several configuration properties that can be
+* set via an object literal that is passed as a second argument to a Node
+* instance's <code>plug</code> method.
+* </p>
+*
+* <p>
+* <code>
+* &#60;script type="text/javascript"&#62; <br>
+* <br>
+* 		//	Call the "use" method, passing in "node-menunav".  This will <br>
+* 		//	load the script and CSS for the MenuNav Node Plugin and all of <br>
+* 		//	the required dependencies. <br>
+* <br>
+* 		YUI().use("node-menunav", function(Y) { <br>
+* <br>
+* 			//	Use the "contentready" event to initialize the menu when <br>
+* 			//	the subtree of element representing the root menu <br>
+* 			//	(&#60;div id="menu-1"&#62;) is ready to be scripted. <br>
+* <br>
+* 			Y.on("contentready", function () { <br>
+* <br>
+* 				//	The scope of the callback will be a Node instance <br>
+* 				//	representing the root menu (&#60;div id="menu-1"&#62;). <br>
+* 				//	Therefore, since "this" represents a Node instance, it <br>
+* 				//	is possible to just call "this.plug" passing in a <br>
+*				//	reference to the MenuNav Node Plugin. <br>
+* <br>
+* 				this.plug(Y.Plugin.NodeMenuNav, { mouseOutHideDelay: 1000 });
+* <br><br>
+* 			}, "#menu-1"); <br>
+* <br>
+* 		}); <br>
+* <br>
+* 	&#60;/script&#62; <br>
+* </code>
+* </p>
+*
+DEPRECATED. The MenuNav Node Plugin has been deprecated as of YUI 3.9.0. This module will be removed from the library in a future version. If you require functionality similar to the one provided by this module, consider taking a look at the various modules in the YUI Gallery <http://yuilibrary.com/gallery/>.
+
+@module node-menunav
+@deprecated 3.9.0
+*/
+
+
+	//	Util shortcuts
+
+var UA = Y.UA,
+	later = Y.later,
+	getClassName = Y.ClassNameManager.getClassName,
+
+
+
+	//	Frequently used strings
+
+	MENU = "menu",
+	MENUITEM = "menuitem",
+	HIDDEN = "hidden",
+	PARENT_NODE = "parentNode",
+	CHILDREN = "children",
+	OFFSET_HEIGHT = "offsetHeight",
+	OFFSET_WIDTH = "offsetWidth",
+	PX = "px",
+	ID = "id",
+	PERIOD = ".",
+	HANDLED_MOUSEOUT = "handledMouseOut",
+	HANDLED_MOUSEOVER = "handledMouseOver",
+	ACTIVE = "active",
+	LABEL = "label",
+	LOWERCASE_A = "a",
+	MOUSEDOWN = "mousedown",
+	KEYDOWN = "keydown",
+	CLICK = "click",
+	EMPTY_STRING = "",
+	FIRST_OF_TYPE = "first-of-type",
+	ROLE = "role",
+	PRESENTATION = "presentation",
+	DESCENDANTS = "descendants",
+	UI = "UI",
+	ACTIVE_DESCENDANT = "activeDescendant",
+	USE_ARIA = "useARIA",
+	ARIA_HIDDEN = "aria-hidden",
+	CONTENT = "content",
+	HOST = "host",
+	ACTIVE_DESCENDANT_CHANGE = ACTIVE_DESCENDANT + "Change",
+
+
+	//	Attribute keys
+
+	AUTO_SUBMENU_DISPLAY = "autoSubmenuDisplay",
+	MOUSEOUT_HIDE_DELAY = "mouseOutHideDelay",
+
+
+	//	CSS class names
+
+	CSS_MENU = getClassName(MENU),
+	CSS_MENU_HIDDEN = getClassName(MENU, HIDDEN),
+	CSS_MENU_HORIZONTAL = getClassName(MENU, "horizontal"),
+	CSS_MENU_LABEL = getClassName(MENU, LABEL),
+	CSS_MENU_LABEL_ACTIVE = getClassName(MENU, LABEL, ACTIVE),
+	CSS_MENU_LABEL_MENUVISIBLE = getClassName(MENU, LABEL, (MENU + "visible")),
+	CSS_MENUITEM = getClassName(MENUITEM),
+	CSS_MENUITEM_ACTIVE = getClassName(MENUITEM, ACTIVE),
+
+
+	//	CSS selectors
+
+	MENU_SELECTOR = PERIOD + CSS_MENU,
+	MENU_TOGGLE_SELECTOR = (PERIOD + getClassName(MENU, "toggle")),
+    MENU_CONTENT_SELECTOR = PERIOD + getClassName(MENU, CONTENT),
+    MENU_LABEL_SELECTOR = PERIOD + CSS_MENU_LABEL,
+
+	STANDARD_QUERY = ">" + MENU_CONTENT_SELECTOR + ">ul>li>a",
+	EXTENDED_QUERY = ">" + MENU_CONTENT_SELECTOR + ">ul>li>" + MENU_LABEL_SELECTOR + ">a:first-child";
+
+//	Utility functions
+
+
+var getPreviousSibling = function (node) {
+
+	var oPrevious = node.previous(),
+		oChildren;
+
+	if (!oPrevious) {
+		oChildren = node.get(PARENT_NODE).get(CHILDREN);
+		oPrevious = oChildren.item(oChildren.size() - 1);
+	}
+
+
+	return oPrevious;
+
+};
+
+
+var getNextSibling = function (node) {
+
+	var oNext = node.next();
+
+	if (!oNext) {
+		oNext = node.get(PARENT_NODE).get(CHILDREN).item(0);
+	}
+
+	return oNext;
+
+};
+
+
+var isAnchor = function (node) {
+
+	var bReturnVal = false;
+
+	if (node) {
+		bReturnVal = node.get("nodeName").toLowerCase() === LOWERCASE_A;
+	}
+
+	return bReturnVal;
+
+};
+
+
+var isMenuItem = function (node) {
+
+	return node.hasClass(CSS_MENUITEM);
+
+};
+
+
+var isMenuLabel = function (node) {
+
+	return node.hasClass(CSS_MENU_LABEL);
+
+};
+
+
+var isHorizontalMenu = function (menu) {
+
+	return menu.hasClass(CSS_MENU_HORIZONTAL);
+
+};
+
+
+var hasVisibleSubmenu = function (menuLabel) {
+
+	return menuLabel.hasClass(CSS_MENU_LABEL_MENUVISIBLE);
+
+};
+
+
+var getItemAnchor = function (node) {
+
+	return isAnchor(node) ? node : node.one(LOWERCASE_A);
+
+};
+
+
+var getNodeWithClass = function (node, className, searchAncestors) {
+
+	var oItem;
+
+	if (node) {
+
+		if (node.hasClass(className)) {
+			oItem = node;
+		}
+
+		if (!oItem && searchAncestors) {
+			oItem = node.ancestor((PERIOD + className));
+		}
+
+	}
+
+	return oItem;
+
+};
+
+
+var getParentMenu = function (node) {
+
+	return node.ancestor(MENU_SELECTOR);
+
+};
+
+
+var getMenu = function (node, searchAncestors) {
+
+	return getNodeWithClass(node, CSS_MENU, searchAncestors);
+
+};
+
+
+var getMenuItem = function (node, searchAncestors) {
+
+	var oItem;
+
+	if (node) {
+		oItem = getNodeWithClass(node, CSS_MENUITEM, searchAncestors);
+	}
+
+	return oItem;
+
+};
+
+
+var getMenuLabel = function (node, searchAncestors) {
+
+	var oItem;
+
+	if (node) {
+
+		if (searchAncestors) {
+			oItem = getNodeWithClass(node, CSS_MENU_LABEL, searchAncestors);
+		}
+		else {
+			oItem = getNodeWithClass(node, CSS_MENU_LABEL) ||
+				node.one((PERIOD + CSS_MENU_LABEL));
+		}
+
+	}
+
+	return oItem;
+
+};
+
+
+var getItem = function (node, searchAncestors) {
+
+	var oItem;
+
+	if (node) {
+		oItem = getMenuItem(node, searchAncestors) ||
+			getMenuLabel(node, searchAncestors);
+	}
+
+	return oItem;
+
+};
+
+
+var getFirstItem = function (menu) {
+
+	return getItem(menu.one("li"));
+
+};
+
+
+var getActiveClass = function (node) {
+
+	return isMenuItem(node) ? CSS_MENUITEM_ACTIVE : CSS_MENU_LABEL_ACTIVE;
+
+};
+
+
+var handleMouseOverForNode = function (node, target) {
+
+	return node && !node[HANDLED_MOUSEOVER] &&
+		(node.compareTo(target) || node.contains(target));
+
+};
+
+
+var handleMouseOutForNode = function (node, relatedTarget) {
+
+	return node && !node[HANDLED_MOUSEOUT] &&
+		(!node.compareTo(relatedTarget) && !node.contains(relatedTarget));
+
+};
+
+/**
+* The NodeMenuNav class is a plugin for a Node instance.  The class is used via
+* the <a href="Node.html#method_plug"><code>plug</code></a> method of Node and
+* should not be instantiated directly.
+* @namespace plugin
+* @class NodeMenuNav
+*/
+var NodeMenuNav = function () {
+
+	NodeMenuNav.superclass.constructor.apply(this, arguments);
+
+};
+
+NodeMenuNav.NAME = "nodeMenuNav";
+NodeMenuNav.NS = "menuNav";
+
+
+/**
+* @property SHIM_TEMPLATE_TITLE
+* @description String representing the value for the <code>title</code>
+* attribute for the shim used to prevent <code>&#60;select&#62;</code> elements
+* from poking through menus in IE 6.
+* @default "Menu Stacking Shim"
+* @type String
+*/
+NodeMenuNav.SHIM_TEMPLATE_TITLE = "Menu Stacking Shim";
+
+
+/**
+* @property SHIM_TEMPLATE
+* @description String representing the HTML used to create the
+* <code>&#60;iframe&#62;</code> shim used to prevent
+* <code>&#60;select&#62;</code> elements from poking through menus in IE 6.
+* @default &#34;&#60;iframe frameborder=&#34;0&#34; tabindex=&#34;-1&#34;
+* class=&#34;yui-shim&#34; title=&#34;Menu Stacking Shim&#34;
+* src=&#34;javascript:false;&#34;&#62;&#60;/iframe&#62;&#34;
+* @type String
+*/
+
+//	<iframe> shim notes:
+//
+//	1) Need to set the "frameBorder" property to 0 to suppress the default
+//	<iframe> border in IE.  (Setting the CSS "border" property alone doesn't
+//	suppress it.)
+//
+//	2) The "src" attribute of the <iframe> is set to "javascript:false;" so
+//	that it won't load a page inside it, preventing the secure/nonsecure
+//	warning in IE when using HTTPS.
+//
+//	3) Since the role of the <iframe> shim is completely presentational, its
+//	"tabindex" attribute is set to "-1" and its title attribute is set to
+//	"Menu Stacking Shim".  Both strategies help users of screen readers to
+//	avoid mistakenly interacting with the <iframe> shim.
+
+NodeMenuNav.SHIM_TEMPLATE = '<iframe frameborder="0" tabindex="-1" class="' +
+							getClassName("shim") +
+							'" title="' + NodeMenuNav.SHIM_TEMPLATE_TITLE +
+							'" src="javascript:false;"></iframe>';
+
+
+NodeMenuNav.ATTRS = {
+
+	/**
+	* Boolean indicating if use of the WAI-ARIA Roles and States should be
+	* enabled for the menu.
+	*
+	* @attribute useARIA
+	* @readOnly
+	* @writeOnce
+	* @default true
+	* @type boolean
+	*/
+	useARIA: {
+
+		value: true,
+		writeOnce: true,
+		lazyAdd: false,
+		setter: function (value) {
+
+			var oMenu = this.get(HOST),
+				oMenuLabel,
+				oMenuToggle,
+				oSubmenu,
+				sID;
+
+			if (value) {
+
+				oMenu.set(ROLE, MENU);
+
+				oMenu.all("ul,li," + MENU_CONTENT_SELECTOR).set(ROLE, PRESENTATION);
+
+				oMenu.all((PERIOD + getClassName(MENUITEM, CONTENT))).set(ROLE, MENUITEM);
+
+				oMenu.all((PERIOD + CSS_MENU_LABEL)).each(function (node) {
+
+					oMenuLabel = node;
+					oMenuToggle = node.one(MENU_TOGGLE_SELECTOR);
+
+					if (oMenuToggle) {
+						oMenuToggle.set(ROLE, PRESENTATION);
+						oMenuLabel = oMenuToggle.previous();
+					}
+
+					oMenuLabel.set(ROLE, MENUITEM);
+					oMenuLabel.set("aria-haspopup", true);
+
+					oSubmenu = node.next();
+
+					if (oSubmenu) {
+
+						oSubmenu.set(ROLE, MENU);
+
+						oMenuLabel = oSubmenu.previous();
+						oMenuToggle = oMenuLabel.one(MENU_TOGGLE_SELECTOR);
+
+						if (oMenuToggle) {
+							oMenuLabel = oMenuToggle;
+						}
+
+						sID = Y.stamp(oMenuLabel);
+
+						if (!oMenuLabel.get(ID)) {
+							oMenuLabel.set(ID, sID);
+						}
+
+						oSubmenu.set("aria-labelledby", sID);
+						oSubmenu.set(ARIA_HIDDEN, true);
+
+					}
+
+				});
+
+			}
+
+		}
+
+	},
+
+
+	/**
+	* Boolean indicating if submenus are automatically made visible when the
+	* user mouses over the menu's items.
+	*
+	* @attribute autoSubmenuDisplay
+	* @readOnly
+	* @writeOnce
+	* @default true
+	* @type boolean
+	*/
+	autoSubmenuDisplay: {
+
+		value: true,
+		writeOnce: true
+
+	},
+
+
+	/**
+	* Number indicating the time (in milliseconds) that should expire before a
+	* submenu is made visible when the user mouses over the menu's label.
+	*
+	* @attribute submenuShowDelay
+	* @readOnly
+	* @writeOnce
+	* @default 250
+	* @type Number
+	*/
+	submenuShowDelay: {
+
+		value: 250,
+		writeOnce: true
+
+	},
+
+
+	/**
+	* Number indicating the time (in milliseconds) that should expire before a
+	* submenu is hidden when the user mouses out of a menu label heading in the
+	* direction of a submenu.
+	*
+	* @attribute submenuHideDelay
+	* @readOnly
+	* @writeOnce
+	* @default 250
+	* @type Number
+	*/
+	submenuHideDelay: {
+
+		value: 250,
+		writeOnce: true
+
+	},
+
+
+	/**
+	* Number indicating the time (in milliseconds) that should expire before a
+	* submenu is hidden when the user mouses out of it.
+	*
+	* @attribute mouseOutHideDelay
+	* @readOnly
+	* @writeOnce
+	* @default 750
+	* @type Number
+	*/
+	mouseOutHideDelay: {
+
+		value: 750,
+		writeOnce: true
+
+	}
+
+};
+
+
+Y.extend(NodeMenuNav, Y.Plugin.Base, {
+
+	//	Protected properties
+
+	/**
+	* @property _rootMenu
+	* @description Node instance representing the root menu in the menu.
+	* @default null
+	* @protected
+	* @type Node
+	*/
+	_rootMenu: null,
+
+
+	/**
+	* @property _activeItem
+	* @description Node instance representing the menu's active descendent:
+	* the menuitem or menu label the user is currently interacting with.
+	* @default null
+	* @protected
+	* @type Node
+	*/
+	_activeItem: null,
+
+
+	/**
+	* @property _activeMenu
+	* @description Node instance representing the menu that is the parent of
+	* the menu's active descendent.
+	* @default null
+	* @protected
+	* @type Node
+	*/
+	_activeMenu: null,
+
+
+	/**
+	* @property _hasFocus
+	* @description Boolean indicating if the menu has focus.
+	* @default false
+	* @protected
+	* @type Boolean
+	*/
+	_hasFocus: false,
+
+
+	//	In gecko-based browsers a mouseover and mouseout event will fire even
+	//	if a DOM element moves out from under the mouse without the user
+	//	actually moving the mouse.  This bug affects NodeMenuNav because the
+	//	user can hit the Esc key to hide a menu, and if the mouse is over the
+	//	menu when the user presses Esc, the _onMenuMouseOut handler will be
+	//	called.  To fix this bug the following flag (_blockMouseEvent) is used
+	// to block the code in the _onMenuMouseOut handler from executing.
+
+	/**
+	* @property _blockMouseEvent
+	* @description Boolean indicating whether or not to handle the
+	* "mouseover" event.
+	* @default false
+	* @protected
+	* @type Boolean
+	*/
+	_blockMouseEvent: false,
+
+
+	/**
+	* @property _currentMouseX
+	* @description Number representing the current x coordinate of the mouse
+	* inside the menu.
+	* @default 0
+	* @protected
+	* @type Number
+	*/
+	_currentMouseX: 0,
+
+
+	/**
+	* @property _movingToSubmenu
+	* @description Boolean indicating if the mouse is moving from a menu
+	* label to its corresponding submenu.
+	* @default false
+	* @protected
+	* @type Boolean
+	*/
+	_movingToSubmenu: false,
+
+
+	/**
+	* @property _showSubmenuTimer
+	* @description Timer used to show a submenu.
+	* @default null
+	* @protected
+	* @type Object
+	*/
+	_showSubmenuTimer: null,
+
+
+	/**
+	* @property _hideSubmenuTimer
+	* @description Timer used to hide a submenu.
+	* @default null
+	* @protected
+	* @type Object
+	*/
+	_hideSubmenuTimer: null,
+
+
+	/**
+	* @property _hideAllSubmenusTimer
+	* @description Timer used to hide a all submenus.
+	* @default null
+	* @protected
+	* @type Object
+	*/
+	_hideAllSubmenusTimer: null,
+
+
+	/**
+	* @property _firstItem
+	* @description Node instance representing the first item (menuitem or menu
+	* label) in the root menu of a menu.
+	* @default null
+	* @protected
+	* @type Node
+	*/
+	_firstItem: null,
+
+
+	//	Public methods
+
+
+    initializer: function (config) {
+
+		var menuNav = this,
+			oRootMenu = this.get(HOST),
+			aHandlers = [],
+			oDoc;
+
+
+		if (oRootMenu) {
+
+			menuNav._rootMenu = oRootMenu;
+
+			oRootMenu.all("ul:first-child").addClass(FIRST_OF_TYPE);
+
+			//	Hide all visible submenus
+
+			oRootMenu.all(MENU_SELECTOR).addClass(CSS_MENU_HIDDEN);
+
+
+			//	Wire up all event handlers
+
+			aHandlers.push(oRootMenu.on("mouseover", menuNav._onMouseOver, menuNav));
+			aHandlers.push(oRootMenu.on("mouseout", menuNav._onMouseOut, menuNav));
+			aHandlers.push(oRootMenu.on("mousemove", menuNav._onMouseMove, menuNav));
+			aHandlers.push(oRootMenu.on(MOUSEDOWN, menuNav._toggleSubmenuDisplay, menuNav));
+			aHandlers.push(Y.on("key", menuNav._toggleSubmenuDisplay, oRootMenu, "down:13", menuNav));
+			aHandlers.push(oRootMenu.on(CLICK, menuNav._toggleSubmenuDisplay, menuNav));
+			aHandlers.push(oRootMenu.on("keypress", menuNav._onKeyPress, menuNav));
+			aHandlers.push(oRootMenu.on(KEYDOWN, menuNav._onKeyDown, menuNav));
+
+			oDoc = oRootMenu.get("ownerDocument");
+
+		    aHandlers.push(oDoc.on(MOUSEDOWN, menuNav._onDocMouseDown, menuNav));
+			aHandlers.push(oDoc.on("focus", menuNav._onDocFocus, menuNav));
+
+			this._eventHandlers = aHandlers;
+
+			menuNav._initFocusManager();
+
+		}
+
+
+    },
+
+	destructor: function () {
+
+		var aHandlers = this._eventHandlers;
+
+		if (aHandlers) {
+
+			Y.Array.each(aHandlers, function (handle) {
+				handle.detach();
+			});
+
+			this._eventHandlers = null;
+
+		}
+
+		this.get(HOST).unplug("focusManager");
+
+    },
+
+
+
+	//	Protected methods
+
+	/**
+	* @method _isRoot
+	* @description Returns a boolean indicating if the specified menu is the
+	* root menu in the menu.
+	* @protected
+	* @param {Node} menu Node instance representing a menu.
+	* @return {Boolean} Boolean indicating if the specified menu is the root
+	* menu in the menu.
+	*/
+	_isRoot: function (menu) {
+
+		return this._rootMenu.compareTo(menu);
+
+	},
+
+
+	/**
+	* @method _getTopmostSubmenu
+	* @description Returns the topmost submenu of a submenu hierarchy.
+	* @protected
+	* @param {Node} menu Node instance representing a menu.
+	* @return {Node} Node instance representing a menu.
+	*/
+	_getTopmostSubmenu: function (menu) {
+
+		var menuNav = this,
+			oMenu = getParentMenu(menu),
+			returnVal;
+
+
+		if (!oMenu) {
+			returnVal = menu;
+		}
+		else if (menuNav._isRoot(oMenu)) {
+			returnVal = menu;
+		}
+		else {
+			returnVal = menuNav._getTopmostSubmenu(oMenu);
+		}
+
+		return returnVal;
+
+	},
+
+
+	/**
+	* @method _clearActiveItem
+	* @description Clears the menu's active descendent.
+	* @protected
+	*/
+	_clearActiveItem: function () {
+
+		var menuNav = this,
+			oActiveItem = menuNav._activeItem;
+
+		if (oActiveItem) {
+			oActiveItem.removeClass(getActiveClass(oActiveItem));
+		}
+
+		menuNav._activeItem = null;
+
+	},
+
+
+	/**
+	* @method _setActiveItem
+	* @description Sets the specified menuitem or menu label as the menu's
+	* active descendent.
+	* @protected
+	* @param {Node} item Node instance representing a menuitem or menu label.
+	*/
+	_setActiveItem: function (item) {
+
+		var menuNav = this;
+
+		if (item) {
+
+			menuNav._clearActiveItem();
+
+			item.addClass(getActiveClass(item));
+
+			menuNav._activeItem = item;
+
+		}
+
+	},
+
+
+	/**
+	* @method _focusItem
+	* @description Focuses the specified menuitem or menu label.
+	* @protected
+	* @param {Node} item Node instance representing a menuitem or menu label.
+	*/
+	_focusItem: function (item) {
+
+		var menuNav = this,
+			oMenu,
+			oItem;
+
+		if (item && menuNav._hasFocus) {
+
+			oMenu = getParentMenu(item);
+			oItem = getItemAnchor(item);
+
+			if (oMenu && !oMenu.compareTo(menuNav._activeMenu)) {
+				menuNav._activeMenu = oMenu;
+				menuNav._initFocusManager();
+			}
+
+			menuNav._focusManager.focus(oItem);
+
+		}
+
+	},
+
+
+	/**
+	* @method _showMenu
+	* @description Shows the specified menu.
+	* @protected
+	* @param {Node} menu Node instance representing a menu.
+	*/
+	_showMenu: function (menu) {
+
+		var oParentMenu = getParentMenu(menu),
+			oLI = menu.get(PARENT_NODE),
+			aXY = oLI.getXY();
+
+
+		if (this.get(USE_ARIA)) {
+			menu.set(ARIA_HIDDEN, false);
+		}
+
+
+		if (isHorizontalMenu(oParentMenu)) {
+			aXY[1] = aXY[1] + oLI.get(OFFSET_HEIGHT);
+		}
+		else {
+			aXY[0] = aXY[0] + oLI.get(OFFSET_WIDTH);
+		}
+
+		menu.setXY(aXY);
+
+		if (UA.ie && UA.ie < 8) {
+
+			if (UA.ie === 6 && !menu.hasIFrameShim) {
+
+				menu.appendChild(Y.Node.create(NodeMenuNav.SHIM_TEMPLATE));
+				menu.hasIFrameShim = true;
+
+			}
+
+			//	Clear previous values for height and width
+
+			menu.setStyles({ height: EMPTY_STRING, width: EMPTY_STRING });
+
+			//	Set the width and height of the menu's bounding box - this is
+			//	necessary for IE 6 so that the CSS for the <iframe> shim can
+			//	simply set the <iframe>'s width and height to 100% to ensure
+			//	that dimensions of an <iframe> shim are always sync'd to the
+			//	that of its parent menu.  Specifying a width and height also
+			//	helps when positioning decorator elements (for creating effects
+			//	like rounded corners) inside a menu's bounding box in IE 7.
+
+			menu.setStyles({
+				height: (menu.get(OFFSET_HEIGHT) + PX),
+				width: (menu.get(OFFSET_WIDTH) + PX) });
+
+		}
+
+		menu.previous().addClass(CSS_MENU_LABEL_MENUVISIBLE);
+		menu.removeClass(CSS_MENU_HIDDEN);
+
+	},
+
+
+	/**
+	* @method _hideMenu
+	* @description Hides the specified menu.
+	* @protected
+	* @param {Node} menu Node instance representing a menu.
+	* @param {Boolean} activateAndFocusLabel Boolean indicating if the label
+	* for the specified
+	* menu should be focused and set as active.
+	*/
+	_hideMenu: function (menu, activateAndFocusLabel) {
+
+		var menuNav = this,
+			oLabel = menu.previous(),
+			oActiveItem;
+
+		oLabel.removeClass(CSS_MENU_LABEL_MENUVISIBLE);
+
+
+		if (activateAndFocusLabel) {
+			menuNav._focusItem(oLabel);
+			menuNav._setActiveItem(oLabel);
+		}
+
+		oActiveItem = menu.one((PERIOD + CSS_MENUITEM_ACTIVE));
+
+		if (oActiveItem) {
+			oActiveItem.removeClass(CSS_MENUITEM_ACTIVE);
+		}
+
+		//	Clear the values for top and left that were set by the call to
+		//	"setXY" when the menu was shown so that the hidden position
+		//	specified in the core CSS file will take affect.
+
+		menu.setStyles({ left: EMPTY_STRING, top: EMPTY_STRING });
+
+		menu.addClass(CSS_MENU_HIDDEN);
+
+		if (menuNav.get(USE_ARIA)) {
+			menu.set(ARIA_HIDDEN, true);
+		}
+
+	},
+
+
+	/**
+	* @method _hideAllSubmenus
+	* @description Hides all submenus of the specified menu.
+	* @protected
+	* @param {Node} menu Node instance representing a menu.
+	*/
+	_hideAllSubmenus: function (menu) {
+
+		var menuNav = this;
+
+		menu.all(MENU_SELECTOR).each(Y.bind(function (submenuNode) {
+
+			menuNav._hideMenu(submenuNode);
+
+		}, menuNav));
+
+	},
+
+
+	/**
+	* @method _cancelShowSubmenuTimer
+	* @description Cancels the timer used to show a submenu.
+	* @protected
+	*/
+	_cancelShowSubmenuTimer: function () {
+
+		var menuNav = this,
+			oShowSubmenuTimer = menuNav._showSubmenuTimer;
+
+		if (oShowSubmenuTimer) {
+			oShowSubmenuTimer.cancel();
+			menuNav._showSubmenuTimer = null;
+		}
+
+	},
+
+
+	/**
+	* @method _cancelHideSubmenuTimer
+	* @description Cancels the timer used to hide a submenu.
+	* @protected
+	*/
+	_cancelHideSubmenuTimer: function () {
+
+		var menuNav = this,
+			oHideSubmenuTimer = menuNav._hideSubmenuTimer;
+
+
+		if (oHideSubmenuTimer) {
+			oHideSubmenuTimer.cancel();
+			menuNav._hideSubmenuTimer = null;
+		}
+
+	},
+
+
+	/**
+	* @method _initFocusManager
+	* @description Initializes and updates the Focus Manager so that is is
+	* always managing descendants of the active menu.
+	* @protected
+	*/
+	_initFocusManager: function () {
+
+		var menuNav = this,
+			oRootMenu = menuNav._rootMenu,
+			oMenu = menuNav._activeMenu || oRootMenu,
+			sSelectorBase =
+				menuNav._isRoot(oMenu) ? EMPTY_STRING : ("#" + oMenu.get("id")),
+			oFocusManager = menuNav._focusManager,
+			sKeysVal,
+			sDescendantSelector,
+			sQuery;
+
+		if (isHorizontalMenu(oMenu)) {
+
+			sDescendantSelector = sSelectorBase + STANDARD_QUERY + "," +
+				sSelectorBase + EXTENDED_QUERY;
+
+			sKeysVal = { next: "down:39", previous: "down:37" };
+
+		}
+		else {
+
+			sDescendantSelector = sSelectorBase + STANDARD_QUERY;
+			sKeysVal = { next: "down:40", previous: "down:38" };
+
+		}
+
+
+		if (!oFocusManager) {
+
+			oRootMenu.plug(Y.Plugin.NodeFocusManager, {
+				descendants: sDescendantSelector,
+				keys: sKeysVal,
+				circular: true
+			});
+
+			oFocusManager = oRootMenu.focusManager;
+
+			sQuery = "#" + oRootMenu.get("id") + MENU_SELECTOR + " a," +
+							MENU_TOGGLE_SELECTOR;
+
+			oRootMenu.all(sQuery).set("tabIndex", -1);
+
+			oFocusManager.on(ACTIVE_DESCENDANT_CHANGE,
+				this._onActiveDescendantChange, oFocusManager, this);
+
+			oFocusManager.after(ACTIVE_DESCENDANT_CHANGE,
+				this._afterActiveDescendantChange, oFocusManager, this);
+
+			menuNav._focusManager = oFocusManager;
+
+		}
+		else {
+
+			oFocusManager.set(ACTIVE_DESCENDANT, -1);
+			oFocusManager.set(DESCENDANTS, sDescendantSelector);
+			oFocusManager.set("keys", sKeysVal);
+
+		}
+
+	},
+
+
+	//	Event handlers for discrete pieces of pieces of the menu
+
+
+	/**
+	* @method _onActiveDescendantChange
+	* @description "activeDescendantChange" event handler for menu's
+	* Focus Manager.
+	* @protected
+	* @param {Object} event Object representing the Attribute change event.
+	* @param {NodeMenuNav} menuNav Object representing the NodeMenuNav instance.
+	*/
+	_onActiveDescendantChange: function (event, menuNav) {
+
+		if (event.src === UI && menuNav._activeMenu &&
+				!menuNav._movingToSubmenu) {
+
+			menuNav._hideAllSubmenus(menuNav._activeMenu);
+
+		}
+
+	},
+
+
+	/**
+	* @method _afterActiveDescendantChange
+	* @description "activeDescendantChange" event handler for menu's
+	* Focus Manager.
+	* @protected
+	* @param {Object} event Object representing the Attribute change event.
+	* @param {NodeMenuNav} menuNav Object representing the NodeMenuNav instance.
+	*/
+	_afterActiveDescendantChange: function (event, menuNav) {
+
+		var oItem;
+
+		if (event.src === UI) {
+			oItem = getItem(this.get(DESCENDANTS).item(event.newVal), true);
+			menuNav._setActiveItem(oItem);
+		}
+
+	},
+
+
+	/**
+	* @method _onDocFocus
+	* @description "focus" event handler for the owner document of the MenuNav.
+	* @protected
+	* @param {Object} event Object representing the DOM event.
+	*/
+	_onDocFocus: function (event) {
+
+		var menuNav = this,
+			oActiveItem = menuNav._activeItem,
+			oTarget = event.target,
+			oMenu;
+
+
+		if (menuNav._rootMenu.contains(oTarget)) {	//	The menu has focus
+
+			if (menuNav._hasFocus) {
+
+				oMenu = getParentMenu(oTarget);
+
+				//	If the element that was focused is a descendant of the
+				//	root menu, but is in a submenu not currently being
+				//	managed by the Focus Manager, update the Focus Manager so
+				//	that it is now managing the submenu that is the parent of
+				//	the element that was focused.
+
+				if (!menuNav._activeMenu.compareTo(oMenu)) {
+
+					menuNav._activeMenu = oMenu;
+					menuNav._initFocusManager();
+					menuNav._focusManager.set(ACTIVE_DESCENDANT, oTarget);
+					menuNav._setActiveItem(getItem(oTarget, true));
+
+				}
+
+			}
+			else { //	Initial focus
+
+				//	First time the menu has been focused, need to setup focused
+				//	state and established active active descendant
+
+				menuNav._hasFocus = true;
+
+				oActiveItem = getItem(oTarget, true);
+
+				if (oActiveItem) {
+					menuNav._setActiveItem(oActiveItem);
+				}
+
+			}
+
+		}
+		else {	//	The menu has lost focus
+
+			menuNav._clearActiveItem();
+
+			menuNav._cancelShowSubmenuTimer();
+			menuNav._hideAllSubmenus(menuNav._rootMenu);
+
+			menuNav._activeMenu = menuNav._rootMenu;
+			menuNav._initFocusManager();
+
+			menuNav._focusManager.set(ACTIVE_DESCENDANT, 0);
+
+			menuNav._hasFocus = false;
+
+		}
+
+	},
+
+
+	/**
+	* @method _onMenuMouseOver
+	* @description "mouseover" event handler for a menu.
+	* @protected
+	* @param {Node} menu Node instance representing a menu.
+	* @param {Object} event Object representing the DOM event.
+	*/
+	_onMenuMouseOver: function (menu, event) {
+
+		var menuNav = this,
+			oHideAllSubmenusTimer = menuNav._hideAllSubmenusTimer;
+
+		if (oHideAllSubmenusTimer) {
+			oHideAllSubmenusTimer.cancel();
+			menuNav._hideAllSubmenusTimer = null;
+		}
+
+		menuNav._cancelHideSubmenuTimer();
+
+		//	Need to update the FocusManager in advance of focus a new
+		//	Menu in order to avoid the FocusManager thinking that
+		//	it has lost focus
+
+		if (menu && !menu.compareTo(menuNav._activeMenu)) {
+			menuNav._activeMenu = menu;
+
+			if (menuNav._hasFocus) {
+				menuNav._initFocusManager();
+			}
+
+		}
+
+		if (menuNav._movingToSubmenu && isHorizontalMenu(menu)) {
+			menuNav._movingToSubmenu = false;
+		}
+
+	},
+
+
+	/**
+	* @method _hideAndFocusLabel
+	* @description Hides all of the submenus of the root menu and focuses the
+	* label of the topmost submenu
+	* @protected
+	*/
+	_hideAndFocusLabel: function () {
+
+		var	menuNav = this,
+			oActiveMenu = menuNav._activeMenu,
+			oSubmenu;
+
+		menuNav._hideAllSubmenus(menuNav._rootMenu);
+
+		if (oActiveMenu) {
+
+			//	Focus the label element for the topmost submenu
+			oSubmenu = menuNav._getTopmostSubmenu(oActiveMenu);
+			menuNav._focusItem(oSubmenu.previous());
+
+		}
+
+	},
+
+
+	/**
+	* @method _onMenuMouseOut
+	* @description "mouseout" event handler for a menu.
+	* @protected
+	* @param {Node} menu Node instance representing a menu.
+	* @param {Object} event Object representing the DOM event.
+	*/
+	_onMenuMouseOut: function (menu, event) {
+
+		var menuNav = this,
+			oActiveMenu = menuNav._activeMenu,
+			oRelatedTarget = event.relatedTarget,
+			oActiveItem = menuNav._activeItem,
+			oParentMenu,
+			oMenu;
+
+
+		if (oActiveMenu && !oActiveMenu.contains(oRelatedTarget)) {
+
+			oParentMenu = getParentMenu(oActiveMenu);
+
+
+			if (oParentMenu && !oParentMenu.contains(oRelatedTarget)) {
+
+				if (menuNav.get(MOUSEOUT_HIDE_DELAY) > 0) {
+
+					menuNav._cancelShowSubmenuTimer();
+
+					menuNav._hideAllSubmenusTimer =
+
+						later(menuNav.get(MOUSEOUT_HIDE_DELAY),
+							menuNav, menuNav._hideAndFocusLabel);
+
+				}
+
+			}
+			else {
+
+				if (oActiveItem) {
+
+					oMenu = getParentMenu(oActiveItem);
+
+					if (!menuNav._isRoot(oMenu)) {
+						menuNav._focusItem(oMenu.previous());
+					}
+
+				}
+
+			}
+
+		}
+
+	},
+
+
+	/**
+	* @method _onMenuLabelMouseOver
+	* @description "mouseover" event handler for a menu label.
+	* @protected
+	* @param {Node} menuLabel Node instance representing a menu label.
+	* @param {Object} event Object representing the DOM event.
+	*/
+	_onMenuLabelMouseOver: function (menuLabel, event) {
+
+		var menuNav = this,
+			oActiveMenu = menuNav._activeMenu,
+			bIsRoot = menuNav._isRoot(oActiveMenu),
+			bUseAutoSubmenuDisplay =
+				(menuNav.get(AUTO_SUBMENU_DISPLAY) && bIsRoot || !bIsRoot),
+            submenuShowDelay = menuNav.get("submenuShowDelay"),
+			oSubmenu;
+
+
+        var showSubmenu = function (delay) {
+
+			menuNav._cancelHideSubmenuTimer();
+			menuNav._cancelShowSubmenuTimer();
+
+			if (!hasVisibleSubmenu(menuLabel)) {
+
+				oSubmenu = menuLabel.next();
+
+				if (oSubmenu) {
+					menuNav._hideAllSubmenus(oActiveMenu);
+					menuNav._showSubmenuTimer = later(delay, menuNav, menuNav._showMenu, oSubmenu);
+				}
+
+			}
+
+        };
+
+
+		menuNav._focusItem(menuLabel);
+		menuNav._setActiveItem(menuLabel);
+
+
+		if (bUseAutoSubmenuDisplay) {
+
+	        if (menuNav._movingToSubmenu) {
+
+	            //  If the user is moving diagonally from a submenu to
+	            //  another submenu and they then stop and pause on a
+	            //  menu label for an amount of time equal to the amount of
+	            //  time defined for the display of a submenu then show the
+	            //  submenu immediately.
+	            //  http://yuilibrary.com/projects/yui3/ticket/2528316
+
+	            //Y.message("Pause path");
+
+	            menuNav._hoverTimer = later(submenuShowDelay, menuNav, function () {
+                    showSubmenu(0);
+	            });
+
+	        }
+	        else {
+                showSubmenu(submenuShowDelay);
+	        }
+
+		}
+
+	},
+
+
+	/**
+	* @method _onMenuLabelMouseOut
+	* @description "mouseout" event handler for a menu label.
+	* @protected
+	* @param {Node} menuLabel Node instance representing a menu label.
+	* @param {Object} event Object representing the DOM event.
+	*/
+	_onMenuLabelMouseOut: function (menuLabel, event) {
+
+		var menuNav = this,
+			bIsRoot = menuNav._isRoot(menuNav._activeMenu),
+			bUseAutoSubmenuDisplay =
+				(menuNav.get(AUTO_SUBMENU_DISPLAY) && bIsRoot || !bIsRoot),
+
+			oRelatedTarget = event.relatedTarget,
+			oSubmenu = menuLabel.next(),
+			hoverTimer = menuNav._hoverTimer;
+
+        if (hoverTimer) {
+            hoverTimer.cancel();
+        }
+
+		menuNav._clearActiveItem();
+
+		if (bUseAutoSubmenuDisplay) {
+
+			if (menuNav._movingToSubmenu &&
+					!menuNav._showSubmenuTimer && oSubmenu) {
+
+				//	If the mouse is moving diagonally toward the submenu and
+				//	another submenu isn't in the process of being displayed
+				//	(via a timer), then hide the submenu via a timer to give
+				//	the user some time to reach the submenu.
+
+				menuNav._hideSubmenuTimer =
+					later(menuNav.get("submenuHideDelay"), menuNav,
+						menuNav._hideMenu, oSubmenu);
+
+			}
+			else if (!menuNav._movingToSubmenu && oSubmenu && (!oRelatedTarget ||
+			        (oRelatedTarget &&
+			            !oSubmenu.contains(oRelatedTarget) &&
+			            !oRelatedTarget.compareTo(oSubmenu)))) {
+
+				//	If the mouse is not moving toward the submenu, cancel any
+				//	submenus that might be in the process of being displayed
+				//	(via a timer) and hide this submenu immediately.
+
+				menuNav._cancelShowSubmenuTimer();
+
+				menuNav._hideMenu(oSubmenu);
+
+			}
+
+		}
+
+	},
+
+
+	/**
+	* @method _onMenuItemMouseOver
+	* @description "mouseover" event handler for a menuitem.
+	* @protected
+	* @param {Node} menuItem Node instance representing a menuitem.
+	* @param {Object} event Object representing the DOM event.
+	*/
+	_onMenuItemMouseOver: function (menuItem, event) {
+
+		var menuNav = this,
+			oActiveMenu = menuNav._activeMenu,
+			bIsRoot = menuNav._isRoot(oActiveMenu),
+			bUseAutoSubmenuDisplay =
+				(menuNav.get(AUTO_SUBMENU_DISPLAY) && bIsRoot || !bIsRoot);
+
+
+		menuNav._focusItem(menuItem);
+		menuNav._setActiveItem(menuItem);
+
+
+		if (bUseAutoSubmenuDisplay && !menuNav._movingToSubmenu) {
+
+			menuNav._hideAllSubmenus(oActiveMenu);
+
+		}
+
+	},
+
+
+	/**
+	* @method _onMenuItemMouseOut
+	* @description "mouseout" event handler for a menuitem.
+	* @protected
+	* @param {Node} menuItem Node instance representing a menuitem.
+	* @param {Object} event Object representing the DOM event.
+	*/
+	_onMenuItemMouseOut: function (menuItem, event) {
+
+		this._clearActiveItem();
+
+	},
+
+
+	/**
+	* @method _onVerticalMenuKeyDown
+	* @description "keydown" event handler for vertical menus.
+	* @protected
+	* @param {Object} event Object representing the DOM event.
+	*/
+	_onVerticalMenuKeyDown: function (event) {
+
+		var menuNav = this,
+			oActiveMenu = menuNav._activeMenu,
+			oRootMenu = menuNav._rootMenu,
+			oTarget = event.target,
+			bPreventDefault = false,
+			nKeyCode = event.keyCode,
+			oSubmenu,
+			oParentMenu,
+			oLI,
+			oItem;
+
+
+		switch (nKeyCode) {
+
+			case 37:	//	left arrow
+
+				oParentMenu = getParentMenu(oActiveMenu);
+
+				if (oParentMenu && isHorizontalMenu(oParentMenu)) {
+
+					menuNav._hideMenu(oActiveMenu);
+					oLI = getPreviousSibling(oActiveMenu.get(PARENT_NODE));
+					oItem = getItem(oLI);
+
+					if (oItem) {
+
+						if (isMenuLabel(oItem)) {	//	Menu label
+
+							oSubmenu = oItem.next();
+
+
+							if (oSubmenu) {
+
+								menuNav._showMenu(oSubmenu);
+								menuNav._focusItem(getFirstItem(oSubmenu));
+								menuNav._setActiveItem(getFirstItem(oSubmenu));
+
+							}
+							else {
+
+								menuNav._focusItem(oItem);
+								menuNav._setActiveItem(oItem);
+
+							}
+
+						}
+						else {	//	MenuItem
+
+							menuNav._focusItem(oItem);
+							menuNav._setActiveItem(oItem);
+
+						}
+
+					}
+
+				}
+				else if (!menuNav._isRoot(oActiveMenu)) {
+					menuNav._hideMenu(oActiveMenu, true);
+				}
+
+
+				bPreventDefault = true;
+
+			break;
+
+			case 39:	//	right arrow
+
+				if (isMenuLabel(oTarget)) {
+
+					oSubmenu = oTarget.next();
+
+					if (oSubmenu) {
+
+						menuNav._showMenu(oSubmenu);
+						menuNav._focusItem(getFirstItem(oSubmenu));
+						menuNav._setActiveItem(getFirstItem(oSubmenu));
+
+					}
+
+				}
+				else if (isHorizontalMenu(oRootMenu)) {
+
+					oSubmenu = menuNav._getTopmostSubmenu(oActiveMenu);
+					oLI = getNextSibling(oSubmenu.get(PARENT_NODE));
+					oItem = getItem(oLI);
+
+					menuNav._hideAllSubmenus(oRootMenu);
+
+					if (oItem) {
+
+						if (isMenuLabel(oItem)) {	//	Menu label
+
+							oSubmenu = oItem.next();
+
+							if (oSubmenu) {
+
+								menuNav._showMenu(oSubmenu);
+								menuNav._focusItem(getFirstItem(oSubmenu));
+								menuNav._setActiveItem(getFirstItem(oSubmenu));
+
+							}
+							else {
+
+								menuNav._focusItem(oItem);
+								menuNav._setActiveItem(oItem);
+
+							}
+
+						}
+						else {	//	MenuItem
+
+							menuNav._focusItem(oItem);
+							menuNav._setActiveItem(oItem);
+
+						}
+
+					}
+
+				}
+
+				bPreventDefault = true;
+
+			break;
+
+		}
+
+
+		if (bPreventDefault) {
+
+			//	Prevent the browser from scrolling the window
+
+			event.preventDefault();
+
+		}
+
+	},
+
+
+	/**
+	* @method _onHorizontalMenuKeyDown
+	* @description "keydown" event handler for horizontal menus.
+	* @protected
+	* @param {Object} event Object representing the DOM event.
+	*/
+	_onHorizontalMenuKeyDown: function (event) {
+
+		var menuNav = this,
+			oActiveMenu = menuNav._activeMenu,
+			oTarget = event.target,
+			oFocusedItem = getItem(oTarget, true),
+			bPreventDefault = false,
+			nKeyCode = event.keyCode,
+			oSubmenu;
+
+
+		if (nKeyCode === 40) {
+
+			menuNav._hideAllSubmenus(oActiveMenu);
+
+			if (isMenuLabel(oFocusedItem)) {
+
+				oSubmenu = oFocusedItem.next();
+
+				if (oSubmenu) {
+
+					menuNav._showMenu(oSubmenu);
+					menuNav._focusItem(getFirstItem(oSubmenu));
+					menuNav._setActiveItem(getFirstItem(oSubmenu));
+
+				}
+
+				bPreventDefault = true;
+
+			}
+
+		}
+
+
+		if (bPreventDefault) {
+
+			//	Prevent the browser from scrolling the window
+
+			event.preventDefault();
+
+		}
+
+	},
+
+
+	//	Generic DOM Event handlers
+
+
+	/**
+	* @method _onMouseMove
+	* @description "mousemove" event handler for the menu.
+	* @protected
+	* @param {Object} event Object representing the DOM event.
+	*/
+	_onMouseMove: function (event) {
+
+		var menuNav = this;
+
+		//	Using a timer to set the value of the "_currentMouseX" property
+		//	helps improve the reliability of the calculation used to set the
+		//	value of the "_movingToSubmenu" property - especially in Opera.
+
+		later(10, menuNav, function () {
+
+			menuNav._currentMouseX = event.pageX;
+
+		});
+
+	},
+
+
+	/**
+	* @method _onMouseOver
+	* @description "mouseover" event handler for the menu.
+	* @protected
+	* @param {Object} event Object representing the DOM event.
+	*/
+	_onMouseOver: function (event) {
+
+		var menuNav = this,
+			oTarget,
+			oMenu,
+			oMenuLabel,
+			oParentMenu,
+			oMenuItem;
+
+
+		if (menuNav._blockMouseEvent) {
+			menuNav._blockMouseEvent = false;
+		}
+		else {
+
+			oTarget = event.target;
+			oMenu = getMenu(oTarget, true);
+			oMenuLabel = getMenuLabel(oTarget, true);
+			oMenuItem = getMenuItem(oTarget, true);
+
+
+			if (handleMouseOverForNode(oMenu, oTarget)) {
+
+				menuNav._onMenuMouseOver(oMenu, event);
+
+				oMenu[HANDLED_MOUSEOVER] = true;
+				oMenu[HANDLED_MOUSEOUT] = false;
+
+				oParentMenu = getParentMenu(oMenu);
+
+				if (oParentMenu) {
+
+					oParentMenu[HANDLED_MOUSEOUT] = true;
+					oParentMenu[HANDLED_MOUSEOVER] = false;
+
+				}
+
+			}
+
+			if (handleMouseOverForNode(oMenuLabel, oTarget)) {
+
+				menuNav._onMenuLabelMouseOver(oMenuLabel, event);
+
+				oMenuLabel[HANDLED_MOUSEOVER] = true;
+				oMenuLabel[HANDLED_MOUSEOUT] = false;
+
+			}
+
+			if (handleMouseOverForNode(oMenuItem, oTarget)) {
+
+				menuNav._onMenuItemMouseOver(oMenuItem, event);
+
+				oMenuItem[HANDLED_MOUSEOVER] = true;
+				oMenuItem[HANDLED_MOUSEOUT] = false;
+
+			}
+
+		}
+
+	},
+
+
+	/**
+	* @method _onMouseOut
+	* @description "mouseout" event handler for the menu.
+	* @protected
+	* @param {Object} event Object representing the DOM event.
+	*/
+	_onMouseOut: function (event) {
+
+		var menuNav = this,
+			oActiveMenu = menuNav._activeMenu,
+			bMovingToSubmenu = false,
+			oTarget,
+			oRelatedTarget,
+			oMenu,
+			oMenuLabel,
+			oSubmenu,
+			oMenuItem;
+
+
+		menuNav._movingToSubmenu =
+					(oActiveMenu && !isHorizontalMenu(oActiveMenu) &&
+						((event.pageX - 5) > menuNav._currentMouseX));
+
+		oTarget = event.target;
+		oRelatedTarget = event.relatedTarget;
+		oMenu = getMenu(oTarget, true);
+		oMenuLabel = getMenuLabel(oTarget, true);
+		oMenuItem = getMenuItem(oTarget, true);
+
+
+		if (handleMouseOutForNode(oMenuLabel, oRelatedTarget)) {
+
+			menuNav._onMenuLabelMouseOut(oMenuLabel, event);
+
+			oMenuLabel[HANDLED_MOUSEOUT] = true;
+			oMenuLabel[HANDLED_MOUSEOVER] = false;
+
+		}
+
+		if (handleMouseOutForNode(oMenuItem, oRelatedTarget)) {
+
+			menuNav._onMenuItemMouseOut(oMenuItem, event);
+
+			oMenuItem[HANDLED_MOUSEOUT] = true;
+			oMenuItem[HANDLED_MOUSEOVER] = false;
+
+		}
+
+
+		if (oMenuLabel) {
+
+			oSubmenu = oMenuLabel.next();
+
+			if (oSubmenu && oRelatedTarget &&
+				(oRelatedTarget.compareTo(oSubmenu) ||
+					oSubmenu.contains(oRelatedTarget))) {
+
+				bMovingToSubmenu = true;
+
+			}
+
+		}
+
+
+		if (handleMouseOutForNode(oMenu, oRelatedTarget) || bMovingToSubmenu) {
+
+			menuNav._onMenuMouseOut(oMenu, event);
+
+			oMenu[HANDLED_MOUSEOUT] = true;
+			oMenu[HANDLED_MOUSEOVER] = false;
+
+		}
+
+	},
+
+
+	/**
+	* @method _toggleSubmenuDisplay
+	* @description "mousedown," "keydown," and "click" event handler for the
+	* menu used to toggle the display of a submenu.
+	* @protected
+	* @param {Object} event Object representing the DOM event.
+	*/
+	_toggleSubmenuDisplay: function (event) {
+
+		var menuNav = this,
+			oTarget = event.target,
+			oMenuLabel = getMenuLabel(oTarget, true),
+			sType = event.type,
+			oAnchor,
+			oSubmenu,
+			sHref,
+			nHashPos,
+			nLen,
+			sId;
+
+
+		if (oMenuLabel) {
+
+			oAnchor = isAnchor(oTarget) ? oTarget : oTarget.ancestor(isAnchor);
+
+
+			if (oAnchor) {
+
+				//	Need to pass "2" as a second argument to "getAttribute" for
+				//	IE otherwise IE will return a fully qualified URL for the
+				//	value of the "href" attribute.
+				//	http://msdn.microsoft.com/en-us/library/ms536429(VS.85).aspx
+
+				sHref = oAnchor.getAttribute("href", 2);
+				nHashPos = sHref.indexOf("#");
+				nLen = sHref.length;
+
+				if (nHashPos === 0 && nLen > 1) {
+
+					sId = sHref.substr(1, nLen);
+					oSubmenu = oMenuLabel.next();
+
+					if (oSubmenu && (oSubmenu.get(ID) === sId)) {
+
+						if (sType === MOUSEDOWN || sType === KEYDOWN) {
+
+							if ((UA.opera || UA.gecko || UA.ie) && sType === KEYDOWN && !menuNav._preventClickHandle) {
+
+								//	Prevent the browser from following the URL of
+								//	the anchor element
+
+								menuNav._preventClickHandle = menuNav._rootMenu.on("click", function (event) {
+
+									event.preventDefault();
+
+									menuNav._preventClickHandle.detach();
+									menuNav._preventClickHandle = null;
+
+								});
+
+							}
+
+							if (sType == MOUSEDOWN) {
+
+								//	Prevent the target from getting focused by
+								//	default, since the element to be focused will
+								//	be determined by weather or not the submenu
+								//	is visible.
+								event.preventDefault();
+
+								//	FocusManager will attempt to focus any
+								//	descendant that is the target of the mousedown
+								//	event.  Since we want to explicitly control
+	 							//	where focus is going, we need to call
+								//	"stopImmediatePropagation" to stop the
+								//	FocusManager from doing its thing.
+								event.stopImmediatePropagation();
+
+								//	The "_focusItem" method relies on the
+								//	"_hasFocus" property being set to true.  The
+								//	"_hasFocus" property is normally set via a
+								//	"focus" event listener, but since we've
+								//	blocked focus from happening, we need to set
+								//	this property manually.
+								menuNav._hasFocus = true;
+
+							}
+
+
+							if (menuNav._isRoot(getParentMenu(oTarget))) {	//	Event target is a submenu label in the root menu
+
+								//	Menu label toggle functionality
+
+								if (hasVisibleSubmenu(oMenuLabel)) {
+
+									menuNav._hideMenu(oSubmenu);
+									menuNav._focusItem(oMenuLabel);
+									menuNav._setActiveItem(oMenuLabel);
+
+								}
+								else {
+
+									menuNav._hideAllSubmenus(menuNav._rootMenu);
+									menuNav._showMenu(oSubmenu);
+
+									menuNav._focusItem(getFirstItem(oSubmenu));
+									menuNav._setActiveItem(getFirstItem(oSubmenu));
+
+								}
+
+							}
+							else {	//	Event target is a submenu label within a submenu
+
+								if (menuNav._activeItem == oMenuLabel) {
+
+									menuNav._showMenu(oSubmenu);
+									menuNav._focusItem(getFirstItem(oSubmenu));
+									menuNav._setActiveItem(getFirstItem(oSubmenu));
+
+								}
+								else {
+
+									if (!oMenuLabel._clickHandle) {
+
+										oMenuLabel._clickHandle = oMenuLabel.on("click", function () {
+
+											menuNav._hideAllSubmenus(menuNav._rootMenu);
+
+											menuNav._hasFocus = false;
+											menuNav._clearActiveItem();
+
+
+											oMenuLabel._clickHandle.detach();
+
+											oMenuLabel._clickHandle = null;
+
+										});
+
+									}
+
+								}
+
+							}
+
+						}
+
+
+						if (sType === CLICK) {
+
+							//	Prevent the browser from following the URL of
+							//	the anchor element
+
+							event.preventDefault();
+
+						}
+
+					}
+
+				}
+
+
+			}
+
+		}
+
+	},
+
+
+	/**
+	* @method _onKeyPress
+	* @description "keypress" event handler for the menu.
+	* @protected
+	* @param {Object} event Object representing the DOM event.
+	*/
+	_onKeyPress: function (event) {
+
+		switch (event.keyCode) {
+
+			case 37:	//	left arrow
+			case 38:	//	up arrow
+			case 39:	//	right arrow
+			case 40:	//	down arrow
+
+				//	Prevent the browser from scrolling the window
+
+				event.preventDefault();
+
+			break;
+
+		}
+
+	},
+
+
+	/**
+	* @method _onKeyDown
+	* @description "keydown" event handler for the menu.
+	* @protected
+	* @param {Object} event Object representing the DOM event.
+	*/
+	_onKeyDown: function (event) {
+
+		var menuNav = this,
+			oActiveItem = menuNav._activeItem,
+			oTarget = event.target,
+			oActiveMenu = getParentMenu(oTarget),
+			oSubmenu;
+
+		if (oActiveMenu) {
+
+			menuNav._activeMenu = oActiveMenu;
+
+			if (isHorizontalMenu(oActiveMenu)) {
+				menuNav._onHorizontalMenuKeyDown(event);
+			}
+			else {
+				menuNav._onVerticalMenuKeyDown(event);
+			}
+
+
+			if (event.keyCode === 27) {
+
+				if (!menuNav._isRoot(oActiveMenu)) {
+
+					if (UA.opera) {
+						later(0, menuNav, function () {
+							menuNav._hideMenu(oActiveMenu, true);
+						});
+					}
+					else {
+						menuNav._hideMenu(oActiveMenu, true);
+					}
+
+					event.stopPropagation();
+					menuNav._blockMouseEvent = UA.gecko ? true : false;
+
+				}
+				else if (oActiveItem) {
+
+					if (isMenuLabel(oActiveItem) &&
+							hasVisibleSubmenu(oActiveItem)) {
+
+						oSubmenu = oActiveItem.next();
+
+						if (oSubmenu) {
+							menuNav._hideMenu(oSubmenu);
+						}
+
+					}
+					else {
+
+						menuNav._focusManager.blur();
+
+						//	This is necessary for Webkit since blurring the
+						//	active menuitem won't result in the document
+						//	gaining focus, meaning the that _onDocFocus
+						//	listener won't clear the active menuitem.
+
+						menuNav._clearActiveItem();
+
+						menuNav._hasFocus = false;
+
+					}
+
+				}
+
+			}
+
+		}
+
+	},
+
+	/**
+	* @method _onDocMouseDown
+	* @description "mousedown" event handler for the owner document of
+	* the menu.
+	* @protected
+	* @param {Object} event Object representing the DOM event.
+	*/
+	_onDocMouseDown: function (event) {
+
+		var menuNav = this,
+			oRoot = menuNav._rootMenu,
+			oTarget = event.target;
+
+
+		if (!(oRoot.compareTo(oTarget) || oRoot.contains(oTarget))) {
+
+			menuNav._hideAllSubmenus(oRoot);
+
+			//	Document doesn't receive focus in Webkit when the user mouses
+			//	down on it, so the "_hasFocus" property won't get set to the
+			//	correct value.  The following line corrects the problem.
+
+			if (UA.webkit) {
+				menuNav._hasFocus = false;
+				menuNav._clearActiveItem();
+			}
+
+		}
+
+	}
+
+});
+
+
+Y.namespace('Plugin');
+
+Y.Plugin.NodeMenuNav = NodeMenuNav;
+
+
+}, '@VERSION@', {"requires": ["node", "classnamemanager", "plugin", "node-focusmanager"], "skinnable": true});