r924 - in branches/experimental: tests/visual/menu ui
Author: paul.bakaus
Date: Wed Nov 12 05:57:55 2008
New Revision: 924
Modified:
branches/experimental/tests/visual/menu/menu.html
branches/experimental/ui/ui.menu.js
Log:
menu: fixed issue with the add position syntax - it's now possible to
append an item to the end of a (sub)list, by simply giving it the last
number - i.e., if you have 5 entries, tell him to append it at '6'
Modified: branches/experimental/tests/visual/menu/menu.html
==============================================================================
--- branches/experimental/tests/visual/menu/menu.html (original)
+++ branches/experimental/tests/visual/menu/menu.html Wed Nov 12 05:57:55
2008
@@ -55,7 +55,7 @@
},
open: function(e, ui) {
- //$(this).menu('add', '<li><a href="#">Test Item 1</a></li>');
+ $(this).menu('add', '<li><a href="#">Test Item 1</a></li>', '7');
$(this).menu('add', '<li><a href="#">Test Item 2</a><ul><li><a
href="#">Test Item Sub</a></li></ul></li>', '1/1');
//console.log('Opened menu');
Modified: branches/experimental/ui/ui.menu.js
==============================================================================
--- branches/experimental/ui/ui.menu.js (original)
+++ branches/experimental/ui/ui.menu.js Wed Nov 12 05:57:55 2008
@@ -40,6 +40,20 @@
},
+ _generateMarkupFromJSON: function(json) {
+
+ var html = $('<ul></ul>');
+
+ for(var i in json) {
+ var item = $('<li><a href="#">'+i+'</a></li>').appendTo(html);
+ if(json[i].items)
item.append(this._generateMarkupFromJSON(json[i].items));
+
+ }
+
+ return html;
+
+ },
+
_createMenu: function() {
var o = this.options, self = this;
@@ -160,9 +174,35 @@
},
_resetDrilldown: function(stayOpen) {
+
this.breadcrumb.empty().append(this.crumbDefaultHeader);
$('.ui-menu-current', this.menu).removeClass('ui-menu-current');
if (!stayOpen) { this.menu.find('.ui-menu-dd ul').css({
visibility: 'hidden' }); }
+
+ },
+
+ _refreshDrilldownHeight: function() {
+
+ // standardize all menu heights & widths so that they cover the previous
menu completely
+ var listHeights = [];
+ this.items.find('ul').each(function(i){ listHeights[i] =
$(this).height(); });
+ listHeights.sort(function(a, b) { return b - a; });
+ this.items.find('ul').css({ height: listHeights[0], width:
this.options.width });
+
+ // apply scrollbar to the menu when it exceeds max height
+ if (listHeights[0] > this.options.maxHeight) {
+ this.menu
+ .find('.ui-menu-dd')
+ .addClass('ui-menu-scroll')
+ .css({ height: this.options.maxHeight,
overflow: 'auto', 'overflow-x': 'hidden' })
+ .find('ul')
+ .css({ width: this.options.width - 16 });
+ } else {
+ this.menu
+ .find('.ui-menu-dd')
+ .css({ height: listHeights[0] }).find('ul').css({ width:
this.options.width });
+ };
+
},
_prepareDrilldown: function() {
@@ -195,27 +235,9 @@
};
};
});
-
- // standardize all menu heights & widths so that they cover the
previous menu completely
- var listHeights = [];
- this.items.find('ul').each(function(i){ listHeights[i] =
$(this).height(); });
- listHeights.sort(function(a, b) { return b - a; });
- this.items.find('ul').css({ height: listHeights[0], width:
this.options.width });
-
- // apply scrollbar to the menu when it exceeds max height
- if (listHeights[0] > this.options.maxHeight) {
- this.menu
- .find('.ui-menu-dd')
- .addClass('ui-menu-scroll')
- .css({ height: this.options.maxHeight,
overflow: 'auto', 'overflow-x': 'hidden' })
- .find('ul')
- .css({ width: this.options.width - 16 });
- } else {
- this.menu
- .find('.ui-menu-dd')
- .css({ height: listHeights[0] }).find('ul').css({ width:
this.options.width });
- };
+
+ this._refreshDrilldownHeight();
};
@@ -224,7 +246,7 @@
this.breadcrumb.append(this.crumbDefaultHeader);
- self.items.find('a').bind('click.menu', function(e){
+ $('a', this.items).bind('click.menu', function(e){
if ($(this).is('.ui-menu-indicator') ||
$(this).is('.ui-menu-nextlevel')) {
self._nextDrilldownLevel(this, e);
return false;
@@ -364,19 +386,7 @@
},
- _generateMarkupFromJSON: function(json) {
-
- var html = $('<ul></ul>');
- for(var i in json) {
- var item = $('<li><a href="#">'+i+'</a></li>').appendTo(html);
- if(json[i].items)
item.append(this._generateMarkupFromJSON(json[i].items));
-
- }
-
- return html;
-
- },
add: function(item, position) {
@@ -388,22 +398,33 @@
} else {
position = position.split('/');
- var hash = '', old = '', append;
+ var hash = '> ', old = '', append, dir = 'before';
for (var i=0; i < position.length; i++) {
- old = hash; hash += 'li:eq(' + (parseInt(position[i],10)-1) + ') ';
- if(!$(hash, this.items).length) { append = true; break; }
+ old = hash; hash += 'ul > li:eq(' + (parseInt(position[i],10)-1)
+ ') ';
+
+ if(!$(hash, this.menu).length) {
+
+ if($(old + 'ul > li:eq(' + (parseInt(position[i],10)-2) + ')',
this.menu).length) {
+ hash = old + 'ul > li:eq(' + (parseInt(position[i],10)-2) + ')';
+ dir = 'after';
+ } else {
+ append = true;
+ }
+ break;
+
+ }
};
if(!append) { //We want to have it before/after a node
- $(hash, this.items).before(item);
+ $(hash, this.menu)[dir](item);
} else {
- if(!$(old, this.items).find('ul').length) {
- $(old, this.items).append('<ul></ul>');
- this._attachFlyoutStyles($(old, this.items)[0]);
+ if(!$(old, this.menu).find('ul').length) {
+ $(old, this.menu).append('<ul></ul>');
+ this._attachFlyoutStyles($(old, this.menu)[0]);
}
- $(old, this.items).find('ul').append(item);
+ $(old, this.menu).find('ul').append(item);
}