Skip to content

Commit 411dcc6

Browse files
committed
2 parents 9f61325 + 4e31e9b commit 411dcc6

File tree

4 files changed

+53
-49
lines changed

4 files changed

+53
-49
lines changed

CHANGELOG.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
# 1.17.0-1 / Unreleased
22

3+
* [FEATURE] #59 Allow callbacks for `disabled` and `title` options
34
* [FEATURE] #116 `autoFocus` skips leading disabled entries.
45
* [FEATURE] #118 New option `closeOnWindowBlur`
56
* Use `.on()` / `.off()` syntax

demo/index_local.html

Lines changed: 16 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -3,38 +3,22 @@
33
<head>
44
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
55
<title>jquery.ui-contextmenu.js - Demo</title>
6+
<!--
7+
<link href="../node_modules/jquery-ui/themes/base/jquery.ui.all.css" rel="stylesheet">
8+
<script src="../lib/jquery.js"></script>
9+
<script src="../lib/jquery-ui.custom.js"></script>
10+
-->
11+
<link href="../node_modules/jquery-ui-dist/jquery-ui.css" rel="stylesheet">
612

7-
<link rel="stylesheet" href="../node_modules/jquery-ui/themes/base/jquery.ui.all.css">
813
<script src="../node_modules/jquery/dist/jquery.js"></script>
9-
<script src="../node_modules/jquery-ui/ui/jquery-ui.js"></script>
10-
14+
<script src="../node_modules/jquery-ui-dist/jquery-ui.js"></script>
1115
<!-- Some custom library to enable 'taphold' events -->
12-
<script src="jquery-taphold/taphold.js" type="text/javascript"></script>
13-
14-
<!-- Custom library to add a dynamic themeroller switcher -->
15-
<script type="text/javascript" src="../lib/Super-Theme-Switcher/jquery.themeswitcher.js"></script>
16+
<script src="jquery-taphold/taphold.js"></script>
1617

17-
<script src="../jquery.ui-contextmenu.js" type="text/javascript"></script>
18+
<script src="../jquery.ui-contextmenu.js"></script>
1819

1920
<style type="text/css">
2021

