Skip to content

Commit 9606e82

Browse files
mar10mar10
committed
Added replaceMenu() method
1 parent 3267f1c commit 9606e82

File tree

6 files changed

+139
-83
lines changed

6 files changed

+139
-83
lines changed

‎README.md

Lines changed: 26 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22

33
A jQuery plugin that provides a context menu (based on the standard [jQueryUI menu] widget).
44

5+
* Define menus from `<ul>` element or definition list (i.e.
6+
`[{title: "Paste", cmd: "paste"}, ...]`).
57
* Themable using [jQuery ThemeRoller](http://jqueryui.com/themeroller/).
68
* Supports delegation (i.e. can be bound to elements that don't exist at the
79
time the context menu is initialized).
@@ -141,11 +143,32 @@ structure (see [jQueryUI menu] for details):
141143
Close context menu if open.<br>
142144
Call like <code>$(...).contextmenu("close");</code>.
143145
</dd>
146+
<dt>enableEntry(cmd, flag)</dt>
147+
<dd>
148+
Enable or disable the entry. `flag` defaults to `true`<br>
149+
Call like <code>$(...).contextmenu("enableEntry", "paste", false);</code>.
150+
</dd>
144151
<dt>open(target)</dt>
145152
<dd>
146153
Open context menu on a specific target (target must match the options.delegate filter).<br>
147154
Call like <code>$(...).contextmenu("open", target);</code>.
148155
</dd>
156+
<dt>replaceMenu(menu)</dt>
157+
<dd>
158+
Replace the whole menu definition.<br>
159+
Call like <code>$(...).contextmenu("replaceMenu", "#menu2");</code>.
160+
</dd>
161+
<dt>setEntry(cmd, data)</dt>
162+
<dd>
163+
Redefine menu entry (title or all of it).<br>
164+
`data` may be a title string or a menu definition object.<br>
165+
Call like <code>$(...).contextmenu("setEntry", "paste", "Paste link");</code>.
166+
</dd>
167+
<dt>showEntry(cmd, flag)</dt>
168+
<dd>
169+
Show or hide the entry. `flag` defaults to `true`<br>
170+
Call like <code>$(...).contextmenu("showEntry", "paste", false);</code>.
171+
</dd>
149172
</dl>
150173

151174

@@ -179,7 +202,9 @@ $("#container").bind("contextmenuselect", function(event, ui) {
179202
<dt>beforeOpen(event)</dt>
180203
<dd>
181204
Triggered just before the popup menu is opened.<br>
182-
Return <code>false</code> to prevent opening.
205+
Return <code>false</code> to prevent opening.<br>
206+
This is also a good place to modify the menu (i.e. hiding, disabling, or
207+
renaming entries, or replace the menu altogether).
183208
</dd>
184209
<dt>blur(event, ui)</dt>
185210
<dd>

‎demo/index.html

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -85,7 +85,8 @@
8585
$target = $(event.relatedTarget);
8686
console.log("beforeOpen", this, event, ui, "" + CLIPBOARD);
8787
$(document)
88-
// .contextmenu("setEntry", "cut", {title: "cuty", uiIcon: "ui-icon-heart", disabled: true})
88+
// .contextmenu("replaceMenu", [{title: "aaa"}, {title: "bbb"}])
89+
// .contextmenu("setEntry", "cut", {title: "Cuty", uiIcon: "ui-icon-heart", disabled: true})
8990
.contextmenu("setEntry", "copy", "Copy '" + $target.text() + "'")
9091
.contextmenu("setEntry", "paste", "Paste" + (CLIPBOARD ? " '" + CLIPBOARD + "'" : ""))
9192
.contextmenu("enableEntry", "paste", (CLIPBOARD !== ""));
@@ -109,6 +110,7 @@
109110
$("#info").text("");
110111
},
111112
beforeOpen: function(event) {
113+
// $("#container").contextmenu("replaceMenu", [{title: "aaa"}, {title: "bbb"}]);
112114
// alert("beforeopen on " + $(event.relatedTarget).text());
113115
},
114116
open: function(event, ui) {

‎jquery.ui-contextmenu.js

Lines changed: 59 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -41,9 +41,7 @@
4141
open: $.noop, // menu was opened
4242
select: $.noop // menu option was selected; return `false` to prevent closing
4343
},
44-
/**
45-
*
46-
*/
44+
/** Contrutcor */
4745
_create: function () {
4846
var opts = this.options,
4947
eventNames = "contextmenu" + NS,
@@ -75,11 +73,13 @@
7573
});
7674
}
7775
}
76+
// If a menu definition array was passed, create a hidden <ul>
77+
// and generate the structure now
7878
if($.isArray(opts.menu)){
7979
this.orgMenu = opts.menu;
8080
opts.menu = $.ui.contextmenu.createMenuMarkup(opts.menu);
8181
}
82-
// Create - but hide - context-menu
82+
// Create - but hide - the jQuery UI Menu
8383
this._getMenu()
8484
.hide()
8585
.addClass("ui-contextmenu")
@@ -105,41 +105,20 @@
105105
// emulate a 'taphold' event
106106
this._trigger("init");
107107
},
108-
/**
109-
*
110-
*/
108+
/** Destructor, called on $().contextmenu("destroy"). */
111109
_destroy: function(key, value){
112110
if(this.$headStyle){
113111
this.$headStyle.remove();
114112
this.$headStyle = null;
115113
}
114+
// Remove temporary <ul> if any
116115
if(this.orgMenu){
117116
this.options.menu.remove();
118117
this.options.menu = this.orgMenu;
119118
this.orgMenu = null;
120119
}
121120
},
122-
/**
123-
* Handle $().contextmenu("option", ...) calls.
124-
*/
125-
_setOption: function(key, value){
126-
$.Widget.prototype._setOption.apply(this, arguments);
127-
},
128-
/** Return ui-menu root element as jQuery object. */
129-
_getMenu: function(){
130-
// this.options.menu may be a string, jQuery or a function returning that.
131-
var $menu = this.options.menu;
132-
if( $.isFunction($menu) ){
133-
$menu = $menu();
134-
}
135-
return (typeof $menu === "string") ? $($menu) : $menu;
136-
},
137-
/** Return ui-menu widget instance (works on pre and post jQueryUI 1.9). */
138-
// _getMenuWidget: function(){
139-
// var $menu = this._getMenu();
140-
// return $menu.data("ui-menu") || $menu.data("menu");
141-
// },
142-
/** Open dropdown. */
121+
/** Open popup (called on 'contextmenu' event). */
143122
_openMenu: function(event){
144123
var self = this,
145124
$menu = this._getMenu(),
@@ -169,6 +148,7 @@
169148
self._closeMenu();
170149
}
171150
});
151+
// Finally display the popup
172152
$menu
173153
.show() // required to fix positioning error (issue #3)
174154
.css({
@@ -185,7 +165,7 @@
185165
self._trigger.call(self, "open", event);
186166
});
187167
},
188-
/** Close dropdown. */
168+
/** Close popup. */
189169
_closeMenu: function(){
190170
var self = this,
191171
$menu = this._getMenu();
@@ -198,9 +178,28 @@
198178
.unbind("touchstart" + NS)
199179
.unbind("keydown" + NS);
200180
},
201-
/**
202-
* Open context menu on a specific target (must match options.delegate)
203-
*/
181+
/** Handle $().contextmenu("option", key, value) calls. */
182+
_setOption: function(key, value){
183+
// var opts = this.options,
184+
// $menu = this._getMenu();
185+
186+
switch(key){
187+
case "menu":
188+
this.replaceMenu(value);
189+
break;
190+
}
191+
$.Widget.prototype._setOption.apply(this, arguments);
192+
},
193+
/** Return ui-menu root element as jQuery object. */
194+
_getMenu: function(){
195+
// this.options.menu may be a string, jQuery or a function returning that.
196+
var $menu = this.options.menu;
197+
// if( $.isFunction($menu) ){
198+
// $menu = $menu();
199+
// }
200+
return (typeof $menu === "string") ? $($menu) : $menu;
201+
},
202+
/** Open context menu on a specific target (must match options.delegate) */
204203
open: function(target){
205204
// Fake a 'contextmenu' event
206205
var e = jQuery.Event("contextmenu", {target: target.get(0)});
@@ -212,13 +211,35 @@
212211
},
213212
/** Enable or disable the menu command. */
214213
enableEntry: function(cmd, flag){
214+
// TODO: should be $menu.find(...)!
215215
var $entry = this.element.find("a[href=#" + normCommand(cmd) + "]");
216216
$entry.toggleClass("ui-state-disabled", (flag === false));
217217
},
218218
/** Redefine the whole menu. */
219-
replaceMenu: function(menu){
220-
// TODO: $menu.refresh() if menu was modified
221-
$.error("not implemented");
219+
replaceMenu: function(data){
220+
// return this.element.contextmenu("option", "menu", menu);
221+
var opts = this.options,
222+
$menu = this._getMenu();
223+
224+
if($.isArray(data)){
225+
if(this.orgMenu){
226+
// re-use existing temporary <ul>
227+
$menu.empty();
228+
$.ui.contextmenu.createMenuMarkup(data, opts.menu);
229+
$menu.menu("refresh");
230+
}else{
231+
$.error("not implemented");
232+
// this.orgMenu = opts.menu;
233+
// opts.menu = $.ui.contextmenu.createMenuMarkup(data);
234+
}
235+
}else{
236+
// if(this.orgMenu){
237+
// // re-use existing temporary <ul>
238+
// }else{
239+
// }
240+
// $menu.menu("option", "menu", opts.menu);
241+
$.error("not implemented");
242+
}
222243
},
223244
/** Redefine menu entry (title or all of it). */
224245
setEntry: function(cmd, titleOrData){
@@ -245,7 +266,9 @@
245266
}
246267
});
247268

