Menu: Introducing position option into flyout menu

diff --git a/tests/visual/menu/flyoutmenu.html b/tests/visual/menu/flyoutmenu.html
index 8240689df3307687d961b43c70011db17f5b0e73..55e7053e5eb0d4a350bc34dcb0e4ca61028d35cc 100644 (file)
--- a/tests/visual/menu/flyoutmenu.html
+++ b/tests/visual/menu/flyoutmenu.html
@@ -28,7 +28,6 @@
                        // TODO required to prevent the click handler below from handling this event
                        event.stopPropagation();
                        menu.flyoutmenu("show")
-                               //.attr("tabIndex", 0)
                                .focus()
                                .css({
                                        top: 0,
@@ -45,17 +44,28 @@
                });
 
                menu.flyoutmenu({
-                       //input: button,
+                       /* top-alignment
+                       position: function(item) {
+                               return {
+                                       my: "left top",
+                                       at: "right top",
+                                       of: item.parent()
+                               }
+                       },
+                       */
                        select: function(event, ui) {
                                $("#log").append("<div>Selected " + ui.item.children("a").text() + "</div>");
                                button.focus();
                        }
                }).hide();
+               
+               // equal height
+               //menu.find("ul").height(menu.height()); 
        });
        </script>
        <style>
                body { font-size:62.5%; }
-               .ui-menu { width: 200px; position: absolute; }
+               .ui-menu { width: 200px; position: absolute; outline: none; }
                .ui-menu .ui-icon { float: right; }
        </style>
 </head>

diff --git a/tests/visual/menu/flyoutmenu.js b/tests/visual/menu/flyoutmenu.js
index 6654267967d701ce0df21a83109baad4f39bee81..bffecea7fcb4bfae1451e0cd5f00436819dc5b80 100644 (file)
--- a/tests/visual/menu/flyoutmenu.js
+++ b/tests/visual/menu/flyoutmenu.js
@@ -6,6 +6,14 @@
 (function($) {
 
 $.widget("ui.flyoutmenu", {
+       
+       options: {
+               position: {
+                       my: "left top",
+                       at: "right top"
+               }
+       },
+       
        _create: function() {
                var self = this;
                this.active = this.element;
@@ -90,14 +98,18 @@ $.widget("ui.flyoutmenu", {
                // TODO restrict to widget
                //only one menu can have items open at a time.
                $(document).find(".ui-menu-flyout").not(submenu.parents()).hide();
+               
+               var position = $.extend({}, {
+                       of: this.activeItem
+               }, $.type(this.options.position) == "function"
+                       ? this.options.position(this.activeItem)
+                       : this.options.position
+               );
+               
                submenu.show().css({
                        top: 0,
                        left: 0
-               }).position({
-                       my: "left top",
-                       at: "right top",
-                       of: this.activeItem
-               });
+               }).position(position);
        },
        _select: function(event) {
                event.stopPropagation();