From e68bc0d04411310cca4d45b1b0bfe356c20e08bf Mon Sep 17 00:00:00 2001 From: Preston Date: Sun, 31 May 2020 22:10:29 -0400 Subject: [PATCH] Add Keyboard shortcuts for history navigation --- src/renderer/App.js | 96 ++++++++++++++++++++++++++++----------------- 1 file changed, 61 insertions(+), 35 deletions(-) diff --git a/src/renderer/App.js b/src/renderer/App.js index cf14ce27..4930836f 100644 --- a/src/renderer/App.js +++ b/src/renderer/App.js @@ -28,45 +28,41 @@ export default Vue.extend({ mounted: function () { this.$store.dispatch('grabUserSettings') this.$store.commit('setUsingElectron', useElectron) + this.checkThemeSettings() - let baseTheme = localStorage.getItem('baseTheme') - let mainColor = localStorage.getItem('mainColor') - let secColor = localStorage.getItem('secColor') - - if (baseTheme === null) { - baseTheme = 'light' + if (useElectron) { + console.log('User is using Electron') + this.activateKeyboardShortcuts() + this.openAllLinksExternally() } - - if (mainColor === null) { - mainColor = 'mainRed' - } - - if (secColor === null) { - secColor = 'secBlue' - } - - const theme = { - baseTheme: baseTheme, - mainColor: mainColor, - secColor: secColor - } - - this.updateTheme(theme) - - console.log(useElectron) - - // Open links externally by default - $(document).on('click', 'a[href^="http"]', (event) => { - const el = event.currentTarget - console.log(useElectron) - console.log(el) - if (typeof (shell) !== 'undefined') { - event.preventDefault() - shell.openExternal(el.href) - } - }) }, methods: { + checkThemeSettings: function () { + let baseTheme = localStorage.getItem('baseTheme') + let mainColor = localStorage.getItem('mainColor') + let secColor = localStorage.getItem('secColor') + + if (baseTheme === null) { + baseTheme = 'light' + } + + if (mainColor === null) { + mainColor = 'mainRed' + } + + if (secColor === null) { + secColor = 'secBlue' + } + + const theme = { + baseTheme: baseTheme, + mainColor: mainColor, + secColor: secColor + } + + this.updateTheme(theme) + }, + updateTheme: function (theme) { console.log(theme) const className = `${theme.baseTheme} ${theme.mainColor} ${theme.secColor}` @@ -75,6 +71,36 @@ export default Vue.extend({ localStorage.setItem('baseTheme', theme.baseTheme) localStorage.setItem('mainColor', theme.mainColor) localStorage.setItem('secColor', theme.secColor) + }, + + activateKeyboardShortcuts: function () { + $(document).on('keydown', this.handleKeyboardShortcuts) + }, + + handleKeyboardShortcuts: function (event) { + if (event.altKey) { + switch (event.code) { + case 'ArrowRight': + window.history.forward() + break + case 'ArrowLeft': + window.history.back() + break + } + } + }, + + openAllLinksExternally: function () { + // Open links externally by default + $(document).on('click', 'a[href^="http"]', (event) => { + const el = event.currentTarget + console.log(useElectron) + console.log(el) + if (typeof (shell) !== 'undefined') { + event.preventDefault() + shell.openExternal(el.href) + } + }) } } })