248-
269+
/*
270+
* Global functions
271+
*/
249272
$.extend($.ui.contextmenu, {
250273
/** Convert a menu description into a into a <li> content. */
251274
createEntryMarkup: function(entry, $parentLi){

‎jquery.ui-contextmenu.min.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 41 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,44 @@
11
{
2-
"name": "ui-contextmenu",
3-
"title": "jQuery UI context menu plugin",
4-
"description": "jQuery UI plugin that turns a jQuery UI Menu widget into a context menu.",
5-
"version": "0.2.0",
6-
"homepage": "https://github.com/mar10/jquery-ui-contextmenu",
7-
"author": {
8-
"name": "Martin Wendt",
9-
"url": "http://careers.stackoverflow.com/martin-wendt"
10-
},
11-
"repository": {
12-
"type": "git",
13-
"url": "https://github.com/mar10/jquery-ui-contextmenu"
14-
},
15-
"bugs": {
16-
"url": "https://github.com/mar10/jquery-ui-contextmenu/issues"
17-
},
18-
"licenses": [
19-
{
20-
"type": "MIT",
21-
"url": "https://github.com/mar10/jquery-ui-contextmenu/blob/master/MIT-LICENSE.txt"
2+
"name": "ui-contextmenu",
3+
"version": "0.3.0",
4+
5+
"title": "jQuery UI context menu plugin",
6+
"description": "Turn a jQuery UI Menu widget into a context menu.",
7+
"keywords": ["context-menu", "contetxtmenu", "menu", "delegate",
8+
"jquery-ui-menu", "popup", "right-click"],
9+
10+
"author": {
11+
"name": "Martin Wendt",
12+
"email": "jquery@wwwendt.de",
13+
"url": "http://careers.stackoverflow.com/martin-wendt"
14+
},
15+
"repository": {
16+
"type": "git",
17+
"url": "https://github.com/mar10/jquery-ui-contextmenu"
18+
},
19+
"homepage": "https://github.com/mar10/jquery-ui-contextmenu",
20+
"demo": "http://wwwendt.de/tech/demo/jquery-contextmenu/demo/",
21+
"docs": "https://github.com/mar10/jquery-ui-contextmenu/blob/master/README.md",
22+
"bugs": "https://github.com/mar10/jquery-ui-contextmenu/issues",
23+
"licenses": [
24+
{
25+
"type": "MIT",
26+
"url": "https://github.com/mar10/jquery-ui-contextmenu/blob/master/MIT-LICENSE.txt"
27+
}
28+
],
29+
"dependencies": {
30+
"jquery": ">=1.7"
31+
},
32+
"devDependencies": {
33+
"grunt": "~0.4.1",
34+
"grunt-contrib-jshint": "~0.3.0",
35+
"grunt-contrib-uglify": "~0.2.0",
36+
"grunt-contrib-qunit": "~0.2.0",
37+
"grunt-contrib-concat": "~0.1.3",
38+
"grunt-exec": "~0.4.0",
39+
"grunt-contrib-connect": "~0.3.0"
40+
},
41+
"scripts": {
42+
"test": "grunt ci --verbose"
2243
}
23-
],
24-
"dependencies": {
25-
"jquery": "~1.8"
26-
},
27-
"keywords": [],
28-
"devDependencies": {
29-
"grunt": "~0.4.1",
30-
"grunt-contrib-jshint": "~0.3.0",
31-
"grunt-contrib-uglify": "~0.2.0",
32-
"grunt-contrib-qunit": "~0.2.0",
33-
"grunt-contrib-concat": "~0.1.3",
34-
"grunt-exec": "~0.4.0",
35-
"grunt-contrib-connect": "~0.3.0"
36-
},
37-
"scripts": {
38-
"test": "grunt ci --verbose"
39-
}
4044
}

‎ui-contextmenu.jquery.json

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,12 @@
11
{
22
"name": "ui-contextmenu",
3-
"title": "jQuery UI context menu plugin",
4-
"description": "Turns a jQuery UI Menu widget into a context menu.",
53
"version": "0.3.0",
6-
"homepage": "https://github.com/mar10/jquery-ui-contextmenu",
4+
5+
"title": "jQuery UI context menu plugin",
6+
"description": "Turn a jQuery UI Menu widget into a context menu.",
7+
"keywords": ["context-menu", "contetxtmenu", "menu", "delegate",
8+
"jquery-ui-menu", "popup", "right-click"],
9+
710
"author": {
811
"name": "Martin Wendt",
912
"email": "jquery@wwwendt.de",
@@ -13,6 +16,7 @@
1316
"type": "git",
1417
"url": "https://github.com/mar10/jquery-ui-contextmenu"
1518
},
19+
"homepage": "https://github.com/mar10/jquery-ui-contextmenu",
1620
"demo": "http://wwwendt.de/tech/demo/jquery-contextmenu/demo/",
1721
"docs": "https://github.com/mar10/jquery-ui-contextmenu/blob/master/README.md",
1822
"bugs": "https://github.com/mar10/jquery-ui-contextmenu/issues",
@@ -25,7 +29,5 @@
2529
"dependencies": {
2630
"jquery": ">=1.7",
2731
"jqueryui": ">=1.9"
28-
},
29-
"keywords": ["context-menu", "contetxtmenu", "menu", "delegate",
30-
"jquery-ui-menu", "popup", "right-click"]
32+
}
3133
}

0 commit comments

Comments
 (0)