21-
body{
22-
font-family: "Trebuchet MS", "Helvetica", "Arial", "Verdana", "sans-serif";
23-
font-size: .8em;
24-
/* Prevent tablets from selecting text on taphold, etc:
25-
Note:
26-
If only the potential menu trigger elements should be protected, simply
27-
use the 'preventSelect: true' option.
28-
But we disable it more globally for tablet PCs, because the whole line
29-
or paragraph will still be selected otherwise.
30-
*/
31-
-webkit-user-select: none;
32-
-khtml-user-select: none;
33-
-moz-user-select: none;
34-
-ms-user-select: none;
35-
user-select: none;
36-
}
37-
3822
.hasmenu, .hasmenu2 {
3923
border: 1px solid #008;
4024
margin: 3px;
@@ -61,28 +45,25 @@
6145
<script type="text/javascript">
6246
var CLIPBOARD = "";
6347
$(function(){
64-
/* Enable a themeroller theme-switching using a combobox. */
65-
$("#switcher").themeswitcher({
66-
jqueryuiversion: "1",
67-
imgpath: "../lib/Super-Theme-Switcher/images/",
68-
loadTheme: "Smoothness"
69-
});
7048

7149
/* Menu 1: init by passing an array of entries. */
7250

7351
$(document).contextmenu({
52+
autoFocus: true,
7453
delegate: ".hasmenu",
7554
preventContextMenuForPopup: true,
7655
preventSelect: true,
7756
taphold: true,
7857
menu: [
79-
{title: "Cut", cmd: "cut", uiIcon: "ui-icon-scissors"},
58+
{title: "Cut", cmd: "cut", uiIcon: "ui-icon-scissors" },
8059
{title: "Copy", cmd: "copy", uiIcon: "ui-icon-copy"},
8160
{title: "Paste", cmd: "paste", uiIcon: "ui-icon-clipboard", disabled: true },
8261
{title: "----"},
8362
{title: "More", children: [
84-
{title: "Sub 1 (using callback)", action: function(event, ui) { alert("action callback sub1");} },
85-
{title: "Sub 2", cmd: "sub1"}
63+
{title: "Sub 1 (using callback)", cmd: "sub1", action: function(event, ui) { alert("action callback sub1");} },
64+
{title: "Sub 2", cmd: "sub2", disabled: function(){ return true; } },
65+
{title: "Sub 3", cmd: "sub3", disabled: function(){ return "hide"; } },
66+
{cmd: "sub4", title: function(){ return "Sub 4" + Date.now(); } }
8667
]}
8768
],
8869
// Handle menu selection to implement a fake-clipboard
@@ -107,9 +88,8 @@
10788

10889
// console.log("beforeOpen", event, ui, event.originalEvent.type);
10990
console.log("beforeOpen", event, ui);
110-
alert(JSON.stringify(extraData));
11191

112-
ui.menu.zIndex( $(event.target).zIndex() + 1);
92+
// ui.menu.zIndex( $(event.target).zIndex() + 1);
11393

11494
$(document)
11595
// .contextmenu("replaceMenu", [{title: "aaa"}, {title: "bbb"}])
@@ -175,13 +155,6 @@ <h1>jquery.ui-contextmenu.js</h1>
175155

176156
<p><a href="https://github.com/mar10/jquery-ui-contextmenu">View project on GitHub</a></p>
177157

178-
<div>
179-
<label for="switcher">Theme:</label> <div id="switcher"></div>
180-
<!--
181-
<label for="skinswitcher">Skin:</label> <select id="skinswitcher"></select>
182-
-->
183-
</div>
184-
185158
<h3>Sample 1</h3>
186159
<ul>
187160
<li>Initialized using a command-array.

jquery.ui-contextmenu.js

Lines changed: 33 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -263,6 +263,9 @@ $.widget("moogle.contextmenu", {
263263
collision: "fit"
264264
}, posOption);
265265

266+
// Update entry statuses from callbacks
267+
this._updateEntries(this.$menu);
268+
266269
// Finally display the popup
267270
this.$menu
268271
.show() // required to fix positioning error
@@ -343,6 +346,29 @@ $.widget("moogle.contextmenu", {
343346
this._closeMenu();
344347
}
345348
},
349+
/* Apply status callbacks when menu is opened. */
350+
_updateEntries: function() {
351+
var self = this;
352+
353+
$.each(this.$menu.find(".ui-menu-item"), function(i, o) {
354+
var $entry = $(o),
355+
ui = { item: $entry, cmd: $entry.attr("data-command") },
356+
fn = $entry.data("disabledHandler"),
357+
res = fn ? fn(null, ui) : null;
358+
359+
// Evaluate `disabled()` callback
360+
if ( res != null ) {
361+
self.enableEntry(ui.cmd, !res);
362+
self.showEntry(ui.cmd, res !== "hide");
363+
}
364+
// Evaluate `title()` callback
365+
fn = $entry.data("titleHandler"),
366+
res = fn ? fn(null, ui) : null;
367+
if ( res != null ) {
368+
self.setEntry(ui.cmd, res);
369+
}
370+
});
371+
},
346372
/** Enable or disable the menu command. */
347373
enableEntry: function(cmd, flag) {
348374
this._getMenuEntry(cmd).toggleClass("ui-state-disabled", (flag === false));
@@ -448,10 +474,13 @@ $.extend($.moogle.contextmenu, {
448474
$wrapper.append($("<span class='ui-icon' />").addClass(entry.uiIcon));
449475
}
450476
}
451-
if ( $.isFunction(entry.action) ) {
452-
$parentLi.data("actionHandler", entry.action);
453-
}
454-
if ( entry.disabled ) {
477+
$.each( [ "action", "disabled", "title" ], function(i, attr) {
478+
if ( $.isFunction(entry[attr]) ) {
479+
$parentLi.data(attr + "Handler", entry[attr]);
480+
// console.log("handler", $parentLi, attr);
481+
}
482+
});
483+
if ( entry.disabled === true ) {
455484
$parentLi.addClass("ui-state-disabled");
456485
}
457486
if ( entry.isHeader ) {

package.json

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,8 @@
5252
"grunt-exec": "^1.0.0",
5353
"grunt-jscs": "^2.7.0",
5454
"grunt-saucelabs": "^8.1.0",
55-
"grunt-yabs": "^1.0.0"
55+
"grunt-yabs": "^1.0.0",
56+
"jquery-ui-dist": "^1.12.1"
5657
},
5758
"scripts": {
5859
"test": "grunt ci --verbose"
@@ -68,4 +69,4 @@
6869
]
6970
}
7071
]
71-
}
72+
}

0 commit comments

Comments
 (0)