From 7ebddf0d42e8bf615e26d697fca0a4a9ce39128a Mon Sep 17 00:00:00 2001
From: AkiraFukushima <h3.poteto@gmail.com>
Date: Thu, 23 Aug 2018 08:51:27 +0900
Subject: [PATCH 1/5] refs #561 Close login page with esc

---
 src/renderer/components/Login.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/renderer/components/Login.vue b/src/renderer/components/Login.vue
index 87afd5a5..7d0e5053 100644
--- a/src/renderer/components/Login.vue
+++ b/src/renderer/components/Login.vue
@@ -9,6 +9,7 @@
     </el-row>
   </el-header>
   <el-container>
+    <div v-shortkey="['esc']" @shortkey="close"></div>
     <login-form></login-form>
   </el-container>
 </el-container>

From 9c84ff0da11fa9781b803960f32f7bd9b41efbe8 Mon Sep 17 00:00:00 2001
From: AkiraFukushima <h3.poteto@gmail.com>
Date: Thu, 23 Aug 2018 09:21:03 +0900
Subject: [PATCH 2/5] refs #561 Close side bar with esc

---
 src/renderer/components/TimelineSpace/Contents/SideBar.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/renderer/components/TimelineSpace/Contents/SideBar.vue b/src/renderer/components/TimelineSpace/Contents/SideBar.vue
index 455e29d0..4719d612 100644
--- a/src/renderer/components/TimelineSpace/Contents/SideBar.vue
+++ b/src/renderer/components/TimelineSpace/Contents/SideBar.vue
@@ -1,6 +1,6 @@
 <template>
 <transition name="slide-detail">
-  <div id="side_bar" v-if="openSideBar">
+  <div id="side_bar" v-if="openSideBar" v-shortkey="['esc']" @shortkey="close">
     <div class="header">
       <i class="el-icon-loading" v-show="loading"></i>
       <i class="el-icon-close" @click="close"></i>

From 7e0a0510da04b4bf22a897e83ad41baf3e4a2b6b Mon Sep 17 00:00:00 2001
From: AkiraFukushima <h3.poteto@gmail.com>
Date: Fri, 24 Aug 2018 00:14:37 +0900
Subject: [PATCH 3/5] fixes: Stop toot shortcut when modal is opened

---
 .../Contents/Cards/Notification.vue           |  8 ++++++++
 .../Contents/Cards/Notification/Favourite.vue | 11 +++++++++-
 .../Contents/Cards/Notification/Follow.vue    | 11 +++++++++-
 .../Contents/Cards/Notification/Mention.vue   |  5 +++++
 .../Contents/Cards/Notification/Reblog.vue    | 11 +++++++++-
 .../TimelineSpace/Contents/Cards/Toot.vue     | 12 +++++++++--
 .../TimelineSpace/Contents/Favourites.vue     | 17 ++++++++++------
 .../TimelineSpace/Contents/Hashtag/Tag.vue    | 17 ++++++++++------
 .../TimelineSpace/Contents/Home.vue           | 17 ++++++++++------
 .../TimelineSpace/Contents/Lists/Show.vue     | 20 ++++++++++++++++---
 .../TimelineSpace/Contents/Local.vue          | 20 +++++++++++++------
 .../TimelineSpace/Contents/Notifications.vue  | 17 ++++++++++------
 .../TimelineSpace/Contents/Public.vue         | 17 ++++++++++------
 src/renderer/store/TimelineSpace/Modals.js    | 11 ++++++++++
 14 files changed, 150 insertions(+), 44 deletions(-)

diff --git a/src/renderer/components/TimelineSpace/Contents/Cards/Notification.vue b/src/renderer/components/TimelineSpace/Contents/Cards/Notification.vue
index 1409d813..838acffb 100644
--- a/src/renderer/components/TimelineSpace/Contents/Cards/Notification.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Cards/Notification.vue
@@ -4,6 +4,7 @@
              :message="message"
              :filter="filter"
              :focused="focused"
+             :overlaid="overlaid"
              @focusNext="$emit('focusNext')"
              @focusPrev="$emit('focusPrev')"
              @select="$emit('selectNotification')"
@@ -12,6 +13,7 @@
   <follow v-else-if="message.type === 'follow'"
           :message="message"
           :focused="focused"
