神刀安全网

electron-contextmenu-middleware: build electron context menus composing multiple middleware…

electron-contextmenu-middleware

Build electron context menus composing multiple middlewares functions.

electron-contextmenu-middleware: build electron context menus composing multiple middleware... electron-contextmenu-middleware: build electron context menus composing multiple middleware... electron-contextmenu-middleware: build electron context menus composing multiple middleware...

This package born because I’ve published two other npm packages for electron that provide different context menu for DOM element.

electron-input-menu provide Copy&Paste stuff for input element, while debug-menu provide a Chrome-like "inspect element" menu for electron .

They both work well on their own, but if you want to use them together you can only shown one menu or the other, because they preventDefault the contextmenu event. If you remove the preventDefault call, then you get both, in sequence.

electron-contextmenu-middleware grab menus provided by various other packages (the middlewares ones) merge them in a single menu, and popup it.

Installation

npm install --save electron-contextmenu-middleware

Usage

// in a renderer electron process,   // you want to activate context menu provided   // by `electron-input-menu` and `debug-menu`    const context = require('electron-contextmenu-middleware');    const input = require('electron-input-menu');   const debug = require('debug-menu').contextMdw;    context.use(input);   context.use(debug);   context.activate();

Write a middleware

To write a middleware menu, just export a function that receives an option object and a next function.

The option object is composed by the right-clicked DOM element, the click x and y coord, and an array of electron menu item templates.

Append or insert your menu items to the array in the position you want (or remove existing items inserted by other middlewares) and call next when done.

export default function ({elm, menu, click}, next) {   menu.push({     label: 'Inspect element',     click: () => {       require('electron').remote         .getCurrentWindow()         .inspectElement(           click.x,           click.y         );     }   }); }

Related projects

  • electron-input-menu – Context menu forelectron input elements.

  • debug-menu – Chrome-like "inspect element" context-menu.

License

The MIT License (MIT)

Copyright (c) 2016 parro-it

转载本站任何文章请注明:转载至神刀安全网,谢谢神刀安全网 » electron-contextmenu-middleware: build electron context menus composing multiple middleware…

分享到:更多 ()

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
分享按钮