Menu: Update menubar to use menu instead of removed flyoutmenu.

jzaefferer · jzaefferer · commit 84d59ded925b · 2011-02-24T16:39:08.000+01:00
diff --git a/tests/visual/menu/menubar.html b/tests/visual/menu/menubar.html
@@ -10,7 +10,6 @@
 	<script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
 	<script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script>
 	<script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script>
-	<script type="text/javascript" src="flyoutmenu.js"></script>
 	<script type="text/javascript" src="menubar.js"></script>
 	<!--
 	<script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
@@ -26,7 +25,6 @@
 		$(".menubar").menubar({
 			select: function(event, ui) {
 				$("<div/>").text("Selected: " + ui.item.text()).appendTo("#log");
-				ui.item.parents("ul:last").prev().focus()
 			}
 		});
 	});
@@ -46,6 +44,9 @@
 <body>
 
 <div class="menubar ui-widget-header">
+	<!--
+	<a href="#">About...</a>
+	-->
 	<a href="#">File</a>
 	<ul>
 		<li><a href="#">Open...</a></li>
diff --git a/tests/visual/menu/menubar.js b/tests/visual/menu/menubar.js
@@ -5,14 +5,18 @@
  */
 (function($) {
 
+// TODO take non-menubar buttons into account
 $.widget("ui.menubar", {
 	_create: function() {
 		var self = this;
 		var items = this.element.children("button, a");
 		items.next("ul").each(function(i, elm) {
-			$(elm).flyoutmenu({
-				select: self.options.select
-			}).hide().addClass("ui-menu-flyout").keydown(function(event) {
+			$(elm).menu({
+				select: function(event, ui) {
+					ui.item.parents("ul:last").hide()
+					self.options.select.apply(this, arguments);
+				}
+			}).hide().keydown(function(event) {
 				var menu = $(this);
 				if (menu.is(":hidden")) 
 					return;
@@ -54,8 +58,8 @@ $.widget("ui.menubar", {
 	},
 	
 	_open: function(event, menu) {
-		this.active && this.active.flyoutmenu("hide");
-		this.active = menu.flyoutmenu("show").position({
+		this.active && this.active.menu("closeAll").hide();
+		this.active = menu.show().position({
 			my: "left top",
 			at: "left bottom",
 			offset: "0 -1",
@@ -64,20 +68,20 @@ $.widget("ui.menubar", {
 	},
 	
 	left: function(event) {
-		var prev = this.active.prevAll( ".ui-menu-flyout" ).eq( 0 );
+		var prev = this.active.prevAll( ".ui-menu" ).eq( 0 );
 		if (prev.length) {
 			this._open(event, prev);
 		} else {
-			this._open(event, this.element.children(".ui-menu-flyout:last"));
+			this._open(event, this.element.children(".ui-menu:last"));
 		}
 	},
 	
 	right: function(event) {
-		var next =  this.active.nextAll( ".ui-menu-flyout" ).eq( 0 );
+		var next =  this.active.nextAll( ".ui-menu" ).eq( 0 );
 		if (next.length) {
 			this._open(event, next);
 		} else {
-			this._open(event, this.element.children(".ui-menu-flyout:first"));
+			this._open(event, this.element.children(".ui-menu:first"));
 		}
 	}
 });