+          :overlaid="overlaid"
           @focusNext="$emit('focusNext')"
           @focusPrev="$emit('focusPrev')"
           @select="$emit('selectNotification')"
@@ -21,6 +23,7 @@
             :message="message"
             :filter="filter"
             :focused="focused"
+            :overlaid="overlaid"
             @focusNext="$emit('focusNext')"
             @focusPrev="$emit('focusPrev')"
             @select="$emit('selectNotification')"
@@ -30,6 +33,7 @@
            :message="message"
            :filter="filter"
            :focused="focused"
+           :overlaid="overlaid"
            @focusNext="$emit('focusNext')"
            @focusPrev="$emit('focusPrev')"
            @select="$emit('selectNotification')"
@@ -58,6 +62,10 @@ export default {
     focused: {
       type: Boolean,
       defalt: false
+    },
+    overlaid: {
+      type: Boolean,
+      default: false
     }
   },
   components: { Favourite, Follow, Mention, Reblog }
diff --git a/src/renderer/components/TimelineSpace/Contents/Cards/Notification/Favourite.vue b/src/renderer/components/TimelineSpace/Contents/Cards/Notification/Favourite.vue
index 9777c088..d788e6fd 100644
--- a/src/renderer/components/TimelineSpace/Contents/Cards/Notification/Favourite.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Cards/Notification/Favourite.vue
@@ -2,7 +2,7 @@
 <div
   class="status"
   tabIndex="0"
-  v-shortkey="focused ? {next: ['j'], prev: ['k']} : {}"
+  v-shortkey="shortcutEnabled ? {next: ['j'], prev: ['k']} : {}"
   @shortkey="handleStatusControl"
   ref="status"
   @click="$emit('select')"
@@ -91,6 +91,10 @@ export default {
     focused: {
       type: Boolean,
       default: false
+    },
+    overlaid: {
+      type: Boolean,
+      default: false
     }
   },
   data () {
@@ -99,6 +103,11 @@ export default {
       showAttachments: false
     }
   },
