From 070ff484e88a147f8252b2d1ac7e5c13febeaf77 Mon Sep 17 00:00:00 2001 From: purocean Date: Wed, 29 Dec 2021 14:34:49 +0800 Subject: [PATCH] feat: add zoom menu --- src/renderer/plugins/electron-zoom.ts | 64 ++++++++++++++++++------- src/renderer/plugins/status-bar-view.ts | 36 +++++++------- src/renderer/support/env.ts | 34 +------------ src/renderer/types.ts | 3 ++ src/share/i18n/languages/en.ts | 3 ++ src/share/i18n/languages/zh-CN.ts | 3 ++ 6 files changed, 75 insertions(+), 68 deletions(-) diff --git a/src/renderer/plugins/electron-zoom.ts b/src/renderer/plugins/electron-zoom.ts index fb8765f9..f9cf62d8 100644 --- a/src/renderer/plugins/electron-zoom.ts +++ b/src/renderer/plugins/electron-zoom.ts @@ -1,5 +1,5 @@ import type { Plugin } from '@fe/context' -import { hasCtrlCmd } from '@fe/core/command' +import type { BuildInActionName } from '@fe/types' export default { name: 'electron-zoom', @@ -20,25 +20,55 @@ export default { } } - window.addEventListener('keydown', e => { - if (hasCtrlCmd(e)) { - if (e.key === '0') { - webContents.setZoomFactor(1) - } else if (e.key === '=') { - changeZoomFactor(true) - } else if (e.key === '-') { - changeZoomFactor(false) - } - } + const zoomInId: BuildInActionName = 'plugin.electron-zoom.zoom-in' + const zoomOutId: BuildInActionName = 'plugin.electron-zoom.zoom-out' + const zoomResetId: BuildInActionName = 'plugin.electron-zoom.zoom-reset' + + ctx.action.registerAction({ + name: zoomInId, + keys: [ctx.command.CtrlCmd, '='], + handler: () => changeZoomFactor(true) }) - // window.addEventListener('mousewheel', event => { - // const e = event as WheelEvent + ctx.action.registerAction({ + name: zoomOutId, + keys: [ctx.command.CtrlCmd, '-'], + handler: () => changeZoomFactor(false) + }) - // if (hasCtrlCmd(e)) { - // changeZoomFactor(e.deltaY < 0) - // } - // }) + ctx.action.registerAction({ + name: zoomResetId, + keys: [ctx.command.CtrlCmd, '0'], + handler: () => webContents.setZoomFactor(1) + }) + + ctx.statusBar.tapMenus(menus => { + console.log('xxx', menus['status-bar-view'].list) + menus['status-bar-view'].list?.push( + { + id: zoomInId, + type: 'normal', + title: ctx.i18n.t('status-bar.view.zoom-in'), + subTitle: ctx.command.getKeysLabel(zoomInId), + onClick: () => ctx.action.getActionHandler(zoomInId)() + }, + { + id: zoomOutId, + type: 'normal', + title: ctx.i18n.t('status-bar.view.zoom-out'), + subTitle: ctx.command.getKeysLabel(zoomOutId), + onClick: () => ctx.action.getActionHandler(zoomOutId)() + }, + { + id: zoomResetId, + type: 'normal', + title: ctx.i18n.t('status-bar.view.zoom-reset'), + subTitle: ctx.command.getKeysLabel(zoomResetId), + onClick: () => ctx.action.getActionHandler(zoomResetId)() + }, + { type: 'separator' }, + ) + }) }) } } as Plugin diff --git a/src/renderer/plugins/status-bar-view.ts b/src/renderer/plugins/status-bar-view.ts index 576e8cf8..1f09cc09 100644 --- a/src/renderer/plugins/status-bar-view.ts +++ b/src/renderer/plugins/status-bar-view.ts @@ -18,7 +18,23 @@ export default { ctx.store.subscribe(() => { if (count === 0) { ctx.statusBar.tapMenus(menus => { - menus['status-bar-view'].list = [ + menus['status-bar-view'].list?.push( + { + id: 'word-wrap', + type: 'normal', + checked: ctx.store.state.wordWrap === 'on', + title: ctx.i18n.t('status-bar.view.word-wrap'), + subTitle: getKeysLabel('editor.toggle-wrap'), + onClick: () => ctx.editor.toggleWrap() + }, + { + id: 'typewriter-mode', + type: 'normal', + checked: ctx.store.state.typewriterMode, + title: ctx.i18n.t('status-bar.view.typewriter-mode'), + onClick: () => ctx.editor.toggleTypewriterMode() + }, + { type: 'separator' }, { id: 'toggle-side', type: 'normal', @@ -51,23 +67,7 @@ export default { subTitle: getKeysLabel('layout.toggle-xterm'), onClick: () => ctx.layout.toggleXterm() }] : []), - { type: 'separator' }, - { - id: 'word-wrap', - type: 'normal', - checked: ctx.store.state.wordWrap === 'on', - title: ctx.i18n.t('status-bar.view.word-wrap'), - subTitle: getKeysLabel('editor.toggle-wrap'), - onClick: () => ctx.editor.toggleWrap() - }, - { - id: 'typewriter-mode', - type: 'normal', - checked: ctx.store.state.typewriterMode, - title: ctx.i18n.t('status-bar.view.typewriter-mode'), - onClick: () => ctx.editor.toggleTypewriterMode() - }, - ] + ) }) } else { ctx.statusBar.refreshMenu() diff --git a/src/renderer/support/env.ts b/src/renderer/support/env.ts index cd88ac75..e1771d2d 100644 --- a/src/renderer/support/env.ts +++ b/src/renderer/support/env.ts @@ -33,39 +33,7 @@ export function openWindow (url: string, target = '_blank', options: Record `${k}=${v}`).join(',')) - - const preload = ` - // enable page zoom in electron. - xRequire = require || nodeRequire - - const webContents = xRequire('@electron/remote').getCurrentWebContents() - - const changeZoomFactor = zoomIn => { - const currentZoomFactor = webContents.getZoomFactor() - const factor = currentZoomFactor + (zoomIn ? 0.1 : -0.1) - - if (factor > 0.2 && factor < 3) { - webContents.setZoomFactor(factor) - } - } - - window.addEventListener('keydown', e => { - if (e.ctrlKey || e.metaKey) { - if (e.key === '0') { - webContents.setZoomFactor(1) - } else if (e.key === '=') { - changeZoomFactor(true) - } else if (e.key === '-') { - changeZoomFactor(false) - } - } - }) - ` - - opener.eval(preload) - - return opener + return window.open(url, target, Object.entries(opts).map(([k, v]) => `${k}=${v}`).join(',')) } else { return window.open(url, target) } diff --git a/src/renderer/types.ts b/src/renderer/types.ts index 2686618a..08b55cb1 100644 --- a/src/renderer/types.ts +++ b/src/renderer/types.ts @@ -142,6 +142,9 @@ export type BuildInActions = { 'plugin.status-bar-help.show-plugin': () => void, 'plugin.transform-img-link.all': () => void, 'plugin.switch-todo.switch': (line?: number, checked?: boolean) => void, + 'plugin.electron-zoom.zoom-in': () => void, + 'plugin.electron-zoom.zoom-out': () => void, + 'plugin.electron-zoom.zoom-reset': () => void, 'premium.show': () => void, } diff --git a/src/share/i18n/languages/en.ts b/src/share/i18n/languages/en.ts index 936a719d..543d71db 100644 --- a/src/share/i18n/languages/en.ts +++ b/src/share/i18n/languages/en.ts @@ -192,6 +192,9 @@ const data = { 'side-bar': 'Show Side Bar', 'word-wrap': 'Word Wrap', 'typewriter-mode': 'Typewriter Mode', + 'zoom-in': 'Zoom In', + 'zoom-out': 'Zoom Out', + 'zoom-reset': 'Actual Size', }, 'setting': 'Setting', 'repo': { diff --git a/src/share/i18n/languages/zh-CN.ts b/src/share/i18n/languages/zh-CN.ts index aea6ea27..06153dca 100644 --- a/src/share/i18n/languages/zh-CN.ts +++ b/src/share/i18n/languages/zh-CN.ts @@ -193,6 +193,9 @@ const data: BaseLanguage = { 'side-bar': '显示侧栏', 'word-wrap': '文本换行', 'typewriter-mode': '打字机模式', + 'zoom-in': '放大', + 'zoom-out': '缩小', + 'zoom-reset': '实际大小', }, 'setting': '设置', 'repo': {