import vhost-audit
This commit is contained in:
44
contrib/contextmenu/documentation/demo/accesskeys.md
Normal file
44
contrib/contextmenu/documentation/demo/accesskeys.md
Normal file
@ -0,0 +1,44 @@
|
||||
---
|
||||
currentMenu: accesskeys
|
||||
---
|
||||
|
||||
# Demo: Accesskeys
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Edit", icon: "edit", accesskey: "e"},
|
||||
"cut": {name: "Cut", icon: "cut", accesskey: "c"},
|
||||
// first unused character is taken (here: o)
|
||||
"copy": {name: "Copy", icon: "copy", accesskey: "c o p y"},
|
||||
// words are truncated to their first letter (here: p)
|
||||
"paste": {name: "Paste", icon: "paste", accesskey: "cool paste"},
|
||||
"delete": {name: "Delete", icon: "delete"},
|
||||
"sep1": "---------",
|
||||
"quit": {name: "Quit", icon: function($element, key, item){ return 'context-menu-icon context-menu-icon-quit'; }}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
42
contrib/contextmenu/documentation/demo/accesskeys_test.md
Normal file
42
contrib/contextmenu/documentation/demo/accesskeys_test.md
Normal file
@ -0,0 +1,42 @@
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Demo: Accesskeys](#demo-accesskeys)
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
# Demo: Accesskeys
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var message = "clicked: " + key;
|
||||
$('#msg').text(message);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Edit", icon: "edit", accesskey: "e"},
|
||||
"cut": {name: "Cut", icon: "cut", accesskey: "c"},
|
||||
// first unused character is taken (here: o)
|
||||
"copy": {name: "Copy", icon: "copy", accesskey: "c o p y"},
|
||||
// words are truncated to their first letter (here: p)
|
||||
"paste": {name: "Paste", icon: "paste", accesskey: "cool paste"},
|
||||
"delete": {name: "Delete", icon: "delete"},
|
||||
"sep1": "---------",
|
||||
"quit": {name: "Quit", icon: function($element, key, item){ return 'context-menu-icon context-menu-icon-quit'; }}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
<div id="msg"></div>
|
||||
64
contrib/contextmenu/documentation/demo/async-create.md
Normal file
64
contrib/contextmenu/documentation/demo/async-create.md
Normal file
@ -0,0 +1,64 @@
|
||||
---
|
||||
currentMenu: async-create
|
||||
---
|
||||
|
||||
# Demo: Create Context Menu (asynchronous)
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
// some build handler to call asynchronously
|
||||
function createSomeMenu() {
|
||||
return {
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Edit", icon: "edit"},
|
||||
"cut": {name: "Cut", icon: "cut"},
|
||||
"copy": {name: "Copy", icon: "copy"}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
// some asynchronous click handler
|
||||
$('.context-menu-one').on('mouseup', function(e){
|
||||
var $this = $(this);
|
||||
// store a callback on the trigger
|
||||
$this.data('runCallbackThingie', createSomeMenu);
|
||||
var _offset = $this.offset(),
|
||||
position = {
|
||||
x: _offset.left + 10,
|
||||
y: _offset.top + 10
|
||||
}
|
||||
// open the contextMenu asynchronously
|
||||
setTimeout(function(){ $this.contextMenu(position); }, 1000);
|
||||
});
|
||||
|
||||
// setup context menu
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
trigger: 'none',
|
||||
build: function($trigger, e) {
|
||||
// pull a callback from the trigger
|
||||
return $trigger.data('runCallbackThingie')();
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
49
contrib/contextmenu/documentation/demo/callback.md
Normal file
49
contrib/contextmenu/documentation/demo/callback.md
Normal file
@ -0,0 +1,49 @@
|
||||
---
|
||||
currentMenu: callback
|
||||
---
|
||||
|
||||
# Demo: Callback
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var m = "global: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {
|
||||
name: "Edit",
|
||||
icon: "edit",
|
||||
// superseeds "global" callback
|
||||
callback: function(key, options) {
|
||||
var m = "edit was clicked";
|
||||
window.console && console.log(m) || alert(m);
|
||||
}
|
||||
},
|
||||
"cut": {name: "Cut", icon: "cut"},
|
||||
"copy": {name: "Copy", icon: "copy"},
|
||||
"paste": {name: "Paste", icon: "paste"},
|
||||
"delete": {name: "Delete", icon: "delete"},
|
||||
"sep1": "---------",
|
||||
"quit": {name: "Quit", icon: function($element, key, item){ return 'context-menu-icon context-menu-icon-quit'; }}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
48
contrib/contextmenu/documentation/demo/callback_test.md
Normal file
48
contrib/contextmenu/documentation/demo/callback_test.md
Normal file
@ -0,0 +1,48 @@
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Demo: Callback](#demo-callback)
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
# Demo: Callback
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var message = "global: " + key;
|
||||
$('#msg').text(message);
|
||||
},
|
||||
items: {
|
||||
"edit": {
|
||||
name: "Edit",
|
||||
icon: "edit",
|
||||
// superseeds "global" callback
|
||||
callback: function(key, options) {
|
||||
var m = "edit was clicked";
|
||||
$('#msg').text(m);
|
||||
}
|
||||
},
|
||||
"cut": {name: "Cut", icon: "cut"},
|
||||
"copy": {name: "Copy", icon: "copy"},
|
||||
"paste": {name: "Paste", icon: "paste"},
|
||||
"delete": {name: "Delete", icon: "delete"},
|
||||
"sep1": "---------",
|
||||
"quit": {name: "Quit", icon: function($element, key, item){ return 'context-menu-icon context-menu-icon-quit'; }}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
<div id="msg"></div>
|
||||
94
contrib/contextmenu/documentation/demo/custom-command.md
Normal file
94
contrib/contextmenu/documentation/demo/custom-command.md
Normal file
@ -0,0 +1,94 @@
|
||||
---
|
||||
currentMenu: custom-command
|
||||
---
|
||||
|
||||
# Demo: Custom command
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
/**************************************************
|
||||
* Custom Command Handler
|
||||
**************************************************/
|
||||
$.contextMenu.types.label = function(item, opt, root) {
|
||||
// this === item.$node
|
||||
|
||||
$('<span>Label</span><ul>'
|
||||
+ '<li class="label1" title="label 1">label 1</li>'
|
||||
+ '<li class="label2" title="label 2">label 2</li>'
|
||||
+ '<li class="label3" title="label 3">label 3</li>'
|
||||
+ '<li class="label4" title="label 4">label 4</li></ul>')
|
||||
.appendTo(this)
|
||||
.on('click', 'li', function() {
|
||||
// do some funky stuff
|
||||
console.log('Clicked on ' + $(this).text());
|
||||
// hide the menu
|
||||
root.$menu.trigger('contextmenu:hide');
|
||||
});
|
||||
|
||||
this.addClass('labels').on('contextmenu:focus', function(e) {
|
||||
// setup some awesome stuff
|
||||
}).on('contextmenu:blur', function(e) {
|
||||
// tear down whatever you did
|
||||
}).on('keydown', function(e) {
|
||||
// some funky key handling, maybe?
|
||||
});
|
||||
};
|
||||
|
||||
/**************************************************
|
||||
* Context-Menu with custom command "label"
|
||||
**************************************************/
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
open: {name: "Open", callback: $.noop},
|
||||
label: {type: "label", customName: "Label"},
|
||||
edit: {name: "Edit", callback: $.noop}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
|
||||
<style type="text/css" class="showcase">
|
||||
.labels > ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
display: block;
|
||||
float: none;
|
||||
}
|
||||
.labels > ul > li {
|
||||
display: inline-block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border: 1px solid #CCC;
|
||||
overflow: hidden;
|
||||
text-indent: -2000px;
|
||||
}
|
||||
.labels > ul > li.selected,
|
||||
.labels > ul > li:hover { border: 1px solid #000; }
|
||||
.labels > ul > li + li { margin-left: 5px; }
|
||||
.labels > ul > li.label1 { background: red; }
|
||||
.labels > ul > li.label2 { background: green; }
|
||||
.labels > ul > li.label3 { background: blue; }
|
||||
.labels > ul > li.label4 { background: yellow; }
|
||||
</style>
|
||||
@ -0,0 +1,94 @@
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Demo: Custom command](#demo-custom-command)
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
# Demo: Custom command
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
/**************************************************
|
||||
* Custom Command Handler
|
||||
**************************************************/
|
||||
$.contextMenu.types.label = function(item, opt, root) {
|
||||
// this === item.$node
|
||||
|
||||
$('<span>Label</span><ul>'
|
||||
+ '<li class="label1" title="label 1">label 1</li>'
|
||||
+ '<li class="label2" title="label 2">label 2</li>'
|
||||
+ '<li class="label3" title="label 3">label 3</li>'
|
||||
+ '<li class="label4" title="label 4">label 4</li></ul>')
|
||||
.appendTo(this)
|
||||
.on('click', 'li', function() {
|
||||
var message = "text: " + $(this).text();
|
||||
$('#msg').text($('#msg').text() + ' | ' + message);
|
||||
|
||||
// hide the menu
|
||||
root.$menu.trigger('contextmenu:hide');
|
||||
});
|
||||
|
||||
this.addClass('labels').on('contextmenu:focus', function(e) {
|
||||
// setup some awesome stuff
|
||||
}).on('contextmenu:blur', function(e) {
|
||||
// tear down whatever you did
|
||||
}).on('keydown', function(e) {
|
||||
// some funky key handling, maybe?
|
||||
});
|
||||
};
|
||||
|
||||
/**************************************************
|
||||
* Context-Menu with custom command "label"
|
||||
**************************************************/
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var message = "clicked: " + key;
|
||||
$('#msg').text(message);
|
||||
},
|
||||
items: {
|
||||
open: {name: "Open", callback: $.noop},
|
||||
label: {type: "label", customName: "Label"},
|
||||
edit: {name: "Edit", callback: $.noop}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
|
||||
<div id="msg"></div>
|
||||
|
||||
<style type="text/css" class="showcase">
|
||||
.labels > ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
display: block;
|
||||
float: none;
|
||||
}
|
||||
.labels > ul > li {
|
||||
display: inline-block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border: 1px solid #CCC;
|
||||
overflow: hidden;
|
||||
text-indent: -2000px;
|
||||
}
|
||||
.labels > ul > li.selected,
|
||||
.labels > ul > li:hover { border: 1px solid #000; }
|
||||
.labels > ul > li + li { margin-left: 5px; }
|
||||
.labels > ul > li.label1 { background: red; }
|
||||
.labels > ul > li.label2 { background: green; }
|
||||
.labels > ul > li.label3 { background: blue; }
|
||||
.labels > ul > li.label4 { background: yellow; }
|
||||
</style>
|
||||
46
contrib/contextmenu/documentation/demo/disabled-callback.md
Normal file
46
contrib/contextmenu/documentation/demo/disabled-callback.md
Normal file
@ -0,0 +1,46 @@
|
||||
---
|
||||
currentMenu: disabled-callback
|
||||
---
|
||||
|
||||
# Demo: Disabled Callback
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {
|
||||
name: "Clickable",
|
||||
icon: "edit",
|
||||
disabled: function(){ return false; }
|
||||
},
|
||||
"cut": {
|
||||
name: "Disabled",
|
||||
icon: "cut",
|
||||
disabled: function(){ return true; }
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
@ -0,0 +1,44 @@
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Demo: Disabled Callback](#demo-disabled-callback)
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
# Demo: Disabled Callback
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var message = "clicked: " + key;
|
||||
$('#msg').text(message);
|
||||
},
|
||||
items: {
|
||||
"edit": {
|
||||
name: "Clickable",
|
||||
icon: "edit",
|
||||
disabled: function(){ return false; }
|
||||
},
|
||||
"cut": {
|
||||
name: "Disabled",
|
||||
icon: "cut",
|
||||
disabled: function(){ return true; }
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
<div id="msg"></div>
|
||||
52
contrib/contextmenu/documentation/demo/disabled-changing.md
Normal file
52
contrib/contextmenu/documentation/demo/disabled-changing.md
Normal file
@ -0,0 +1,52 @@
|
||||
---
|
||||
currentMenu: disabled-changing
|
||||
---
|
||||
|
||||
# Demo: Disabled changing
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Clickable", icon: "edit"},
|
||||
"cut": {
|
||||
name: "Disabled",
|
||||
icon: "cut",
|
||||
disabled: function(key, opt) {
|
||||
// this references the trigger element
|
||||
return !this.data('cutDisabled');
|
||||
}
|
||||
},
|
||||
"toggle": {
|
||||
name: "Toggle",
|
||||
callback: function() {
|
||||
// this references the trigger element
|
||||
this.data('cutDisabled', !this.data('cutDisabled'));
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
@ -0,0 +1,50 @@
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Demo: Disabled changing](#demo-disabled-changing)
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
# Demo: Disabled changing
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var message = "clicked: " + key;
|
||||
$('#msg').text(message);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Clickable", icon: "edit"},
|
||||
"cut": {
|
||||
name: "Disabled",
|
||||
icon: "cut",
|
||||
disabled: function(key, opt) {
|
||||
// this references the trigger element
|
||||
return !this.data('cutDisabled');
|
||||
}
|
||||
},
|
||||
"toggle": {
|
||||
name: "Toggle",
|
||||
callback: function() {
|
||||
// this references the trigger element
|
||||
this.data('cutDisabled', !this.data('cutDisabled'));
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
<div id="msg"></div>
|
||||
58
contrib/contextmenu/documentation/demo/disabled-menu.md
Normal file
58
contrib/contextmenu/documentation/demo/disabled-menu.md
Normal file
@ -0,0 +1,58 @@
|
||||
---
|
||||
currentMenu: disabled-menu
|
||||
---
|
||||
|
||||
# Demo: Disabled menu
|
||||
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
<span class="context-menu-one btn btn-neutral context-menu-disabled">right click me</span>
|
||||
|
||||
<button type="button btn btn-neutral" id="toggle-disabled">Enable Menu</button>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Edit", icon: "edit"},
|
||||
"cut": {name: "Cut", icon: "cut"},
|
||||
"copy": {name: "Copy", icon: "copy"},
|
||||
"paste": {name: "Paste", icon: "paste"},
|
||||
"delete": {name: "Delete", icon: "delete"},
|
||||
"sep1": "---------",
|
||||
"quit": {name: "Quit", icon: function($element, key, item){ return 'context-menu-icon context-menu-icon-quit'; }}
|
||||
}
|
||||
});
|
||||
|
||||
$('#toggle-disabled').on('click', function(e) {
|
||||
e.preventDefault();
|
||||
var $this = $(this),
|
||||
$trigger = $('.context-menu-one');
|
||||
if ($trigger.hasClass('context-menu-disabled')) {
|
||||
$this.text("Disable Menu");
|
||||
$trigger.contextMenu(true);
|
||||
} else {
|
||||
$this.text("Enable Menu");
|
||||
$trigger.contextMenu(false);
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
36
contrib/contextmenu/documentation/demo/disabled.md
Normal file
36
contrib/contextmenu/documentation/demo/disabled.md
Normal file
@ -0,0 +1,36 @@
|
||||
---
|
||||
currentMenu: disabled
|
||||
---
|
||||
|
||||
# Demo: Disabled
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Clickable", icon: "edit", disabled: false},
|
||||
"cut": {name: "Disabled", icon: "cut", disabled: true}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
35
contrib/contextmenu/documentation/demo/disabled_test.md
Normal file
35
contrib/contextmenu/documentation/demo/disabled_test.md
Normal file
@ -0,0 +1,35 @@
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Demo: Disabled](#demo-disabled)
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
# Demo: Disabled
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var message = "clicked: " + key;
|
||||
$('#msg').text(message);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Clickable", icon: "edit", disabled: false},
|
||||
"cut": {name: "Disabled", icon: "cut", disabled: true}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
<div id="msg"></div>
|
||||
49
contrib/contextmenu/documentation/demo/dynamic-create.md
Normal file
49
contrib/contextmenu/documentation/demo/dynamic-create.md
Normal file
@ -0,0 +1,49 @@
|
||||
---
|
||||
currentMenu: dynamic-create
|
||||
---
|
||||
|
||||
# Demo: Adding new Context Menu Triggers
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
build: function($trigger, e) {
|
||||
// this callback is executed every time the menu is to be shown
|
||||
// its results are destroyed every time the menu is hidden
|
||||
// e is the original contextmenu event, containing e.pageX and e.pageY (amongst other data)
|
||||
return {
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Edit", icon: "edit"},
|
||||
"cut": {name: "Cut", icon: "cut"},
|
||||
"copy": {name: "Copy", icon: "copy"},
|
||||
"paste": {name: "Paste", icon: "paste"},
|
||||
"delete": {name: "Delete", icon: "delete"},
|
||||
"sep1": "---------",
|
||||
"quit": {name: "Quit", icon: function($element, key, item){ return 'context-menu-icon context-menu-icon-quit'; }}
|
||||
}
|
||||
};
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
55
contrib/contextmenu/documentation/demo/dynamic.md
Normal file
55
contrib/contextmenu/documentation/demo/dynamic.md
Normal file
@ -0,0 +1,55 @@
|
||||
---
|
||||
currentMenu: dynamic
|
||||
---
|
||||
|
||||
# Demo: Adding new Context Menu Triggers
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
`jQuery.contextMenu` allows you to define a <menu> before the trigger elements are available.
|
||||
|
||||
|
||||
<div>
|
||||
<button id="add-trigger" class="btn btn-default" type="submit">Button</button>
|
||||
</div>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
// add new trigger
|
||||
$('#add-trigger').on('click', function(e) {
|
||||
$('<div class="context-menu-one clear btn btn-neutral menu-injected">'
|
||||
+ 'right click me <em>(injected)</em>'
|
||||
+ '</div><br>').insertBefore(this);
|
||||
// not need for re-initializing $.contextMenu here :)
|
||||
});
|
||||
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Edit", icon: "edit"},
|
||||
"cut": {name: "Cut", icon: "cut"},
|
||||
"copy": {name: "Copy", icon: "copy"},
|
||||
"paste": {name: "Paste", icon: "paste"},
|
||||
"delete": {name: "Delete", icon: "delete"},
|
||||
"sep1": "---------",
|
||||
"quit": {name: "Quit", icon: function($element, key, item){ return 'context-menu-icon context-menu-icon-quit'; }}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
52
contrib/contextmenu/documentation/demo/html5-import.md
Normal file
52
contrib/contextmenu/documentation/demo/html5-import.md
Normal file
@ -0,0 +1,52 @@
|
||||
---
|
||||
currentMenu: html5-import
|
||||
---
|
||||
|
||||
# Demo: Importing HTML5 `<menu type="context">`
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
`jQuery.contextMenu` allows you to import HTML5's `<menu>` structures to use in older browsers.
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
items: $.contextMenu.fromMenu($('#html5menu'))
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
|
||||
```html
|
||||
<menu id="html5menu" style="display:none" class="showcase">
|
||||
<command label="rotate" icon="edit" onclick="alert('rotate')">
|
||||
<command label="resize" onclick="alert('resize')">
|
||||
<command label="twitter" onclick="alert('twitter')">
|
||||
<hr>
|
||||
<command label="facebook" onclick="alert('facebook')">
|
||||
</menu>
|
||||
</menu>
|
||||
```
|
||||
|
||||
<menu id="html5menu" type="context" style="display:none">
|
||||
<command label="rotate" icon="edit" onclick="alert('rotate')">
|
||||
<command label="resize" onclick="alert('resize')">
|
||||
<command label="twitter" onclick="alert('twitter')">
|
||||
<hr>
|
||||
<command label="facebook" onclick="alert('facebook')">
|
||||
</menu>
|
||||
</menu>
|
||||
@ -0,0 +1,66 @@
|
||||
---
|
||||
currentMenu: html5-polyfill-firefox8
|
||||
---
|
||||
|
||||
# Demo: HTML5 Polyfill (Firefox)
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
<span class="context-menu-one btn btn-neutral" contextmenu="html5firefox8">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu('html5');
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
|
||||
```html
|
||||
<menu id="html5firefox8" type="context" >
|
||||
<menuitem label="rotate" onclick="alert('rotate')" hint="I'm a hint"></menuitem>
|
||||
<menuitem label="resize" onclick="alert('resize')"></menuitem>
|
||||
<menuitem label="disabled" onclick="alert('disabled')" disabled></menuitem>
|
||||
<menu label="share">
|
||||
<menuitem label="twitter" onclick="alert('twitter')"></menuitem>
|
||||
<menuitem label="facebook" onclick="alert('facebook')"></menuitem>
|
||||
<hr>
|
||||
<menuitem type="checkbox" label="(checkbox) yes or no?"
|
||||
onclick="alert('checkbox: ' + (this.checked ? 'yep!' : 'nope'))"></menuitem>
|
||||
<hr>
|
||||
<menuitem type="radio" label="(radio) yes" radiogroup="alpha" checked
|
||||
onclick="alert('radio: yes')"></menuitem>
|
||||
<menuitem type="radio" label="(radio) no" radiogroup="alpha"
|
||||
onclick="alert('radio: no')"></menuitem>
|
||||
</menu>
|
||||
</menu>
|
||||
```
|
||||
|
||||
|
||||
<menu id="html5firefox8" type="context">
|
||||
<menuitem label="rotate" onclick="alert('rotate')" hint="I'm a hint"></menuitem>
|
||||
<menuitem label="resize" onclick="alert('resize')"></menuitem>
|
||||
<menuitem label="disabled" onclick="alert('disabled')" disabled></menuitem>
|
||||
<menu label="share">
|
||||
<menuitem label="twitter" onclick="alert('twitter')"></menuitem>
|
||||
<menuitem label="facebook" onclick="alert('facebook')"></menuitem>
|
||||
<hr>
|
||||
<menuitem type="checkbox" label="(checkbox) yes or no?"
|
||||
onclick="alert('checkbox: ' + (this.checked ? 'yep!' : 'nope'))"></menuitem>
|
||||
<hr>
|
||||
<menuitem type="radio" label="(radio) yes" radiogroup="alpha" checked
|
||||
onclick="alert('radio: yes')"></menuitem>
|
||||
<menuitem type="radio" label="(radio) no" radiogroup="alpha"
|
||||
onclick="alert('radio: no')"></menuitem>
|
||||
</menu>
|
||||
</menu>
|
||||
55
contrib/contextmenu/documentation/demo/html5-polyfill.md
Normal file
55
contrib/contextmenu/documentation/demo/html5-polyfill.md
Normal file
@ -0,0 +1,55 @@
|
||||
---
|
||||
currentMenu: html5-polyfill
|
||||
---
|
||||
|
||||
# Demo: HTML5 Polyfill
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
`jQuery.contextMenu` allows you to import HTML5's <menu> structures to use in older browsers.
|
||||
|
||||
<span class="context-menu-one btn btn-neutral" contextmenu="html5polyfill">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu('html5');
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
|
||||
```html
|
||||
<menu id="html5polyfill" type="context" style="display:none">
|
||||
<command label="rotate" onclick="alert('rotate')" icon="images/cut.png">
|
||||
<command label="resize" onclick="alert('resize')" icon="images/door.png">
|
||||
<menu label="share">
|
||||
<command label="twitter" onclick="alert('twitter')" icon="images/page_white_copy.png">
|
||||
<hr>
|
||||
<command label="facebook" onclick="alert('facebook')" icon="images/page_white_edit.png">
|
||||
<hr>
|
||||
<label>foo bar<input type="text" name="foo"></label>
|
||||
</menu>
|
||||
</menu>
|
||||
```
|
||||
|
||||
<menu id="html5polyfill" type="context" style="display:none">
|
||||
<command label="rotate" onclick="alert('rotate')" icon="images/cut.png">
|
||||
<command label="resize" onclick="alert('resize')" icon="images/door.png">
|
||||
<menu label="share">
|
||||
<command label="twitter" onclick="alert('twitter')" icon="images/page_white_copy.png">
|
||||
<hr>
|
||||
<command label="facebook" onclick="alert('facebook')" icon="images/page_white_edit.png">
|
||||
<hr>
|
||||
<label>foo bar<input type="text" name="foo"></label>
|
||||
</menu>
|
||||
</menu>
|
||||
121
contrib/contextmenu/documentation/demo/input.md
Normal file
121
contrib/contextmenu/documentation/demo/input.md
Normal file
@ -0,0 +1,121 @@
|
||||
---
|
||||
currentMenu: input
|
||||
---
|
||||
|
||||
# Demo: Input Commands
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
items: {
|
||||
// <input type="text">
|
||||
name: {
|
||||
name: "Text",
|
||||
type: 'text',
|
||||
value: "Hello World",
|
||||
events: {
|
||||
keyup: function(e) {
|
||||
// add some fancy key handling here?
|
||||
window.console && console.log('key: '+ e.keyCode);
|
||||
}
|
||||
}
|
||||
},
|
||||
sep1: "---------",
|
||||
// <input type="checkbox">
|
||||
yesno: {
|
||||
name: "Boolean",
|
||||
type: 'checkbox',
|
||||
selected: true
|
||||
},
|
||||
sep2: "---------",
|
||||
// <input type="radio">
|
||||
radio1: {
|
||||
name: "Radio1",
|
||||
type: 'radio',
|
||||
radio: 'radio',
|
||||
value: '1'
|
||||
},
|
||||
radio2: {
|
||||
name: "Radio2",
|
||||
type: 'radio',
|
||||
radio: 'radio',
|
||||
value: '2',
|
||||
selected: true
|
||||
},
|
||||
radio3: {
|
||||
name: "Radio3",
|
||||
type: 'radio',
|
||||
radio: 'radio',
|
||||
value: '3'
|
||||
},
|
||||
radio4: {
|
||||
name: "Radio3",
|
||||
type: 'radio',
|
||||
radio: 'radio',
|
||||
value: '4',
|
||||
disabled: true
|
||||
},
|
||||
sep3: "---------",
|
||||
// <select>
|
||||
select: {
|
||||
name: "Select",
|
||||
type: 'select',
|
||||
options: {1: 'one', 2: 'two', 3: 'three'},
|
||||
selected: 2
|
||||
},
|
||||
// <textarea>
|
||||
area1: {
|
||||
name: "Textarea with height",
|
||||
type: 'textarea',
|
||||
value: "Hello World",
|
||||
height: 40
|
||||
},
|
||||
area2: {
|
||||
name: "Textarea",
|
||||
type: 'textarea',
|
||||
value: "Hello World"
|
||||
},
|
||||
sep4: "---------",
|
||||
key: {
|
||||
name: "Something Clickable",
|
||||
callback: $.noop
|
||||
}
|
||||
},
|
||||
events: {
|
||||
show: function(opt) {
|
||||
// this is the trigger element
|
||||
var $this = this;
|
||||
// import states from data store
|
||||
$.contextMenu.setInputValues(opt, $this.data());
|
||||
// this basically fills the input commands from an object
|
||||
// like {name: "foo", yesno: true, radio: "3", …}
|
||||
},
|
||||
hide: function(opt) {
|
||||
// this is the trigger element
|
||||
var $this = this;
|
||||
// export states to data store
|
||||
$.contextMenu.getInputValues(opt, $this.data());
|
||||
// this basically dumps the input commands' values to an object
|
||||
// like {name: "foo", yesno: true, radio: "3", …}
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
@ -0,0 +1,45 @@
|
||||
---
|
||||
currentMenu: keeping-contextmenu-open
|
||||
---
|
||||
|
||||
# Demo: Keeping the Menu visible
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {
|
||||
name: "Closing on Click",
|
||||
icon: "edit",
|
||||
callback: function(){ return true; }
|
||||
},
|
||||
"cut": {
|
||||
name: "Open after Click",
|
||||
icon: "cut",
|
||||
callback: function(){ return false; }
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
143
contrib/contextmenu/documentation/demo/menu-title.md
Normal file
143
contrib/contextmenu/documentation/demo/menu-title.md
Normal file
@ -0,0 +1,143 @@
|
||||
---
|
||||
currentMenu: menu-title
|
||||
---
|
||||
|
||||
# Demo: Menu Title
|
||||
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example CSS](#example-css)
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
<span class="context-menu-two btn btn-neutral">right click me</span>
|
||||
<span class="context-menu-three btn btn-neutral">right click me</span>
|
||||
|
||||
|
||||
|
||||
## Example CSS
|
||||
|
||||
<style type="text/css" class="showcase">
|
||||
/* menu header */
|
||||
.css-title:before {
|
||||
content: "some CSS title";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
background: #DDD;
|
||||
padding: 2px;
|
||||
|
||||
font-family: Verdana, Arial, Helvetica, sans-serif;
|
||||
font-size: 11px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.css-title :first-child {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
/* menu header via data attribute */
|
||||
.data-title:before {
|
||||
content: attr(data-menutitle);
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
background: #DDD;
|
||||
padding: 2px;
|
||||
|
||||
font-family: Verdana, Arial, Helvetica, sans-serif;
|
||||
font-size: 11px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.data-title :first-child {
|
||||
margin-top: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
// register regular menu
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Edit", icon: "edit"},
|
||||
"cut": {name: "Cut", icon: "cut"},
|
||||
"copy": {name: "Copy", icon: "copy"},
|
||||
"paste": {name: "Paste", icon: "paste"},
|
||||
"delete": {name: "Delete", icon: "delete"},
|
||||
"sep1": "---------",
|
||||
"quit": {name: "Quit", icon: function($element, key, item){ return 'context-menu-icon context-menu-icon-quit'; }}
|
||||
}
|
||||
});
|
||||
|
||||
// register menu with title provided by CSS
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-two',
|
||||
className: 'css-title',
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Edit", icon: "edit"},
|
||||
"cut": {name: "Cut", icon: "cut"},
|
||||
"copy": {name: "Copy", icon: "copy"},
|
||||
"paste": {name: "Paste", icon: "paste"},
|
||||
"delete": {name: "Delete", icon: "delete"},
|
||||
"sep1": "---------",
|
||||
"quit": {name: "Quit", icon: function($element, key, item){ return 'context-menu-icon context-menu-icon-quit'; }}
|
||||
}
|
||||
});
|
||||
|
||||
// register menu with title provided by data-attribute
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-three',
|
||||
className: 'data-title',
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Edit", icon: "edit"},
|
||||
"cut": {name: "Cut", icon: "cut"},
|
||||
"copy": {name: "Copy", icon: "copy"},
|
||||
"paste": {name: "Paste", icon: "paste"},
|
||||
"delete": {name: "Delete", icon: "delete"},
|
||||
"sep1": "---------",
|
||||
"quit": {name: "Quit", icon: function($element, key, item){ return 'context-menu-icon context-menu-icon-quit'; }}
|
||||
}
|
||||
});
|
||||
|
||||
// set a title
|
||||
$('.data-title').attr('data-menutitle', "Some JS Title");
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
|
||||
```html
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
<span class="context-menu-two btn btn-neutral">right click me</span>
|
||||
|
||||
<span class="context-menu-three btn btn-neutral">right click me</span>
|
||||
```
|
||||
|
||||
|
||||
|
||||
56
contrib/contextmenu/documentation/demo/on-dom-element.md
Normal file
56
contrib/contextmenu/documentation/demo/on-dom-element.md
Normal file
@ -0,0 +1,56 @@
|
||||
---
|
||||
currentMenu: on-dom-element
|
||||
---
|
||||
|
||||
# Demo: Context Menu on DOM Element
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
<ul id="the-node">
|
||||
<li><span class="context-menu-one btn btn-neutral">right click me 1</span></li>
|
||||
<li><span class="context-menu-one btn btn-neutral">right click me 2</span></li>
|
||||
<li>right click me 3</li>
|
||||
<li>right click me 4</li>
|
||||
</ul>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$('#the-node').contextMenu({
|
||||
selector: 'li',
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key + " on " + $(this).text();
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Edit", icon: "edit"},
|
||||
"cut": {name: "Cut", icon: "cut"},
|
||||
"copy": {name: "Copy", icon: "copy"},
|
||||
"paste": {name: "Paste", icon: "paste"},
|
||||
"delete": {name: "Delete", icon: "delete"},
|
||||
"sep1": "---------",
|
||||
"quit": {name: "Quit", icon: function($element, key, item){ return 'context-menu-icon context-menu-icon-quit'; }}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
|
||||
```html
|
||||
<ul id="the-node">
|
||||
<li><span class="context-menu-one btn btn-neutral">right click me 1</span></li>
|
||||
<li><span class="context-menu-one btn btn-neutral">right click me 2</span></li>
|
||||
<li>right click me 3</li>
|
||||
<li>right click me 4</li>
|
||||
</ul>
|
||||
|
||||
```
|
||||
66
contrib/contextmenu/documentation/demo/sub-menus.md
Normal file
66
contrib/contextmenu/documentation/demo/sub-menus.md
Normal file
@ -0,0 +1,66 @@
|
||||
---
|
||||
currentMenu: sub-menus
|
||||
---
|
||||
|
||||
# Demo: Submenus
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
/**************************************************
|
||||
* Context-Menu with Sub-Menu
|
||||
**************************************************/
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {"name": "Edit", "icon": "edit"},
|
||||
"cut": {"name": "Cut", "icon": "cut"},
|
||||
"sep1": "---------",
|
||||
"quit": {"name": "Quit", "icon": "quit"},
|
||||
"sep2": "---------",
|
||||
"fold1": {
|
||||
"name": "Sub group",
|
||||
"items": {
|
||||
"fold1-key1": {"name": "Foo bar"},
|
||||
"fold2": {
|
||||
"name": "Sub group 2",
|
||||
"items": {
|
||||
"fold2-key1": {"name": "alpha"},
|
||||
"fold2-key2": {"name": "bravo"},
|
||||
"fold2-key3": {"name": "charlie"}
|
||||
}
|
||||
},
|
||||
"fold1-key3": {"name": "delta"}
|
||||
}
|
||||
},
|
||||
"fold1a": {
|
||||
"name": "Other group",
|
||||
"items": {
|
||||
"fold1a-key1": {"name": "echo"},
|
||||
"fold1a-key2": {"name": "foxtrot"},
|
||||
"fold1a-key3": {"name": "golf"}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
64
contrib/contextmenu/documentation/demo/sub-menus_test.md
Normal file
64
contrib/contextmenu/documentation/demo/sub-menus_test.md
Normal file
@ -0,0 +1,64 @@
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Demo: Submenus](#demo-submenus)
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
# Demo: Submenus
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">right click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
/**************************************************
|
||||
* Context-Menu with Sub-Menu
|
||||
**************************************************/
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
callback: function(key, options) {
|
||||
var message = "clicked: " + key;
|
||||
$('#msg').text(message);
|
||||
},
|
||||
items: {
|
||||
"edit": {"name": "Edit", "icon": "edit"},
|
||||
"cut": {"name": "Cut", "icon": "cut"},
|
||||
"sep1": "---------",
|
||||
"quit": {"name": "Quit", "icon": "quit"},
|
||||
"sep2": "---------",
|
||||
"fold1": {
|
||||
"name": "Sub group",
|
||||
"items": {
|
||||
"fold1-key1": {"name": "Foo bar"},
|
||||
"fold2": {
|
||||
"name": "Sub group 2",
|
||||
"items": {
|
||||
"fold2-key1": {"name": "alpha"},
|
||||
"fold2-key2": {"name": "bravo"},
|
||||
"fold2-key3": {"name": "charlie"}
|
||||
}
|
||||
},
|
||||
"fold1-key3": {"name": "delta"}
|
||||
}
|
||||
},
|
||||
"fold1a": {
|
||||
"name": "Other group",
|
||||
"items": {
|
||||
"fold1a-key1": {"name": "echo"},
|
||||
"fold1a-key2": {"name": "foxtrot"},
|
||||
"fold1a-key3": {"name": "golf"}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
<div id="msg"></div>
|
||||
53
contrib/contextmenu/documentation/demo/trigger-custom.md
Normal file
53
contrib/contextmenu/documentation/demo/trigger-custom.md
Normal file
@ -0,0 +1,53 @@
|
||||
---
|
||||
currentMenu: trigger-custom
|
||||
---
|
||||
|
||||
# Demo: Custom Activated Context Menu
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">press that button</span>
|
||||
|
||||
<button id="activate-menu" class="btn btn-default" type="submit">Button</button>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
// make button open the menu
|
||||
$('#activate-menu').on('click', function(e) {
|
||||
e.preventDefault();
|
||||
$('.context-menu-one').contextMenu();
|
||||
// or $('.context-menu-one').trigger("contextmenu");
|
||||
// or $('.context-menu-one').contextMenu({x: 100, y: 100});
|
||||
});
|
||||
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
trigger: 'none',
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Edit", icon: "edit"},
|
||||
"cut": {name: "Cut", icon: "cut"},
|
||||
"copy": {name: "Copy", icon: "copy"},
|
||||
"paste": {name: "Paste", icon: "paste"},
|
||||
"delete": {name: "Delete", icon: "delete"},
|
||||
"sep1": "---------",
|
||||
"quit": {name: "Quit", icon: function($element, key, item){ return 'context-menu-icon context-menu-icon-quit'; }}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
@ -0,0 +1,45 @@
|
||||
---
|
||||
currentMenu: trigger-hover-autohide
|
||||
---
|
||||
|
||||
# Demo: Hover Activated Context Menu With Autohide
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">hover over me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
trigger: 'hover',
|
||||
delay: 500,
|
||||
autoHide: true,
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Edit", icon: "edit"},
|
||||
"cut": {name: "Cut", icon: "cut"},
|
||||
"copy": {name: "Copy", icon: "copy"},
|
||||
"paste": {name: "Paste", icon: "paste"},
|
||||
"delete": {name: "Delete", icon: "delete"},
|
||||
"sep1": "---------",
|
||||
"quit": {name: "Quit", icon: function($element, key, item){ return 'context-menu-icon context-menu-icon-quit'; }}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
45
contrib/contextmenu/documentation/demo/trigger-hover.md
Normal file
45
contrib/contextmenu/documentation/demo/trigger-hover.md
Normal file
@ -0,0 +1,45 @@
|
||||
---
|
||||
currentMenu: trigger-hover
|
||||
---
|
||||
|
||||
# Demo: Hover Activated Context Menu
|
||||
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">hover over me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
trigger: 'hover',
|
||||
delay: 500,
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Edit", icon: "edit"},
|
||||
"cut": {name: "Cut", icon: "cut"},
|
||||
"copy": {name: "Copy", icon: "copy"},
|
||||
"paste": {name: "Paste", icon: "paste"},
|
||||
"delete": {name: "Delete", icon: "delete"},
|
||||
"sep1": "---------",
|
||||
"quit": {name: "Quit", icon: function($element, key, item){ return 'context-menu-icon context-menu-icon-quit'; }}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
43
contrib/contextmenu/documentation/demo/trigger-left-click.md
Normal file
43
contrib/contextmenu/documentation/demo/trigger-left-click.md
Normal file
@ -0,0 +1,43 @@
|
||||
---
|
||||
currentMenu: trigger-left-click
|
||||
---
|
||||
|
||||
# Demo: Left-Click Trigger
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">left click me</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
trigger: 'left',
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Edit", icon: "edit"},
|
||||
"cut": {name: "Cut", icon: "cut"},
|
||||
"copy": {name: "Copy", icon: "copy"},
|
||||
"paste": {name: "Paste", icon: "paste"},
|
||||
"delete": {name: "Delete", icon: "delete"},
|
||||
"sep1": "---------",
|
||||
"quit": {name: "Quit", icon: function($element, key, item){ return 'context-menu-icon context-menu-icon-quit'; }}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
65
contrib/contextmenu/documentation/demo/trigger-swipe.md
Normal file
65
contrib/contextmenu/documentation/demo/trigger-swipe.md
Normal file
@ -0,0 +1,65 @@
|
||||
---
|
||||
currentMenu: trigger-swipe
|
||||
---
|
||||
|
||||
# Demo: Swipe Trigger
|
||||
|
||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||
|
||||
|
||||
- [Example code](#example-code)
|
||||
- [Example HTML](#example-html)
|
||||
|
||||
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
||||
|
||||
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery.touchswipe/1.6.12/jquery.touchSwipe.min.js'></script>
|
||||
|
||||
This demo uses the (third party) [TouchSwipe](https://github.com/mattbryson/TouchSwipe-Jquery-Plugin) plugin.
|
||||
|
||||
|
||||
<span class="context-menu-one btn btn-neutral">swype right</span>
|
||||
|
||||
## Example code
|
||||
|
||||
<script type="text/javascript" class="showcase">
|
||||
$(function(){
|
||||
// make swipe right open the menu
|
||||
$('.context-menu-one').swipe({
|
||||
// see http://labs.skinkers.com/touchSwipe/
|
||||
swipe: function(event, direction, distance, duration, fingerCount) {
|
||||
if (fingerCount === 1) {
|
||||
$(this).contextMenu({
|
||||
x: event.changedTouches[0].screenX,
|
||||
y: event.changedTouches[0].screenY,
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$.contextMenu({
|
||||
selector: '.context-menu-one',
|
||||
trigger: 'none',
|
||||
callback: function(key, options) {
|
||||
var m = "clicked: " + key;
|
||||
window.console && console.log(m) || alert(m);
|
||||
},
|
||||
items: {
|
||||
"edit": {name: "Edit", icon: "edit"},
|
||||
"cut": {name: "Cut", icon: "cut"},
|
||||
"copy": {name: "Copy", icon: "copy"},
|
||||
"fold1a": {
|
||||
"name": "Some submenu",
|
||||
"items": {
|
||||
"fold1a-key1": {"name": "echo"},
|
||||
"fold1a-key2": {"name": "foxtrot"},
|
||||
"fold1a-key3": {"name": "golf"}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
## Example HTML
|
||||
<div style="display:none;" class="showcase" data-showcase-import=".context-menu-one"></div>
|
||||
Reference in New Issue
Block a user