Add Keyboard shortcuts for history navigation

src/renderer/App.js

@@ -28,7 +28,16 @@ export default Vue.extend({
   mounted: function () {
     this.$store.dispatch('grabUserSettings')
     this.$store.commit('setUsingElectron', useElectron)
+    this.checkThemeSettings()
 
+    if (useElectron) {
+      console.log('User is using Electron')
+      this.activateKeyboardShortcuts()
+      this.openAllLinksExternally()
+    }
+  },
+  methods: {
+    checkThemeSettings: function () {
       let baseTheme = localStorage.getItem('baseTheme')
       let mainColor = localStorage.getItem('mainColor')
       let secColor = localStorage.getItem('secColor')
@@ -52,9 +61,36 @@ export default Vue.extend({
       }
 
       this.updateTheme(theme)
+    },
 
-    console.log(useElectron)
+    updateTheme: function (theme) {
+      console.log(theme)
+      const className = `${theme.baseTheme} ${theme.mainColor} ${theme.secColor}`
+      const body = document.getElementsByTagName('body')[0]
+      body.className = className
+      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
@@ -65,16 +101,6 @@ export default Vue.extend({
           shell.openExternal(el.href)
         }
       })
-  },
-  methods: {
-    updateTheme: function (theme) {
-      console.log(theme)
-      const className = `${theme.baseTheme} ${theme.mainColor} ${theme.secColor}`
-      const body = document.getElementsByTagName('body')[0]
-      body.className = className
-      localStorage.setItem('baseTheme', theme.baseTheme)
-      localStorage.setItem('mainColor', theme.mainColor)
-      localStorage.setItem('secColor', theme.secColor)
     }
   }
 })