lbry-desktop/electron/menu/setupBarMenu.js
infiinte-persistence bc19503419 Allow zooming on Desktop
## Issue
Closes 4501 `Font size`

## New behavior
The Desktop app can now zoom the same way as browsers:
- Zoom In: "Ctrl+=" or "Ctrl+numpadPlus" or "Ctrl+WheelUp"
- Zoom Out: "Ctrl+-" or "Ctrl+numpadMinus" or "Ctrl+WheelDown"
- Zoom Reset: "Ctrl+0" or "Ctrl+numpad0"

## Code changes
(1) Electron provides this functionality through the `zoomIn|zoomOut|resetZoom` roles in the Menu, so it would have been a quick job.

However, given that Electron currently does not support having multiple accelerators for one item, we can't add `Ctrl+WheelUp` to the mix and would have to implement our own handler and use `webFrame`.

Given that we need to add code anyways, we handle both keyboard and mouse cases through the same handler, hence the existence of `zoomWindow.js`.  It also provides the opportunity to few a few quirks with Electron's default implementation (e.g. stuck at both extremes)

(2) I recall there is another Issue for adding keyboard shortcuts.  Given that these shortcuts are universally used in browsers, they are probably "reserved", so shouldn't clash with that task.
2020-07-14 16:08:24 -04:00

127 lines
3.2 KiB
JavaScript

import { app, Menu, shell } from 'electron';
import { changeZoomFactor, ZOOM } from 'util/zoomWindow';
export default () => {
const template = [
{
label: 'File',
submenu: [{ role: 'quit', accelerator: 'CmdOrCtrl+Q' }],
},
{
label: 'Edit',
submenu: [
{ role: 'undo' },
{ role: 'redo' },
{ type: 'separator' },
{ role: 'cut' },
{ role: 'copy' },
{ role: 'paste' },
{ role: 'selectAll' },
],
},
{
label: 'View',
submenu: [
{ role: 'reload' },
{
label: 'Zoom',
submenu: [
{
label: 'Zoom In',
accelerator: 'CmdOrCtrl+=',
click: (menuItem, browserWindow) => {
if (browserWindow) {
browserWindow.webContents.send('zoom-window', ZOOM.INCREMENT);
}
},
},
{
label: 'Zoom Out',
accelerator: 'CmdOrCtrl+-',
click: (menuItem, browserWindow) => {
if (browserWindow) {
browserWindow.webContents.send('zoom-window', ZOOM.DECREMENT);
}
},
},
{
label: 'Reset Zoom',
accelerator: 'CmdOrCtrl+0',
click: (menuItem, browserWindow) => {
if (browserWindow) {
browserWindow.webContents.send('zoom-window', ZOOM.RESET);
}
},
},
],
},
{
label: 'Developer',
submenu: [{ role: 'forcereload' }, { role: 'toggledevtools' }],
},
{ type: 'separator' },
{ role: 'togglefullscreen' },
],
},
{
role: 'window',
submenu: [{ role: 'minimize' }, { role: 'close' }],
},
{
role: 'help',
submenu: [
{
label: 'Learn More',
click: (menuItem, browserWindow) => {
if (browserWindow) {
browserWindow.webContents.send('open-menu', '/help');
} else {
shell.openExternal('https://lbry.com/faq');
}
},
},
{
label: 'Frequently Asked Questions',
click: () => {
shell.openExternal('https://lbry.com/faq');
},
},
{ type: 'separator' },
{
label: 'Report Issue',
click: () => {
shell.openExternal('https://github.com/lbryio/lbry-desktop/issues/new');
},
},
{ type: 'separator' },
{
label: 'Developer API Guide',
click: () => {
shell.openExternal('https://lbry.tech/playground');
},
},
],
},
];
const darwinTemplateAddition = {
label: app.getName(),
submenu: [
{ role: 'about' },
{ type: 'separator' },
{ role: 'services', submenu: [] },
{ type: 'separator' },
{ role: 'hide' },
{ role: 'hideothers' },
{ type: 'separator' },
{ role: 'quit' },
],
};
if (process.platform === 'darwin') {
template.unshift(darwinTemplateAddition);
}
const menu = Menu.buildFromTemplate(template);
Menu.setApplicationMenu(menu);
};