Tracks the events of calling the context menu and clicking on its items. It also tracks the cursor position changes.
Plugin type: non-visual, non-system.
Supported editors: documents.
Copy the code below and save it in the config.json, index.html, and code.js files respectively. Download the resources folder with icons from this plugin. Put all the files and the folder into the plugin folder and install it following the desktop, on-premises, or cloud installation instructions.
{ "name" : "ContextMenu and Events", "guid" : "asc.{B617C899-03AA-476F-8D2C-1B7272489CBC}", "variations" : [ { "description" : "example context menu and events", "url" : "index.html", "icons": [ "resources/light/icon.png", "resources/light/icon@2x.png" ], "icons2": [ { "style" : "light", "100%": { "normal": "resources/light/icon.png" }, "125%": { "normal": "resources/light/icon@1.25x.png" }, "150%": { "normal": "resources/light/icon@1.5x.png" }, "175%": { "normal": "resources/light/icon@1.75x.png" }, "200%": { "normal": "resources/light/icon@2x.png" } }, { "style" : "dark", "100%": { "normal": "resources/dark/icon.png" }, "125%": { "normal": "resources/dark/icon@1.25x.png" }, "150%": { "normal": "resources/dark/icon@1.5x.png" }, "175%": { "normal": "resources/dark/icon@1.75x.png" }, "200%": { "normal": "resources/dark/icon@2x.png" } } ], "isViewer" : false, "EditorsSupport" : ["word"], "isVisual" : false, "isModal" : false, "isInsideMode" : false, "isSystem" : false, "initDataType" : "none", "initData" : "", "buttons" : [ ], "events" : [ "onContextMenuShow", "onTargetPositionChanged" ] } ] }
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>example context menu and events</title> <script type="text/javascript" src="https://onlyoffice.github.io/sdkjs-plugins/v1/plugins.js"></script> <script src="scripts/code.js"></script> </head> <body> </body> </html>
Plugin code
(function(window, undefined){ console.log('work'); window.Asc.plugin.init = function() { }; window.Asc.plugin.button = function(id) { this.executeCommand("close", ""); }; window.Asc.plugin.event_onContextMenuShow = function(options) { switch (options.type) { case "Target": { this.executeMethod("AddContextMenuItem", [{ guid : this.guid, items : [ { id : "onClickItem1", text : { en : "Item 1", de : "Menü 1" }, items : [ { id : "onClickItem1Sub1", text : { en : "Subitem 1", de : "Untermenü 1" }, disabled : true }, { id : "onClickItem1Sub2", text : { en : "Subitem 2", de : "Untermenü 2" }, separator: true } ] }, { id : "onClickItem2", text : { en : "Item 2", de : "Menü 2" } } ] }]); break; } case "Selection": { this.executeMethod("AddContextMenuItem", [{ guid : this.guid, items : [ { id : "onClickItem3", text : { en : "Item 3", de : "Menü 3" } } ] }]); break; } case 'Image': case 'Shape': { this.executeMethod("AddContextMenuItem", [{ guid : this.guid, items : [ { id : "onClickItem4", text : { en : "Item 4", de : "Menü 4" } } ] }]); break; } default: break; } }; window.Asc.plugin.attachContextMenuClickEvent("onClickItem1Sub1", function(){ window.Asc.plugin.executeMethod("InputText", ["clicked: onClickItem1Sub1"]); }); window.Asc.plugin.attachContextMenuClickEvent("onClickItem1Sub2", function(){ window.Asc.plugin.executeMethod("InputText", ["clicked: onClickItem1Sub2"]); }); window.Asc.plugin.attachContextMenuClickEvent("onClickItem2", function(){ window.Asc.plugin.executeMethod("InputText", ["clicked: onClickItem2"]); }); window.Asc.plugin.attachContextMenuClickEvent("onClickItem3", function(){ window.Asc.plugin.executeMethod("InputText", ["clicked: onClickItem3"]); }); window.Asc.plugin.attachContextMenuClickEvent("onClickItem4", function(){ console.log("clicked: onClickItem4"); }); window.Asc.plugin.event_onTargetPositionChanged = function() { console.log("event: onTargetPositionChanged"); }; })(window, undefined);
If you want to request a feature or report a bug regarding this plugin, use the issues section on GitHub.