New option autoTrigger: true can be set to false to prevent opening on browser's contextmenu event.

Closed mar10#49

Author: mar10

CHANGELOG.md

@@ -1,6 +1,7 @@
 # 1.3.0 / unreleased
 
 * [FEATURE] New optional parameter open(..., extraData).
+* [FEATURE] New option `autoTrigger: true` can be set to `false` to prevent opening on browser's `contextmenu` event.
 * [CHANGE] `setEntry()` and `replaceMenu()` now allow to define titles with HTML markup.
 
 # 1.2.4 / 2013-12-25

README.md

@@ -114,9 +114,56 @@ structure (see [jQueryUI menu] for details):
 ```
 
 
+### Modify the menu depending on the context
+
+The menu can be modified before display in order to reflect the current context.
+
+```js
+$(document).contextmenu({
+    delegate: ".hasmenu",
+    menu: [
+        {title: "Cut", cmd: "cut", uiIcon: "ui-icon-scissors"},
+        {title: "Copy", cmd: "copy", uiIcon: "ui-icon-copy"},
+        {title: "Paste", cmd: "paste", uiIcon: "ui-icon-clipboard", disabled: true },
+        ...
+        ],
+    beforeOpen: function(event, ui) {
+        var $menu = ui.menu,
+            $target = ui.target,
+            extraData = ui.extraData; // optionally passed when menu was opened by call to open()
+
+        // Optionally return false, to prevent opening the menu
+//      return false;
+
+        // En/disable single entries
+        $(document).contextmenu("enableEntry", "paste", false);
+        // Show/hide single entries
+        $(document).contextmenu("showEntry", "cut", false);
+        // Redefine the title of single entries
+        $(document).contextmenu("setEntry", "copy", "Copy '" + $target.text() + "'")
+        // Redefine all attributes of single entries
+        $(document).contextmenu("setEntry", "cut", {title: "Cuty", uiIcon: "ui-icon-heart", disabled: true});
+        // Redefine the whole menu
+        $(document).contextmenu("replaceMenu", [{title: "aaa"}, {title: "bbb"}, ...]);
+        // Redefine the whole menu from another HTML definition
+        $(document).contextmenu("replaceMenu", "#options2");
+    },
+    ...
+});
+```
+
+
 ## API documentation
 ### Options
 <dl>
+<dt>autoTrigger</dt>
+<dd>
+    Type: <code>Boolean</code>, 
+    default: <code>true</code><br>
+    Set `false` to prevent opening on a browser's `contextmenu` event, which is
+    normally triggered by a  mouse rightclick.<br>
+    The menu can still be opened by calling the `open()` method.
+</dd>
 <dt>delegate</dt>
 <dd>
     Type: <code>String</code><br>

demo/index.html

@@ -81,7 +81,7 @@
 		preventSelect: true,
 		taphold: true,
 		menu: [
-			{title: "<strong>Cut</strong>", cmd: "cut", uiIcon: "ui-icon-scissors"},
+			{title: "Cut", cmd: "cut", uiIcon: "ui-icon-scissors"},
 			{title: "Copy", cmd: "copy", uiIcon: "ui-icon-copy"},
 			{title: "Paste", cmd: "paste", uiIcon: "ui-icon-clipboard", disabled: true },
 			{title: "----"},
@@ -213,7 +213,7 @@ <h3>Sample 2</h3>
 
 	<ul id="options" style="display: none;">
 		<li><a href="#action1"><span class="ui-icon custom-icon-firefox"></span>Action 1</a>
-		<li><a href="#action2"><span class="ui-icon ui-icon-heart"></span><strong>Action</strong> 2</a>
+		<li><a href="#action2"><span class="ui-icon ui-icon-heart"></span>Action 2</a>
 		<li class="ui-state-disabled"><a href="#action3">Action 3</a>
 		<li>----
 		<li><a>Extra</a>

jquery.ui-contextmenu.js

@@ -20,6 +20,7 @@
 	$.widget("moogle.contextmenu", {
 		version: "1.3.0-1",
 		options: {
+			autoTrigger: true,    // open menu on browser's `contextmenu` event
 			delegate: null,       // selector
 			hide: { effect: "fadeOut", duration: "fast"},
 			ignoreParentSelect: true, // Don't trigger 'select' for sub-menu parents
@@ -160,8 +161,15 @@
 			var opts = this.options,
 				posOption = opts.position,
 				self = this,
-				ui = {menu: this.$menu, target: $(event.target), extraData: event.extraData};
+				manualTrigger = !!event.isTrigger,
+				ui = {menu: this.$menu, target: $(event.target), extraData: event.extraData, originalEvent: event};
+
+			if( !opts.autoTrigger && !manualTrigger ) {
+				// ignore browser's `contextmenu` events
+				return;
+			}
 			this.currentTarget = event.target;
+
 			// Prevent browser from opening the system context menu
 			event.preventDefault();