+  computed: {
+    shortcutEnabled: function () {
+      return this.focused && !this.overlaid
+    }
+  },
   mounted () {
     if (this.focused) {
       this.$refs.status.focus()
diff --git a/src/renderer/components/TimelineSpace/Contents/Cards/Notification/Follow.vue b/src/renderer/components/TimelineSpace/Contents/Cards/Notification/Follow.vue
index 6fb8f8cc..8f1f54bd 100644
--- a/src/renderer/components/TimelineSpace/Contents/Cards/Notification/Follow.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Cards/Notification/Follow.vue
@@ -2,7 +2,7 @@
 <div
   class="follow"
   tabIndex="0"
-  v-shortkey="focused ? {next: ['j'], prev: ['k']} : {}"
+  v-shortkey="shortcutEnabled ? {next: ['j'], prev: ['k']} : {}"
   @shortkey="handleStatusControl"
   ref="status"
   @click="$emit('select')"
@@ -34,6 +34,15 @@ export default {
     focused: {
       type: Boolean,
       default: false
+    },
+    overlaid: {
+      type: Boolean,
+      default: false
+    }
+  },
+  computed: {
+    shortcutEnabled: function () {
+      return this.focused && !this.overlaid
     }
   },
   mounted () {
diff --git a/src/renderer/components/TimelineSpace/Contents/Cards/Notification/Mention.vue b/src/renderer/components/TimelineSpace/Contents/Cards/Notification/Mention.vue
index 052a5e61..a3d36263 100644
--- a/src/renderer/components/TimelineSpace/Contents/Cards/Notification/Mention.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Cards/Notification/Mention.vue
@@ -4,6 +4,7 @@
       :message="message.status"
       :filter="filter"
       :focused="focused"
+      :overlaid="overlaid"
       v-on:update="updateToot"
       @focusNext="$emit('focusNext')"
       @focusPrev="$emit('focusPrev')"
@@ -30,6 +31,10 @@ export default {
     focused: {
       type: Boolean,
       default: false
+    },
+    overlaid: {
+      type: Boolean,
+      default: false
     }
   },
   components: { Toot },
diff --git a/src/renderer/components/TimelineSpace/Contents/Cards/Notification/Reblog.vue b/src/renderer/components/TimelineSpace/Contents/Cards/Notification/Reblog.vue
index f3ffca24..c3916d06 100644
--- a/src/renderer/components/TimelineSpace/Contents/Cards/Notification/Reblog.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Cards/Notification/Reblog.vue
@@ -2,7 +2,7 @@
 <div
   class="status"
   tabIndex="0"
-  v-shortkey="focused ? {next: ['j'], prev: ['k']} : {}"
+  v-shortkey="shortcutEnabled ? {next: ['j'], prev: ['k']} : {}"
   @shortkey="handleStatusControl"
   ref="status"
   @click="$emit('select')"
@@ -91,6 +91,10 @@ export default {
     focused: {
       type: Boolean,
       default: false
+    },
+    overlaid: {
+      type: Boolean,
+      default: false
     }
   },
   data () {
@@ -99,6 +103,11 @@ export default {
       showAttachments: false
     }
   },
+  computed: {
+    shortcutEnabled: function () {
+      return this.focused && !this.overlaid
+    }
+  },
   mounted () {
     if (this.focused) {
       this.$refs.status.focus()
diff --git a/src/renderer/components/TimelineSpace/Contents/Cards/Toot.vue b/src/renderer/components/TimelineSpace/Contents/Cards/Toot.vue
index d1c008f2..f2a388d1 100644
--- a/src/renderer/components/TimelineSpace/Contents/Cards/Toot.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Cards/Toot.vue
@@ -2,7 +2,7 @@
 <div
   class="status"
   tabIndex="0"
-  v-shortkey="focused ? {next: ['j'], prev: ['k'], reply: ['r'], boost: ['b'], fav: ['f'], open: ['o'], profile: ['p']} : {}"
+  v-shortkey="shortcutEnabled ? {next: ['j'], prev: ['k'], reply: ['r'], boost: ['b'], fav: ['f'], open: ['o'], profile: ['p']} : {}"
   @shortkey="handleTootControl"
   ref="status"
   @click="$emit('selectToot')"
@@ -142,12 +142,19 @@ export default {
     focused: {
       type: Boolean,
       default: false
+    },
+    overlaid: {
+      type: Boolean,
+      default: false
     }
   },
   computed: {
     ...mapState({
       displayNameStyle: state => state.App.displayNameStyle
-    })
+    }),
+    shortcutEnabled: function () {
+      return this.focused && !this.overlaid
+    }
   },
   mounted () {
     if (this.focused) {
@@ -387,6 +394,7 @@ export default {
     handleTootControl (event) {
       switch (event.srcKey) {
         case 'next':
+          console.log(this.shortcutEnabled)
           this.$emit('focusNext')
           break
         case 'prev':
diff --git a/src/renderer/components/TimelineSpace/Contents/Favourites.vue b/src/renderer/components/TimelineSpace/Contents/Favourites.vue
index 122bcb68..d44c2c06 100644
--- a/src/renderer/components/TimelineSpace/Contents/Favourites.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Favourites.vue
@@ -1,5 +1,5 @@
 <template>
-<div id="favourites" v-shortkey="{next: ['j']}" @shortkey="handleKey">
+<div id="favourites" v-shortkey="shortcutEnabled ? {next: ['j']} : {}" @shortkey="handleKey">
   <div v-shortkey="{linux: ['ctrl', 'r'], mac: ['meta', 'r']}" @shortkey="reload()">
   </div>
   <div class="fav" v-for="message in favourites" v-bind:key="message.id">
@@ -7,6 +7,7 @@
       :message="message"
       :filter="filter"
       :focused="message.uri === focusedId"
+      :overlaid="modalOpened"
       v-on:update="updateToot"
       v-on:delete="deleteToot"
       @focusNext="focusNext"
@@ -25,7 +26,7 @@
 </template>
 
 <script>
-import { mapState } from 'vuex'
+import { mapState, mapGetters } from 'vuex'
 import Toot from './Cards/Toot'
 import scrollTop from '../../utils/scroll'
 
@@ -46,7 +47,13 @@ export default {
       favourites: state => state.TimelineSpace.Contents.Favourites.favourites,
       lazyLoading: state => state.TimelineSpace.Contents.Favourites.lazyLoading,
       filter: state => state.TimelineSpace.Contents.Favourites.filter
-    })
+    }),
+    ...mapGetters('TimelineSpace/Modals', [
+      'modalOpened'
+    ]),
+    shortcutEnabled: function () {
+      return !this.focusedId && !this.modalOpened
+    }
   },
   created () {
     this.$store.commit('TimelineSpace/changeLoading', true)
@@ -171,9 +178,7 @@ export default {
     handleKey (event) {
       switch (event.srcKey) {
         case 'next':
-          if (!this.focusedId) {
-            this.focusedId = this.favourites[0].uri
-          }
+          this.focusedId = this.favourites[0].uri
           break
       }
     }
diff --git a/src/renderer/components/TimelineSpace/Contents/Hashtag/Tag.vue b/src/renderer/components/TimelineSpace/Contents/Hashtag/Tag.vue
index 78123323..ff41c524 100644
--- a/src/renderer/components/TimelineSpace/Contents/Hashtag/Tag.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Hashtag/Tag.vue
@@ -1,5 +1,5 @@
 <template>
-<div name="tag" v-shortkey="{next:['j']}" @shortkey="handleKey">
+<div name="tag" v-shortkey="shortcutEnabled ? {next:['j']} : {}" @shortkey="handleKey">
   <div class="unread">{{ unread.length > 0 ? unread.length : '' }}</div>
   <div v-shortkey="{linux: ['ctrl', 'r'], mac: ['meta', 'r']}" @shortkey="reload()">
   </div>
@@ -9,6 +9,7 @@
         :message="message"
         :filter="filter"
         :focused="message.uri === focusedId"
+        :overlaid="modalOpened"
         v-on:update="updateToot"
         v-on:delete="deleteToot"
         @focusNext="focusNext"
@@ -27,7 +28,7 @@
 </template>
 
 <script>
-import { mapState } from 'vuex'
+import { mapState, mapGetters } from 'vuex'
 import Toot from '../Cards/Toot'
 import scrollTop from '../../../utils/scroll'
 
@@ -49,7 +50,13 @@ export default {
       heading: state => state.TimelineSpace.Contents.Hashtag.Tag.heading,
       unread: state => state.TimelineSpace.Contents.Hashtag.Tag.unreadTimeline,
       filter: state => state.TimelineSpace.Contents.Hashtag.Tag.filter
-    })
+    }),
+    ...mapGetters('TimelineSpace/Modals', [
+      'modalOpened'
+    ]),
+    shortcutEnabled: function () {
+      return !this.focusedId && !this.modalOpened
+    }
   },
   mounted () {
     this.$store.commit('TimelineSpace/changeLoading', true)
@@ -209,9 +216,7 @@ export default {
     handleKey (event) {
       switch (event.srcKey) {
         case 'next':
-          if (!this.focusedId) {
-            this.focusedId = this.timeline[0].uri
-          }
+          this.focusedId = this.timeline[0].uri
           break
       }
     }
diff --git a/src/renderer/components/TimelineSpace/Contents/Home.vue b/src/renderer/components/TimelineSpace/Contents/Home.vue
index a1aea6f3..7360e926 100644
--- a/src/renderer/components/TimelineSpace/Contents/Home.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Home.vue
@@ -1,5 +1,5 @@
 <template>
-<div id="home" v-shortkey="{next: ['j']}" @shortkey="handleKey">
+<div id="home" v-shortkey="shortcutEnabled ? {next: ['j']} : {}" @shortkey="handleKey">
   <div class="unread">{{ unread.length > 0 ? unread.length : '' }}</div>
   <div v-shortkey="{linux: ['ctrl', 'r'], mac: ['meta', 'r']}" @shortkey="reload()">
   </div>
@@ -9,6 +9,7 @@
         :message="message"
         :filter="filter"
         :focused="message.uri === focusedId"
+        :overlaid="modalOpened"
         v-on:update="updateToot"
         v-on:delete="deleteToot"
         @focusNext="focusNext"
@@ -28,7 +29,7 @@
 </template>
 
 <script>
-import { mapState } from 'vuex'
+import { mapState, mapGetters } from 'vuex'
 import Toot from './Cards/Toot'
 import scrollTop from '../../utils/scroll'
 
@@ -49,7 +50,13 @@ export default {
       heading: state => state.TimelineSpace.Contents.Home.heading,
       unread: state => state.TimelineSpace.Contents.Home.unreadTimeline,
       filter: state => state.TimelineSpace.Contents.Home.filter
-    })
+    }),
+    ...mapGetters('TimelineSpace/Modals', [
+      'modalOpened'
+    ]),
+    shortcutEnabled: function () {
+      return !this.focusedId && !this.modalOpened
+    }
   },
   mounted () {
     this.$store.commit('TimelineSpace/SideMenu/changeUnreadHomeTimeline', false)
@@ -176,9 +183,7 @@ export default {
     handleKey (event) {
       switch (event.srcKey) {
         case 'next':
-          if (!this.focusedId) {
-            this.focusedId = this.timeline[0].uri
-          }
+          this.focusedId = this.timeline[0].uri
           break
       }
     }
diff --git a/src/renderer/components/TimelineSpace/Contents/Lists/Show.vue b/src/renderer/components/TimelineSpace/Contents/Lists/Show.vue
index d50423df..48b4c6e8 100644
--- a/src/renderer/components/TimelineSpace/Contents/Lists/Show.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Lists/Show.vue
@@ -1,5 +1,5 @@
 <template>
-<div name="list">
+<div name="list" v-shortkey="shortcutEnabled ? {next:['j']} : {}" @shortkey="handleKey">
   <div class="unread">{{ unread.length > 0 ? unread.length : '' }}</div>
   <div v-shortkey="{linux: ['ctrl', 'r'], mac: ['meta', 'r']}" @shortkey="reload()">
   </div>
@@ -9,6 +9,7 @@
         :message="message"
         :filter="filter"
         :focused="message.uri === focusedId"
+        :overlaid="modalOpened"
         v-on:update="updateToot"
         v-on:delete="deleteToot"
         @focusNext="focusNext"
@@ -27,7 +28,7 @@
 </template>
 
 <script>
-import { mapState } from 'vuex'
+import { mapState, mapGetters } from 'vuex'
 import Toot from '../Cards/Toot'
 import scrollTop from '../../../utils/scroll'
 
@@ -49,7 +50,13 @@ export default {
       heading: state => state.TimelineSpace.Contents.Lists.Show.heading,
       unread: state => state.TimelineSpace.Contents.Lists.Show.unreadTimeline,
       filter: state => state.TimelineSpace.Contents.Lists.Show.filter
-    })
+    }),
+    ...mapGetters('TimelineSpace/Modals', [
+      'modalOpened'
+    ]),
+    shortcutEnabled: function () {
+      return !this.focusedId && !this.modalOpened
+    }
   },
   created () {
     this.$store.commit('TimelineSpace/changeLoading', true)
@@ -201,6 +208,13 @@ export default {
     },
     focusToot (message) {
       this.focusedId = message.uri
+    },
+    handleKey (event) {
+      switch (event.srcKey) {
+        case 'next':
+          this.focusedId = this.timeline[0].uri
+          break
+      }
     }
   }
 }
