Merge pull request #182 from h3poteto/iss-181

closes #181 Use vue-shortkey at shortcut when post new toot

package.json

@@ -91,6 +91,7 @@
     "vue-awesome": "^2.3.5",
     "vue-electron": "^1.0.6",
     "vue-router": "^2.5.3",
+    "vue-shortkey": "^3.1.0",
     "vuex": "^2.3.1"
   },
   "devDependencies": {

src/renderer/components/TimelineSpace/Modals/NewToot.vue

@@ -6,7 +6,7 @@
     class="new-toot-modal">
     <el-form v-on:submit.prevent="toot">
       <div class="status">
-        <textarea v-model="status" ref="status" @keyup.meta.enter.exact="toot" @keyup.ctrl.enter.exact="toot" @keyup.enter.exact="enter" @keydown="keydown" @keyup="keyup"></textarea>
+        <textarea v-model="status" ref="status" v-shortkey="{linux: ['ctrl', 'enter'], mac: ['meta', 'enter']}" @shortkey="toot()"></textarea>
       </div>
     </el-form>
     <div class="preview">
@@ -35,7 +35,6 @@ export default {
   name: 'new-toot',
   data () {
     return {
-      ctrlPressed: false,
       attachedImageId: 0
     }
   },
@@ -77,24 +76,6 @@ export default {
     close () {
       this.resetImage()
       this.$store.dispatch('TimelineSpace/Modals/NewToot/changeModal', false)
-      this.ctrlPressed = false
-    },
-    keydown (e) {
-      if (e.keyCode === 17 || e.keyCode === 93) {
-        this.ctrlPressed = true
-      }
-    },
-    keyup (e) {
-      if (e.keyCode === 17 || e.keyCode === 93) {
-        setTimeout(() => {
-          this.ctrlPressed = false
-        }, 100)
-      }
-    },
-    enter () {
-      if (this.ctrlPressed) {
-        this.toot()
-      }
     },
     toot () {
       if (this.status.length <= 0 || this.status.length >= 500) {

src/renderer/store/TimelineSpace/Modals/NewToot.js

@@ -57,13 +57,13 @@ const NewToot = {
       commit('changeModal', true)
     },
     changeModal ({ commit }, value) {
+      commit('changeModal', value)
       if (!value) {
         commit('updateStatus', '')
         commit('setReplyTo', null)
         commit('changeBlockSubmit', false)
         commit('clearAttachedMedias')
       }
-      commit('changeModal', value)
     },
     uploadImage ({ state, commit, rootState }, image) {
       return new Promise((resolve, reject) => {

src/renderer/store/index.js

@@ -1,6 +1,7 @@
 import Vue from 'vue'
 import Vuex from 'vuex'
 import createLogger from 'vuex/dist/logger'
+import shortkey from 'vue-shortkey'
 
 import App from './App'
 import GlobalHeader from './GlobalHeader'
@@ -10,6 +11,7 @@ import TimelineSpace from './TimelineSpace'
 import Preferences from './Preferences'
 
 Vue.use(Vuex)
+Vue.use(shortkey)
 
 export default new Vuex.Store({
   strict: process.env.NODE_ENV !== 'production',