Skip to content

Commit cbd69be

Browse files
committed
first refactorings
1 parent d28a508 commit cbd69be

File tree

3 files changed

+87
-44
lines changed

3 files changed

+87
-44
lines changed

demo/index.html

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -71,8 +71,13 @@
7171
var menuId = ui.item.find(">a").attr("href");
7272
alert("select " + menuId + " on " + $(event.relatedTarget).text());
7373
},
74-
beforeOpen: function(event) {
75-
// alert("beforeopen on " + $(event.relatedTarget).text());
74+
beforeOpen: function(event, ui) {
75+
var $menu = ui.menu,
76+
target = event.relatedTarget;
77+
console.log("beforeOpen", this, event, ui);
78+
$menu.append($("<li>").text("hurz"));
79+
$menu.contextmenu("enableEntry", "cut", false);
80+
// optionally return false, to prevent opening the menu now
7681
}
7782
});
7883

@@ -119,12 +124,12 @@
119124
<h1>jquery.contextmenu.js</h1>
120125

121126
<p><a href="https://github.com/mar10/jquery-contextmenu">View project on GitHub</a></p>
122-
127+
123128
Not-so-obvious features:
124129
<ul>
125130
<li>`preventSelect: true` prevents accidential selection of the menu
126131
targets (i.e. 'AAA') when double-clicking or dragging the mouse.
127-
<li>`taphold: true` enables long-press to open the menu (useful on
132+
<li>`taphold: true` enables long-press to open the menu (useful on
128133
tablet computers).
129134
<li>Ctrl+Click or two-finger-click on the touchpad also works (MacBook).
130135
<li>The menu is modified in the `beforeOpen` event.

jquery.ui-contextmenu.js

Lines changed: 76 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -35,24 +35,31 @@
3535
open: $.noop, // menu was opened
3636
select: $.noop // menu option was selected; return `false` to prevent closing
3737
},
38+
/**
39+
*
40+
*/
3841
_create: function () {
3942
var opts = this.options,
4043
eventNames = "contextmenu" + NS,
4144
targetId = this.element.uniqueId().attr("id");
4245

46+
this.$headStyle = null;
47+
this.orgMenu = null;
48+
this.currentTarget = null;
49+
4350
if(opts.taphold){
4451
eventNames += " taphold" + NS;
4552
}
4653
if(opts.preventSelect){
4754
// Create a global style for all potential menu targets
4855
this.$headStyle = $("<style>")
4956
.prop("type", "text/css")
50-
.html("#" + targetId + " " + opts.delegate + " {" +
51-
"-webkit-user-select: none;" +
52-
"-khtml-user-select: none;" +
53-
"-moz-user-select: none;" +
54-
"-ms-user-select: none;" +
55-
"user-select: none;" +
57+
.html("#" + targetId + " " + opts.delegate + " { " +
58+
"-webkit-user-select: none; " +
59+
"-khtml-user-select: none; " +
60+
"-moz-user-select: none; " +
61+
"-ms-user-select: none; " +
62+
"user-select: none; " +
5663
"}")
5764
.appendTo("head");
5865
// TODO: the selectstart is not supported by FF?
@@ -66,6 +73,28 @@
6673
this.orgMenu = opts.menu;
6774
opts.menu = $.ui.contextmenu.createMenuMarkup(opts.menu);
6875
}
76+
// Create - but hide - context-menu
77+
this._getMenu()
78+
.hide()
79+
.addClass("ui-contextmenu")
80+
// Create a menu instance that delegates events to our widget
81+
.menu({
82+
blur: $.proxy(this.options.blur, this),
83+
create: $.proxy(this.options.create, this),
84+
focus: $.proxy(this.options.focus, this),
85+
select: $.proxy(function(event, ui){
86+
// Also pass the target that the menu was triggered on:
87+
event.relatedTarget = this.currentTarget;
88+
// ignore clicks, if they only open a sub-menu
89+
var isParent = (ui.item.has(">a[aria-haspopup='true']").length > 0);
90+
if( !isParent || !this.options.ignoreParentSelect){
91+
if( this._trigger.call(this, "select", event, ui) !== false ){
92+
this._closeMenu.call(this);
93+
}
94+
event.preventDefault();
95+
}
96+
}, this)
97+
});
6998
this.element.delegate(opts.delegate, eventNames, $.proxy(this._openMenu, this));
7099
// emulate a 'taphold' event
71100
this._trigger("init");
@@ -110,39 +139,44 @@
110139
$menu = this._getMenu(),
111140
openEvent = event,
112141
// if called by 'open' method, 'relatedTarget' is the requested target object
113-
parentTarget = openEvent.target ? openEvent.target : openEvent;
142+
parentTarget = openEvent.target ? openEvent.target : openEvent,
143+
ui = {menu: $menu};
144+
this.currentTarget = openEvent.target;
114145
// Prevent browser from opening the system context menu
115146
event.preventDefault();
116147
// Also pass the target that the menu was triggered on as 'relatedTarget'.
117148
// This is required because our _trigger() calls will create events
118149
// that refer to the contextmenu's context (which is the target *container*)
119-
event.relatedTarget = openEvent.target;
150+
event.relatedTarget = this.currentTarget;
120151

121-
if( this._trigger("beforeOpen", event) === false ){
152+
if( this._trigger("beforeOpen", event, ui) === false ){
122153
return false;
123154
}
155+
156+
// TODO: $menu.refresh() if menu was modified
157+
124158
// Create - but hide - context-menu
125-
$menu
126-
.hide()
127-
.addClass("ui-contextmenu")
128-
// Create a menu instance that delegates events to our widget
129-
.menu({
130-
blur: $.proxy(this.options.blur, this),
131-
create: $.proxy(this.options.create, this),
132-
focus: $.proxy(this.options.focus, this),
133-
select: function(event, ui){
134-
// Also pass the target that the menu was triggered on:
135-
event.relatedTarget = openEvent.target;
136-
// ignore clicks, if they only open a sub-menu
137-
var isParent = (ui.item.has(">a[aria-haspopup='true']").length > 0);
138-
if( !isParent || !self.options.ignoreParentSelect){
139-
if( self._trigger.call(self, "select", event, ui) !== false ){
140-
self._closeMenu.call(self);
141-
}
142-
event.preventDefault();
143-
}
144-
}
145-
});
159+
// $menu
160+
// .hide()
161+
// .addClass("ui-contextmenu")
162+
// // Create a menu instance that delegates events to our widget
163+
// .menu({
164+
// blur: $.proxy(this.options.blur, this),
165+
// create: $.proxy(this.options.create, this),
166+
// focus: $.proxy(this.options.focus, this),
167+
// select: function(event, ui){
168+
// // Also pass the target that the menu was triggered on:
169+
// event.relatedTarget = openEvent.target;
170+
// // ignore clicks, if they only open a sub-menu
171+
// var isParent = (ui.item.has(">a[aria-haspopup='true']").length > 0);
172+
// if( !isParent || !self.options.ignoreParentSelect){
173+
// if( self._trigger.call(self, "select", event, ui) !== false ){
174+
// self._closeMenu.call(self);
175+
// }
176+
// event.preventDefault();
177+
// }
178+
// }
179+
// });
146180
// Register global event handlers that close the dropdown-menu
147181
$(document).bind("keydown" + NS, function(event){
148182
if( event.which === $.ui.keyCode.ESCAPE ){
@@ -174,27 +208,31 @@
174208
_closeMenu: function(){
175209
var self = this,
176210
$menu = this._getMenu();
177-
if(this.tapTimer){
178-
clearTimeout(this.tapTimer);
179-
this.tapTimer = null;
180-
}
181211
$menu.fadeOut(function() {
182212
self._trigger("close");
213+
this.currentTarget = null;
183214
});
215+
$(document)
216+
.unbind("mousedown" + NS)
217+
.unbind("touchstart" + NS)
218+
.unbind("keydown" + NS);
184219
},
185220
/**
186221
* Open context menu on a specific target (must match options.delegate)
187222
*/
188223
open: function(target){
189-
// Fake a contextmenu event
224+
// Fake a 'contextmenu' event
190225
var e = jQuery.Event("contextmenu", {target: target.get(0)});
191226
return this.element.trigger(e);
192227
},
193-
/**
194-
* Close context menu.
195-
*/
228+
/** Close context menu. */
196229
close: function(){
197230
return this._closeMenu.call(this);
231+
},
232+
/** Enable or disable the menu command. */
233+
enableEntry: function(cmd, flag){
234+
var $entry = this.element.find("a[href=#" + cmd + "]");
235+
$entry.toggleClass("ui-status-disabled", (flag === false));
198236
}
199237
});
200238

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.

0 commit comments

Comments
 (0)