r3371 committed - autocomplete and menu: first attempt a paging
Revision: 3371
Author: joern.zaefferer
Date: Sat Oct 17 05:04:47 2009
Log: autocomplete and menu: first attempt a paging
http://code.google.com/p/jquery-ui/source/detail?r=3371
Modified:
/branches/dev/tests/visual/menu/default.html
/branches/dev/ui/jquery.ui.autocomplete.js
/branches/dev/ui/jquery.ui.menu.js
=======================================
--- /branches/dev/tests/visual/menu/default.html Sat Sep 26 04:12:14 2009
+++ /branches/dev/tests/visual/menu/default.html Sat Oct 17 05:04:47 2009
@@ -17,10 +17,14 @@
top: 10
}).appendTo(document.body).themeswitcher();
- $("#menu1, #menu2").menu({
+ var menus = $("#menu1, #menu2").menu({
selected: function(event, ui) {
$("<div/>").text("Selected: " + ui.item.text()).appendTo("#log");
}
+ });
+
+ $("#controls button").click(function() {
+ menus.menu(this.id);
});
});
</script>
@@ -29,6 +33,13 @@
</style>
</head>
<body>
+
+<div id="controls">
+ <button id="next">Next</button>
+ <button id="previous">Previous</button>
+ <button id="nextPage">Next Page</button>
+ <button id="previousPage">Previous Page</button>
+</div>
<ul id="menu1">
<li><a href="#">Aberdeen</a></li>
=======================================
--- /branches/dev/ui/jquery.ui.autocomplete.js Tue Sep 29 15:49:34 2009
+++ /branches/dev/ui/jquery.ui.autocomplete.js Sat Oct 17 05:04:47 2009
@@ -21,11 +21,17 @@
// keyup is triggered only once when hold down, keypress multiple times
.keypress(function(event) {
switch(event.keyCode) {
+ case $.ui.keyCode.PAGE_UP:
+ self.move("previousPage");
+ break;
+ case $.ui.keyCode.PAGE_DOWN:
+ self.move("nextPage");
+ break;
case $.ui.keyCode.UP:
- self.focusUp();
+ self.move("previous");
break;
case $.ui.keyCode.DOWN:
- self.focusDown();
+ self.move("next");
break;
case $.ui.keyCode.ENTER:
self.select();
@@ -160,20 +166,12 @@
});
},
- focusUp: function() {
+ move: function(direction) {
if (!this.menu) {
this.search();
return;
}
- this.menu.menu("previous");
- },
-
- focusDown: function() {
- if (!this.menu) {
- this.search();
- return;
- }
- this.menu.menu("next");
+ this.menu.menu(direction);
},
select: function() {
=======================================
--- /branches/dev/ui/jquery.ui.menu.js Tue Sep 29 15:36:34 2009
+++ /branches/dev/ui/jquery.ui.menu.js Sat Oct 17 05:04:47 2009
@@ -42,30 +42,54 @@
},
next: function() {
+ this.move("next", "li:first");
+ },
+
+ previous: function() {
+ this.move("prev", "li:last");
+ },
+
+ move: function(direction, edge) {
if (!this.activeitem) {
- this.activate(this.element.children("li:first").children("a"));
+ this.activate(this.element.children(edge).children("a"));
return;
}
this.deactivate(this.activeitem);
- var next = this.activeitem.parent().next();
+ var next = this.activeitem.parent()[direction]();
if (next.length) {
this.activate(next.children("a"));
} else {
- this.activate(this.element.children("li:first").children("a"));
- }
+ this.activate(this.element.children(edge).children("a"));
+ }
+
+ /* scroll when necessary; need to adapt this code...
+ var offset = 0;
+ listItems.slice(0, active).each(function() {
+ offset += this.offsetHeight;
+ });
+ if ((offset + activeItem[0].offsetHeight - list.scrollTop()) >
list[0].clientHeight) {
+ list.scrollTop(offset + activeItem[0].offsetHeight -
list.innerHeight());
+ } else if (offset < list.scrollTop()) {
+ list.scrollTop(offset);
+ }
+ */
},
- previous: function() {
- if (!this.activeitem) {
- this.activate(this.element.children("li:last").children("a"));
- return;
- }
- this.deactivate(this.activeitem);
- var prev = this.activeitem.parent().prev();
- if (prev.length) {
- this.activate(prev.children("a"));
- } else {
- this.activate(this.element.children("li:last").children("a"));
+ nextPage: function() {
+ // TODO calculate pagesize
+ var pagesize = 8;
+ for (var i = 0; i < pagesize; i++) {
+ // TODO prevent triggering a focus event multiple times
+ this.move("next", "li:first");
+ }
+ },
+
+ previousPage: function() {
+ // TODO calculate pagesize
+ var pagesize = 8;
+ for (var i = 0; i < pagesize; i++) {
+ // TODO prevent triggering a focus event multiple times
+ this.move("prev", "li:last");
}
},