|
17 | 17 |
|
18 | 18 |
|
19 | 19 | $.widget("moogle.contextmenu", { |
20 | | - version: "0.6.0", |
| 20 | + version: "1.0.0", |
21 | 21 | options: { |
22 | | - delegate: "[data-menu]", // selector |
| 22 | + delegate: null, // selector |
23 | 23 | hide: { effect: "fadeOut", duration: "fast"}, |
24 | 24 | ignoreParentSelect: true, // Don't trigger 'select' for sub-menu parents |
25 | 25 | menu: null, // selector or jQuery pointing to <UL>, or a definition hash |
|
28 | 28 | show: { effect: "slideDown", duration: "fast"}, |
29 | 29 | taphold: false, // open menu on taphold events (requires external plugins) |
30 | 30 | // Events: |
31 | | - beforeOpen: $.noop, // menu about to open; return `false` to prevent opening |
32 | | - blur: $.noop, // menu option lost focus |
33 | | - close: $.noop, // menu was closed |
34 | | - create: $.noop, // menu was initialized |
35 | | - focus: $.noop, // menu option got focus |
36 | | - init: $.noop, // ui-contextmenu was initialized |
37 | | - open: $.noop, // menu was opened |
38 | | - select: $.noop // menu option was selected; return `false` to prevent closing |
| 31 | + beforeOpen: $.noop, // menu about to open; return `false` to prevent opening |
| 32 | + blur: $.noop, // menu option lost focus |
| 33 | + close: $.noop, // menu was closed |
| 34 | + create: $.noop, // menu was initialized |
| 35 | + createMenu: $.noop, // menu was initialized (original UI Menu) |
| 36 | + focus: $.noop, // menu option got focus |
| 37 | +// init: $.noop, // ui-contextmenu was initialized |
| 38 | + open: $.noop, // menu was opened |
| 39 | + select: $.noop // menu option was selected; return `false` to prevent closing |
39 | 40 | }, |
40 | | - /** Construtcor */ |
| 41 | + /** Constructor */ |
41 | 42 | _create: function () { |
| 43 | + console.log("_create()"); |
42 | 44 | var eventNames, targetId, |
43 | 45 | opts = this.options; |
44 | 46 |
|
|
53 | 55 | // If the contextmenu was bound to `document`, we apply the |
54 | 56 | // selector relative to the <body> tag instead |
55 | 57 | targetId = ($(this.element).is(document) ? $("body") : this.element).uniqueId().attr("id"); |
56 | | - this.$headStyle = $("<style class='ui-contextmenu-style'>") |
| 58 | + this.$headStyle = $("<style class='moogle-contextmenu-style'>") |
57 | 59 | .prop("type", "text/css") |
58 | 60 | .html("#" + targetId + " " + opts.delegate + " { " + |
59 | 61 | "-webkit-user-select: none; " + |
|
78 | 80 | } |
79 | 81 | this.element.delegate(opts.delegate, eventNames, $.proxy(this._openMenu, this)); |
80 | 82 |
|
81 | | - this._trigger("init"); |
| 83 | + console.log("_create() - delegate"); |
| 84 | + |
| 85 | +// this._trigger("init"); |
82 | 86 | }, |
83 | 87 | /** Destructor, called on $().contextmenu("destroy"). */ |
84 | | - _destroy: function(key, value){ |
| 88 | + _destroy: function(){ |
| 89 | + console.log("_destroy() undelegate NS menu=", this.$menu); |
| 90 | + this.element.undelegate(this.ns); |
| 91 | + if(this.isOpen()){ |
| 92 | + this._closeMenu(); |
| 93 | + } |
85 | 94 | this._createUiMenu(null); |
86 | 95 | if(this.$headStyle){ |
87 | 96 | this.$headStyle.remove(); |
|
91 | 100 | /** (Re)Create jQuery UI Menu. */ |
92 | 101 | _createUiMenu: function(menuDef){ |
93 | 102 | // Remove temporary <ul> if any |
| 103 | + console.log("_createUiMenu()", menuDef); |
94 | 104 | if(this.menuIsTemp){ |
| 105 | + console.log("_createUiMenu - remove ", this.$menu); |
95 | 106 | this.$menu.remove(); // this will also destroy ui.menu |
96 | 107 | this.menuIsTemp = false; |
97 | 108 | } else if(this.$menu){ |
| 109 | + console.log("_createUiMenu - destroy ", this.$menu); |
98 | 110 | this.$menu.menu("destroy").hide(); |
99 | 111 | } |
100 | 112 | // If a menu definition array was passed, create a hidden <ul> |
|
113 | 125 | // Create - but hide - the jQuery UI Menu widget |
114 | 126 | this.$menu |
115 | 127 | .hide() |
116 | | - .addClass("ui-contextmenu") |
| 128 | +// .addClass("moogle-contextmenu") |
117 | 129 | // Create a menu instance that delegates events to our widget |
118 | 130 | .menu({ |
119 | 131 | blur: $.proxy(this.options.blur, this), |
120 | | - create: $.proxy(this.options.create, this), |
| 132 | + create: $.proxy(this.options.createMenu, this), |
121 | 133 | focus: $.proxy(this.options.focus, this), |
122 | 134 | select: $.proxy(function(event, ui){ |
| 135 | +// window.console.log("select proxy"); |
123 | 136 | var isParent = (ui.item.has(">a[aria-haspopup='true']").length > 0); |
124 | 137 | ui.cmd = normCommand(ui.item.find(">a").attr("href")); |
125 | 138 | ui.target = $(this.currentTarget); |
|
135 | 148 | }, |
136 | 149 | /** Open popup (called on 'contextmenu' event). */ |
137 | 150 | _openMenu: function(event){ |
| 151 | + console.log("_openMenu()"); |
138 | 152 | var opts = this.options, |
139 | 153 | posOption = opts.position, |
140 | 154 | self = this, |
|
148 | 162 | } |
149 | 163 | ui.menu = this.$menu; // Might have changed in beforeOpen |
150 | 164 | // Register global event handlers that close the dropdown-menu |
| 165 | + console.log("_openMenu() - document.bind: " + this.ns, this.menuIsTemp, this.$menu); |
151 | 166 | $(document).bind("keydown" + this.ns, function(event){ |
152 | 167 | if( event.which === $.ui.keyCode.ESCAPE ){ |
153 | 168 | self._closeMenu(); |
|
189 | 204 | _closeMenu: function(){ |
190 | 205 | var self = this; |
191 | 206 |
|
192 | | - this._hide(this.$menu, this.options.hide, function() { |
| 207 | + console.log("_closeMenu() - document.unbind: " + this.ns, this.menuIsTemp, this.$menu); |
| 208 | + $(document) |
| 209 | + .unbind("mousedown" + this.ns) |
| 210 | + .unbind("touchstart" + this.ns) |
| 211 | + .unbind("keydown" + this.ns); |
| 212 | + |
| 213 | + this._hide(this.$menu, this.options.hide, function() { |
193 | 214 | self._trigger("close"); |
194 | | - this.currentTarget = null; |
| 215 | + self.currentTarget = null; |
195 | 216 | }); |
196 | | - |
197 | | - $(document) |
198 | | - .unbind("mousedown" + this.ns) |
199 | | - .unbind("touchstart" + this.ns) |
200 | | - .unbind("keydown" + this.ns); |
201 | 217 | }, |
202 | 218 | /** Handle $().contextmenu("option", key, value) calls. */ |
203 | 219 | _setOption: function(key, value){ |
|
213 | 229 | var $entry = this.$menu.find("li a[href=#" + normCommand(cmd) + "]"); |
214 | 230 | return wantLi ? $entry.closest("li") : $entry; |
215 | 231 | }, |
| 232 | + /** Return Menu element (UL). */ |
| 233 | + getMenu: function(){ |
| 234 | + return this.$menu; |
| 235 | + }, |
| 236 | + /** Return true if menu is open. */ |
| 237 | + isOpen: function(){ |
| 238 | +// return this.$menu && this.$menu.is(":visible"); |
| 239 | + return !!this.$menu && !!this.currentTarget; |
| 240 | + }, |
216 | 241 | /** Open context menu on a specific target (must match options.delegate) */ |
217 | 242 | open: function(target){ |
218 | 243 | // Fake a 'contextmenu' event |
|
0 commit comments