diff options
author | jzaefferer <joern.zaefferer@gmail.com> | 2010-04-21 21:01:08 +0200 |
---|---|---|
committer | jzaefferer <joern.zaefferer@gmail.com> | 2010-04-21 21:01:08 +0200 |
commit | 17f8079bc2ce4393d49e7dba238feaff1fddb134 (patch) | |
tree | 1bb7387feafaf6d2024349b47446aa200c657d0e | |
parent | 469d0c52e93fe9e421877eec90489cc06d63e5e5 (diff) | |
download | jquery-ui-17f8079bc2ce4393d49e7dba238feaff1fddb134.tar.gz jquery-ui-17f8079bc2ce4393d49e7dba238feaff1fddb134.zip |
Menu: Extracted menu code from autocomplete, updated all dependencies
-rw-r--r-- | demos/autocomplete/categories.html | 1 | ||||
-rw-r--r-- | demos/autocomplete/combobox.html | 1 | ||||
-rw-r--r-- | demos/autocomplete/custom-data.html | 1 | ||||
-rw-r--r-- | demos/autocomplete/default.html | 1 | ||||
-rw-r--r-- | demos/autocomplete/folding.html | 1 | ||||
-rw-r--r-- | demos/autocomplete/multiple-remote.html | 1 | ||||
-rw-r--r-- | demos/autocomplete/multiple.html | 1 | ||||
-rw-r--r-- | demos/autocomplete/remote-jsonp.html | 1 | ||||
-rw-r--r-- | demos/autocomplete/remote-with-cache.html | 1 | ||||
-rw-r--r-- | demos/autocomplete/remote.html | 1 | ||||
-rw-r--r-- | demos/autocomplete/xml.html | 1 | ||||
-rw-r--r-- | tests/unit/index.html | 1 | ||||
-rw-r--r-- | tests/visual/all.html | 1 | ||||
-rw-r--r-- | tests/visual/autocomplete/autocomplete.html | 1 | ||||
-rw-r--r-- | tests/visual/compound/widgets_in_dialog.html | 2 | ||||
-rw-r--r-- | tests/visual/menu/contextmenu.html | 2 | ||||
-rw-r--r-- | tests/visual/menu/drilldown.html | 2 | ||||
-rw-r--r-- | tests/visual/menu/menu.html | 2 | ||||
-rw-r--r-- | tests/visual/menu/nested.html | 2 | ||||
-rw-r--r-- | tests/visual/position/position.html | 2 | ||||
-rw-r--r-- | ui/jquery.ui.autocomplete.js | 1 | ||||
-rw-r--r-- | ui/jquery.ui.menu.js | 177 |
22 files changed, 198 insertions, 6 deletions
diff --git a/demos/autocomplete/categories.html b/demos/autocomplete/categories.html index bb59bf31e..2a2ac2f48 100644 --- a/demos/autocomplete/categories.html +++ b/demos/autocomplete/categories.html @@ -8,6 +8,7 @@ <script type="text/javascript" src="../../ui/jquery.ui.core.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script> <link type="text/css" href="../demos.css" rel="stylesheet" /> <style type="text/css"> diff --git a/demos/autocomplete/combobox.html b/demos/autocomplete/combobox.html index 3001f7d17..0ca32775b 100644 --- a/demos/autocomplete/combobox.html +++ b/demos/autocomplete/combobox.html @@ -9,6 +9,7 @@ <script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.button.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script> <link type="text/css" href="../demos.css" rel="stylesheet" /> <style type="text/css"> diff --git a/demos/autocomplete/custom-data.html b/demos/autocomplete/custom-data.html index 139b41d99..92263332d 100644 --- a/demos/autocomplete/custom-data.html +++ b/demos/autocomplete/custom-data.html @@ -8,6 +8,7 @@ <script type="text/javascript" src="../../ui/jquery.ui.core.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script> <link type="text/css" href="../demos.css" rel="stylesheet" /> <style type="text/css"> diff --git a/demos/autocomplete/default.html b/demos/autocomplete/default.html index d78b0576c..4d476d9a6 100644 --- a/demos/autocomplete/default.html +++ b/demos/autocomplete/default.html @@ -8,6 +8,7 @@ <script type="text/javascript" src="../../ui/jquery.ui.core.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script> <link type="text/css" href="../demos.css" rel="stylesheet" /> <script type="text/javascript"> diff --git a/demos/autocomplete/folding.html b/demos/autocomplete/folding.html index d5bc71e9d..5b665237e 100644 --- a/demos/autocomplete/folding.html +++ b/demos/autocomplete/folding.html @@ -8,6 +8,7 @@ <script type="text/javascript" src="../../ui/jquery.ui.core.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script> <link type="text/css" href="../demos.css" rel="stylesheet" /> <script type="text/javascript"> diff --git a/demos/autocomplete/multiple-remote.html b/demos/autocomplete/multiple-remote.html index 5e0f4b50b..5855ce0fb 100644 --- a/demos/autocomplete/multiple-remote.html +++ b/demos/autocomplete/multiple-remote.html @@ -8,6 +8,7 @@ <script type="text/javascript" src="../../ui/jquery.ui.core.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script> <link type="text/css" href="../demos.css" rel="stylesheet" /> <script type="text/javascript"> diff --git a/demos/autocomplete/multiple.html b/demos/autocomplete/multiple.html index 908cfe6ce..fe353255d 100644 --- a/demos/autocomplete/multiple.html +++ b/demos/autocomplete/multiple.html @@ -8,6 +8,7 @@ <script type="text/javascript" src="../../ui/jquery.ui.core.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script> <link type="text/css" href="../demos.css" rel="stylesheet" /> <script type="text/javascript"> diff --git a/demos/autocomplete/remote-jsonp.html b/demos/autocomplete/remote-jsonp.html index ab8a600a8..6de227d33 100644 --- a/demos/autocomplete/remote-jsonp.html +++ b/demos/autocomplete/remote-jsonp.html @@ -8,6 +8,7 @@ <script type="text/javascript" src="../../ui/jquery.ui.core.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script> <link type="text/css" href="../demos.css" rel="stylesheet" /> <script type="text/javascript"> diff --git a/demos/autocomplete/remote-with-cache.html b/demos/autocomplete/remote-with-cache.html index a00c741e4..664a9989e 100644 --- a/demos/autocomplete/remote-with-cache.html +++ b/demos/autocomplete/remote-with-cache.html @@ -8,6 +8,7 @@ <script type="text/javascript" src="../../ui/jquery.ui.core.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script> <link type="text/css" href="../demos.css" rel="stylesheet" /> <script type="text/javascript"> diff --git a/demos/autocomplete/remote.html b/demos/autocomplete/remote.html index 9414102e6..8b800b2d8 100644 --- a/demos/autocomplete/remote.html +++ b/demos/autocomplete/remote.html @@ -8,6 +8,7 @@ <script type="text/javascript" src="../../ui/jquery.ui.core.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script> <link type="text/css" href="../demos.css" rel="stylesheet" /> <script type="text/javascript"> diff --git a/demos/autocomplete/xml.html b/demos/autocomplete/xml.html index 3a5dadab9..83ffcf5c9 100644 --- a/demos/autocomplete/xml.html +++ b/demos/autocomplete/xml.html @@ -8,6 +8,7 @@ <script type="text/javascript" src="../../ui/jquery.ui.core.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script> <link type="text/css" href="../demos.css" rel="stylesheet" /> <script type="text/javascript"> diff --git a/tests/unit/index.html b/tests/unit/index.html index 4882098d7..6c16826f0 100644 --- a/tests/unit/index.html +++ b/tests/unit/index.html @@ -24,6 +24,7 @@ <script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.mouse.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.accordion.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.button.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.datepicker.js"></script> diff --git a/tests/visual/all.html b/tests/visual/all.html index 3e71216d7..5116a22ab 100644 --- a/tests/visual/all.html +++ b/tests/visual/all.html @@ -11,6 +11,7 @@ <script type="text/javascript" src="../../ui/jquery.ui.mouse.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.position.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.accordion.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.button.js"></script> <script type="text/javascript" src="../../ui/jquery.ui.datepicker.js"></script> diff --git a/tests/visual/autocomplete/autocomplete.html b/tests/visual/autocomplete/autocomplete.html index c39d032ff..3076f8640 100644 --- a/tests/visual/autocomplete/autocomplete.html +++ b/tests/visual/autocomplete/autocomplete.html @@ -9,6 +9,7 @@ <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.autocomplete.js"></script> <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script> <script type="text/javascript"> diff --git a/tests/visual/compound/widgets_in_dialog.html b/tests/visual/compound/widgets_in_dialog.html index 7551efd8d..66c152a30 100644 --- a/tests/visual/compound/widgets_in_dialog.html +++ b/tests/visual/compound/widgets_in_dialog.html @@ -13,7 +13,7 @@ <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script> - <script type="text/javascript" src="../../../ui/jquery.ui.autocomplete.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.datepicker.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script> diff --git a/tests/visual/menu/contextmenu.html b/tests/visual/menu/contextmenu.html index 6e9b85200..e81a3ac87 100644 --- a/tests/visual/menu/contextmenu.html +++ b/tests/visual/menu/contextmenu.html @@ -8,7 +8,7 @@ <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> - <script type="text/javascript" src="../../../ui/jquery.ui.autocomplete.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script> <script type="text/javascript"> $(function() { diff --git a/tests/visual/menu/drilldown.html b/tests/visual/menu/drilldown.html index 1539045f0..3833fcfd0 100644 --- a/tests/visual/menu/drilldown.html +++ b/tests/visual/menu/drilldown.html @@ -9,7 +9,7 @@ <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> <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.autocomplete.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script> <script type="text/javascript"> $(function() { $.widget("ui.drilldown", { diff --git a/tests/visual/menu/menu.html b/tests/visual/menu/menu.html index 93c33d4e2..efae8b1ae 100644 --- a/tests/visual/menu/menu.html +++ b/tests/visual/menu/menu.html @@ -7,7 +7,7 @@ <script type="text/javascript" src="../../../jquery-1.4.2.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> - <script type="text/javascript" src="../../../ui/jquery.ui.autocomplete.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script> <script type="text/javascript"> $(function() { diff --git a/tests/visual/menu/nested.html b/tests/visual/menu/nested.html index 063b946c7..6e0f5fbff 100644 --- a/tests/visual/menu/nested.html +++ b/tests/visual/menu/nested.html @@ -8,7 +8,7 @@ <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> - <script type="text/javascript" src="../../../ui/jquery.ui.autocomplete.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="../../../external/jquery.bgiframe-2.1.1.js"></script> <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script> <script type="text/javascript"> diff --git a/tests/visual/position/position.html b/tests/visual/position/position.html index 364fd32b2..0048350c3 100644 --- a/tests/visual/position/position.html +++ b/tests/visual/position/position.html @@ -9,7 +9,7 @@ <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> - <script type="text/javascript" src="../../../ui/jquery.ui.autocomplete.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script> <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script> <script type="text/javascript"> $(function() { diff --git a/ui/jquery.ui.autocomplete.js b/ui/jquery.ui.autocomplete.js index 070045d16..ed897b1e2 100644 --- a/ui/jquery.ui.autocomplete.js +++ b/ui/jquery.ui.autocomplete.js @@ -11,6 +11,7 @@ * jquery.ui.core.js * jquery.ui.widget.js * jquery.ui.position.js + * jquery.ui.menu.js */ (function( $ ) { diff --git a/ui/jquery.ui.menu.js b/ui/jquery.ui.menu.js new file mode 100644 index 000000000..2055f02df --- /dev/null +++ b/ui/jquery.ui.menu.js @@ -0,0 +1,177 @@ +/* + * jQuery UI Menu @VERSION + * + * Copyright (c) 2010 AUTHORS.txt (http://jqueryui.com/about) + * Dual licensed under the MIT (MIT-LICENSE.txt) + * and GPL (GPL-LICENSE.txt) licenses. + * + * http://docs.jquery.com/UI/Menu + * + * Depends: + * jquery.ui.core.js + * jquery.ui.widget.js + */ +(function($) { + +$.widget("ui.menu", { + _create: function() { + var self = this; + this.element + .addClass("ui-menu ui-widget ui-widget-content ui-corner-all") + .attr({ + role: "listbox", + "aria-activedescendant": "ui-active-menuitem" + }) + .click(function( event ) { + if ( !$( event.target ).closest( ".ui-menu-item a" ).length ) { + return; + } + // temporary + event.preventDefault(); + self.select( event ); + }); + this.refresh(); + }, + + refresh: function() { + var self = this; + + // don't refresh list items that are already adapted + var items = this.element.children("li:not(.ui-menu-item):has(a)") + .addClass("ui-menu-item") + .attr("role", "menuitem"); + + items.children("a") + .addClass("ui-corner-all") + .attr("tabindex", -1) + // mouseenter doesn't work with event delegation + .mouseenter(function( event ) { + self.activate( event, $(this).parent() ); + }) + .mouseleave(function() { + self.deactivate(); + }); + }, + + activate: function( event, item ) { + this.deactivate(); + if (this.hasScroll()) { + var offset = item.offset().top - this.element.offset().top, + scroll = this.element.attr("scrollTop"), + elementHeight = this.element.height(); + if (offset < 0) { + this.element.attr("scrollTop", scroll + offset); + } else if (offset > elementHeight) { + this.element.attr("scrollTop", scroll + offset - elementHeight + item.height()); + } + } + this.active = item.eq(0) + .children("a") + .addClass("ui-state-hover") + .attr("id", "ui-active-menuitem") + .end(); + this._trigger("focus", event, { item: item }); + }, + + deactivate: function() { + if (!this.active) { return; } + + this.active.children("a") + .removeClass("ui-state-hover") + .removeAttr("id"); + this._trigger("blur"); + this.active = null; + }, + + next: function(event) { + this.move("next", ".ui-menu-item:first", event); + }, + + previous: function(event) { + this.move("prev", ".ui-menu-item:last", event); + }, + + first: function() { + return this.active && !this.active.prev().length; + }, + + last: function() { + return this.active && !this.active.next().length; + }, + + move: function(direction, edge, event) { + if (!this.active) { + this.activate(event, this.element.children(edge)); + return; + } + var next = this.active[direction + "All"](".ui-menu-item").eq(0); + if (next.length) { + this.activate(event, next); + } else { + this.activate(event, this.element.children(edge)); + } + }, + + // TODO merge with previousPage + nextPage: function(event) { + if (this.hasScroll()) { + // TODO merge with no-scroll-else + if (!this.active || this.last()) { + this.activate(event, this.element.children(":first")); + return; + } + var base = this.active.offset().top, + height = this.element.height(), + result = this.element.children("li").filter(function() { + var close = $(this).offset().top - base - height + $(this).height(); + // TODO improve approximation + return close < 10 && close > -10; + }); + + // TODO try to catch this earlier when scrollTop indicates the last page anyway + if (!result.length) { + result = this.element.children(":last"); + } + this.activate(event, result); + } else { + this.activate(event, this.element.children(!this.active || this.last() ? ":first" : ":last")); + } + }, + + // TODO merge with nextPage + previousPage: function(event) { + if (this.hasScroll()) { + // TODO merge with no-scroll-else + if (!this.active || this.first()) { + this.activate(event, this.element.children(":last")); + return; + } + + var base = this.active.offset().top, + height = this.element.height(); + result = this.element.children("li").filter(function() { + var close = $(this).offset().top - base + height - $(this).height(); + // TODO improve approximation + return close < 10 && close > -10; + }); + + // TODO try to catch this earlier when scrollTop indicates the last page anyway + if (!result.length) { + result = this.element.children(":first"); + } + this.activate(event, result); + } else { + this.activate(event, this.element.children(!this.active || this.first() ? ":last" : ":first")); + } + }, + + hasScroll: function() { + return this.element.height() < this.element.attr("scrollHeight"); + }, + + select: function( event ) { + this._trigger("selected", event, { item: this.active }); + } +}); + +}(jQuery)); |