Add right click context menu on all text inputs #1486
2 changed files with 68 additions and 0 deletions
|
@ -16,6 +16,7 @@ import 'scss/all.scss';
|
||||||
import store from 'store';
|
import store from 'store';
|
||||||
import app from './app';
|
import app from './app';
|
||||||
import analytics from './analytics';
|
import analytics from './analytics';
|
||||||
|
import getMenu from './util/contextMenu';
|
||||||
|
|
||||||
const { autoUpdater } = remote.require('electron-updater');
|
const { autoUpdater } = remote.require('electron-updater');
|
||||||
|
|
||||||
|
@ -95,6 +96,8 @@ document.addEventListener('click', event => {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
document.addEventListener('contextmenu', getMenu);
|
||||||
|
|
||||||
const init = () => {
|
const init = () => {
|
||||||
autoUpdater.on('update-downloaded', () => {
|
autoUpdater.on('update-downloaded', () => {
|
||||||
app.store.dispatch(doAutoUpdate());
|
app.store.dispatch(doAutoUpdate());
|
||||||
|
|
65
src/renderer/util/contextMenu.js
Normal file
65
src/renderer/util/contextMenu.js
Normal file
|
@ -0,0 +1,65 @@
|
||||||
|
import { clipboard, remote } from 'electron';
|
||||||
|
import isDev from 'electron-is-dev';
|
||||||
|
|
||||||
|
function textInputTemplate(target) {
|
||||||
|
const somethingSelected = target.selectionStart < target.selectionEnd;
|
||||||
|
const hasValue = target.value.length > 0;
|
||||||
|
|
||||||
|
// Native Electron selectAll role does not work
|
||||||
|
function selectAll() {
|
||||||
|
target.selectionStart = 0;
|
||||||
|
target.selectionEnd = target.value.length + 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
const template = [
|
||||||
|
{ label: 'Cut', accelerator: 'CmdOrCtrl+X', role: 'cut', enabled: somethingSelected },
|
||||||
|
{ label: 'Copy', accelerator: 'CmdOrCtrl+C', role: 'copy', enabled: somethingSelected },
|
||||||
|
{
|
||||||
|
label: 'Paste',
|
||||||
|
accelerator: 'CmdOrCtrl+V',
|
||||||
|
role: 'paste',
|
||||||
|
enabled: clipboard.readText().length > 0,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Select All',
|
||||||
|
accelerator: 'CmdOrCtrl+A',
|
||||||
|
role: 'selectAll',
|
||||||
|
enabled: hasValue,
|
||||||
|
click: selectAll,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
return template;
|
||||||
|
}
|
||||||
|
|
||||||
|
function getTemplate(target) {
|
||||||
|
const { type } = target;
|
||||||
|
if (target.matches('input') && (type === 'text' || type === 'number')) {
|
||||||
|
return textInputTemplate(target);
|
||||||
|
}
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
|
||||||
|
export default event => {
|
||||||
|
event.preventDefault();
|
||||||
|
const { target } = event;
|
||||||
|
const template = getTemplate(target);
|
||||||
|
if (isDev) {
|
||||||
|
const { screenX, screenY } = event;
|
||||||
|
const separator = { type: 'separator' };
|
||||||
|
const developmentTemplateAddition = [
|
||||||
|
{
|
||||||
|
label: 'Inspect element',
|
||||||
|
accelerator: 'CmdOrCtrl+Shift+I',
|
||||||
|
click: () => {
|
||||||
|
remote.getCurrentWindow().inspectElement(screenX, screenY);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
];
|
||||||
|
if (template.length > 0) {
|
||||||
|
template.push(separator);
|
||||||
|
}
|
||||||
|
template.push(...developmentTemplateAddition);
|
||||||
|
}
|
||||||
|
remote.Menu.buildFromTemplate(template).popup();
|
||||||
|
};
|
Loading…
Reference in a new issue