diff --git a/src/renderer/components/TimelineSpace/Contents/Local.vue b/src/renderer/components/TimelineSpace/Contents/Local.vue
index 2b2d59e3..13057db6 100644
--- a/src/renderer/components/TimelineSpace/Contents/Local.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Local.vue
@@ -1,5 +1,5 @@
 <template>
-<div id="local" v-shortkey="{next: ['j']}" @shortkey="handleKey">
+<div id="local" v-shortkey="shortcutEnabled ? {next: ['j']} : {}" @shortkey="handleKey">
   <div class="unread">{{ unread.length > 0 ? unread.length : '' }}</div>
   <div v-shortkey="{linux: ['ctrl', 'r'], mac: ['meta', 'r']}" @shortkey="reload()">
   </div>
@@ -9,6 +9,7 @@
         :message="message"
         :filter="filter"
         :focused="message.uri === focusedId"
+        :overlaid="modalOpened"
         v-on:update="updateToot"
         v-on:delete="deleteToot"
         @focusNext="focusNext"
@@ -28,7 +29,7 @@
 </template>
 
 <script>
-import { mapState } from 'vuex'
+import { mapState, mapGetters } from 'vuex'
 import Toot from './Cards/Toot'
 import scrollTop from '../../utils/scroll'
 
@@ -49,7 +50,13 @@ export default {
       heading: state => state.TimelineSpace.Contents.Local.heading,
       unread: state => state.TimelineSpace.Contents.Local.unreadTimeline,
       filter: state => state.TimelineSpace.Contents.Local.filter
-    })
+    }),
+    ...mapGetters('TimelineSpace/Modals', [
+      'modalOpened'
+    ]),
+    shortcutEnabled: function () {
+      return !this.focusedId && !this.modalOpened
+    }
   },
   mounted () {
     this.$store.commit('TimelineSpace/SideMenu/changeUnreadLocalTimeline', false)
@@ -79,6 +86,7 @@ export default {
       }
     },
     focusedId: function (newState, oldState) {
+      console.log(newState)
       if (newState && this.heading) {
         this.$store.commit('TimelineSpace/Contents/Local/changeHeading', false)
       } else if (newState === null && !this.heading) {
@@ -155,6 +163,7 @@ export default {
     },
     focusNext () {
       const currentIndex = this.timeline.findIndex(toot => this.focusedId === toot.uri)
+      console.log(currentIndex)
       if (currentIndex === -1) {
         this.focusedId = this.timeline[0].uri
       } else if (currentIndex < this.timeline.length) {
@@ -171,13 +180,12 @@ export default {
     },
     focusToot (message) {
       this.focusedId = message.uri
+      console.log(this.focusedId)
     },
     handleKey (event) {
       switch (event.srcKey) {
         case 'next':
-          if (!this.focusedId) {
-            this.focusedId = this.timeline[0].uri
-          }
+          this.focusedId = this.timeline[0].uri
           break
       }
     }
diff --git a/src/renderer/components/TimelineSpace/Contents/Notifications.vue b/src/renderer/components/TimelineSpace/Contents/Notifications.vue
index cdd516cd..b692c67e 100644
--- a/src/renderer/components/TimelineSpace/Contents/Notifications.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Notifications.vue
@@ -1,5 +1,5 @@
 <template>
-<div id="notifications" v-shortkey="{next: ['j']}" @shortkey="handleKey">
+<div id="notifications" v-shortkey="shortcutEnabled ? {next: ['j']} : {}" @shortkey="handleKey">
   <div class="unread">{{ unread.length > 0 ? unread.length : '' }}</div>
   <div v-shortkey="{linux: ['ctrl', 'r'], mac: ['meta', 'r']}" @shortkey="reload()">
   </div>
@@ -9,6 +9,7 @@
         :message="message"
         :filter="filter"
         :focused="index === focusedIndex"
+        :overlaid="modalOpened"
         @focusNext="focusNext"
         @focusPrev="focusPrev"
         @selectNotification="focusNotification(index)"
@@ -26,7 +27,7 @@
 </template>
 
 <script>
-import { mapState } from 'vuex'
+import { mapState, mapGetters } from 'vuex'
 import Notification from './Cards/Notification'
 import scrollTop from '../../utils/scroll'
 
@@ -47,7 +48,13 @@ export default {
       heading: state => state.TimelineSpace.Contents.Notifications.heading,
       unread: state => state.TimelineSpace.Contents.Notifications.unreadNotifications,
       filter: state => state.TimelineSpace.Contents.Notifications.filter
-    })
+    }),
+    ...mapGetters('TimelineSpace/Modals', [
+      'modalOpened'
+    ]),
+    shortcutEnabled: function () {
+      return !this.focusedIndex && !this.modalOpened
+    }
   },
   mounted () {
     this.$store.commit('TimelineSpace/SideMenu/changeUnreadNotifications', false)
@@ -161,9 +168,7 @@ export default {
     handleKey (event) {
       switch (event.srcKey) {
         case 'next':
-          if (!this.focusedIndex) {
-            this.focusedIndex = 0
-          }
+          this.focusedIndex = 0
           break
       }
     }
diff --git a/src/renderer/components/TimelineSpace/Contents/Public.vue b/src/renderer/components/TimelineSpace/Contents/Public.vue
index 4b1fb1f8..ebfc6d99 100644
--- a/src/renderer/components/TimelineSpace/Contents/Public.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Public.vue
@@ -1,5 +1,5 @@
 <template>
-<div id="public" v-shortkey="{next: ['j']}" @shortkey="handleKey">
+<div id="public" v-shortkey="shortcutEnabled ? {next: ['j']} : {}" @shortkey="handleKey">
   <div class="unread">{{ unread.length > 0 ? unread.length : '' }}</div>
   <div v-shortkey="{linux: ['ctrl', 'r'], mac: ['meta', 'r']}" @shortkey="reload()">
   </div>
@@ -9,6 +9,7 @@
         :message="message"
         :filter="filter"
         :focused="message.uri === focusedId"
+        :overlaid="modalOpened"
         v-on:update="updateToot"
         v-on:delete="deleteToot"
         @focusNext="focusNext"
@@ -28,7 +29,7 @@
 </template>
 
 <script>
-import { mapState } from 'vuex'
+import { mapState, mapGetters } from 'vuex'
 import Toot from './Cards/Toot'
 import scrollTop from '../../utils/scroll'
 
@@ -49,7 +50,13 @@ export default {
       heading: state => state.TimelineSpace.Contents.Public.heading,
       unread: state => state.TimelineSpace.Contents.Public.unreadTimeline,
       filter: state => state.TimelineSpace.Contents.Public.filter
-    })
+    }),
+    ...mapGetters('TimelineSpace/Modals', [
+      'modalOpened'
+    ]),
+    shortcutEnabled: function () {
+      return !this.focusedId && !this.modalOpened
+    }
   },
   created () {
     this.$store.commit('TimelineSpace/changeLoading', true)
@@ -198,9 +205,7 @@ export default {
     handleKey (event) {
       switch (event.srcKey) {
         case 'next':
-          if (!this.focusedId) {
-            this.focusedId = this.timeline[0].uri
-          }
+          this.focusedId = this.timeline[0].uri
           break
       }
     }
diff --git a/src/renderer/store/TimelineSpace/Modals.js b/src/renderer/store/TimelineSpace/Modals.js
index 773156d5..dee242c3 100644
--- a/src/renderer/store/TimelineSpace/Modals.js
+++ b/src/renderer/store/TimelineSpace/Modals.js
@@ -14,6 +14,17 @@ const Modals = {
     ListMembership,
     AddListMember,
     Shortcut
+  },
+  getters: {
+    modalOpened: (state, getters, rootState) => {
+      const imageViewer = rootState.TimelineSpace.Modals.ImageViewer.modalOpen
+      const newToot = rootState.TimelineSpace.Modals.NewToot.modalOpen
+      const jump = rootState.TimelineSpace.Modals.Jump.modalOpen
+      const listMembership = rootState.TimelineSpace.Modals.ListMembership.modalOpen
+      const addListMember = rootState.TimelineSpace.Modals.AddListMember.modalOpen
+      const shortcut = rootState.TimelineSpace.Modals.Jump.modalOpen
+      return imageViewer || newToot || jump || listMembership || addListMember || shortcut
+    }
   }
 }
 

From 58b5fb1dc90ebc84808d136586de8029eb0ed16f Mon Sep 17 00:00:00 2001
From: AkiraFukushima <h3.poteto@gmail.com>
Date: Fri, 24 Aug 2018 00:17:47 +0900
Subject: [PATCH 4/5] fixes: Stop help shortcut when modal is opened

---
 src/renderer/components/TimelineSpace.vue | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/renderer/components/TimelineSpace.vue b/src/renderer/components/TimelineSpace.vue
index 4b743e2b..c3d38367 100644
--- a/src/renderer/components/TimelineSpace.vue
+++ b/src/renderer/components/TimelineSpace.vue
@@ -5,7 +5,7 @@
   :element-loading-text="$t('message.loading')"
   element-loading-spinner="el-icon-loading"
   element-loading-background="rgba(0, 0, 0, 0.8)"
-  v-shortkey="{help: ['h']}"
+  v-shortkey="shortcutEnabled ? {help: ['h']} : {}"
   @shortkey="handleKey"
   >
   <side-menu></side-menu>
@@ -21,7 +21,7 @@
 </template>
 
 <script>
-import { mapState } from 'vuex'
+import { mapState, mapGetters } from 'vuex'
 import SideMenu from './TimelineSpace/SideMenu'
 import HeaderMenu from './TimelineSpace/HeaderMenu'
 import Contents from './TimelineSpace/Contents'
@@ -42,7 +42,13 @@ export default {
     ...mapState({
       loading: state => state.TimelineSpace.loading,
       collapse: state => state.TimelineSpace.SideMenu.collapse
-    })
+    }),
+    ...mapGetters('TimelineSpace/Modals', [
+      'modalOpened'
+    ]),
+    shortcutEnabled: function () {
+      return !this.modalOpened
+    }
   },
   created () {
     this.$store.commit('TimelineSpace/changeLoading', true)

From c4355dfe023f3f160ff22f37c5192c3f74c6a29d Mon Sep 17 00:00:00 2001
From: AkiraFukushima <h3.poteto@gmail.com>
Date: Fri, 24 Aug 2018 08:25:24 +0900
Subject: [PATCH 5/5] fixes: Avoid vue-shortkey at input

---
 .../TimelineSpace/Contents/Hashtag.vue        |  2 +-
 .../TimelineSpace/Contents/Search.vue         |  2 +-
 .../components/TimelineSpace/HeaderMenu.vue   | 33 ++++++++++++++++++-
 3 files changed, 34 insertions(+), 3 deletions(-)

diff --git a/src/renderer/components/TimelineSpace/Contents/Hashtag.vue b/src/renderer/components/TimelineSpace/Contents/Hashtag.vue
index 28434075..3d8bd3ed 100644
--- a/src/renderer/components/TimelineSpace/Contents/Hashtag.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Hashtag.vue
@@ -9,7 +9,7 @@
           </el-button>
         </div>
         <div class="form-item input">
-          <input v-model="tag" :placeholder="$t('hashtag.tag_name')" class="search-keyword" v-shortkey="['enter']" @shortkey="search" autofocus></input>
+          <input v-model="tag" :placeholder="$t('hashtag.tag_name')" class="search-keyword" v-shortkey.avoid v-on:keyup.enter="search" autofocus></input>
         </div>
         <div class="form-item" v-show="tagPage()">
           <el-button type="text" @click="save">
diff --git a/src/renderer/components/TimelineSpace/Contents/Search.vue b/src/renderer/components/TimelineSpace/Contents/Search.vue
index 2ec3267c..1e0c1f2c 100644
--- a/src/renderer/components/TimelineSpace/Contents/Search.vue
+++ b/src/renderer/components/TimelineSpace/Contents/Search.vue
@@ -10,7 +10,7 @@
             :value="item.target">
           </el-option>
         </el-select>
-        <input v-model="query" :placeholder="$t('search.keyword')" class="search-keyword" v-shortkey="['enter']" @shortkey="search" autofocus></input>
+        <input v-model="query" :placeholder="$t('search.keyword')" class="search-keyword" v-shortkey.avoid v-on:keyup.enter="search" autofocus></input>
         <div class="clearfix"></div>
       </el-form>
     </div>
diff --git a/src/renderer/components/TimelineSpace/HeaderMenu.vue b/src/renderer/components/TimelineSpace/HeaderMenu.vue
index ab734a79..33d27382 100644
--- a/src/renderer/components/TimelineSpace/HeaderMenu.vue
+++ b/src/renderer/components/TimelineSpace/HeaderMenu.vue
@@ -17,7 +17,9 @@
       <div>
         <el-form>
           <el-form-item :label="$t('header_menu.filter.title')">
-            <el-input v-model="filter" :placeholder="$t('header_menu.filter.placeholder')"></el-input>
+            <div class="input-wrapper">
+              <input v-model="filter" :placeholder="$t('header_menu.filter.placeholder')" v-shortkey.avoid v-on:keyup.enter="applyFilter(filter)"></input>
+            </div>
           </el-form-item>
           <el-form-item>
             <el-button type="primary" @click="applyFilter(filter)">{{ $t('header_menu.filter.apply') }}</el-button>
@@ -234,4 +236,33 @@ export default {
     }
   }
 }
+
+.input-wrapper {
+  position: relative;
+  font-size: 14px;
+  display: inline-block;
+  width: 100%;
+
+  input {
+    background-color: #fff;
+    background-image: none;
+    border-radius: 4px;
+    border: 1px solid #dcdfe6;
+    box-sizing: border-box;
+    color: #606266;
+    display: inline-block;
+    font-size: inherit;
+    height: 40px;
+    line-height: 40px;
+    outline: none;
+    padding: 0 15px;
+    transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+    width: 100%;
+
+    &:focus {
+      outline: none;
+      border-color: #409eff;
+    }
+  }
+}
 </style>