Add shortkey

doccano/app/server/package.json

@@ -0,0 +1,20 @@
+{
+  "name": "server",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "vue": "^2.5.16",
+    "vue-loader": "^15.2.4",
+    "vue-shortkey": "^3.1.5"
+  },
+  "devDependencies": {
+    "webpack": "^4.12.0",
+    "webpack-cli": "^3.0.8"
+  }
+}

doccano/app/server/static/annotation.1.js

@@ -1,3 +1,6 @@
+import Vue from 'vue';
+Vue.use(require('vue-shortkey'));
+
 axios.defaults.xsrfCookieName = 'csrftoken';
 axios.defaults.xsrfHeaderName = 'X-CSRFToken';
 var base_url = window.location.href.split('/').slice(3, 5).join('/');

doccano/app/server/templates/annotation.1.html

@@ -23,7 +23,7 @@
                     <div class="control" v-for="label in labels">
                         <li class="tags has-addons">
                             <span class="tag is-primary">[[label.shortcut]]</span>
-                            <a class="tag is-grey" v-on:click="addLabel(label.text)">[[label.text]]</a>
+                            <a class="tag is-grey" v-on:click="addLabel(label.text)" v-shortkey="['ctrl', [[ label.shortcut ]]]" @shortkey="addLabel(label.text)">[[label.text]]</a>
                         </li>
                     </div>
                 </ul>
@@ -72,10 +72,10 @@
     <div class="column is-7 message hero is-fullheight is-hidden" id="message-pane">
         <div class="action-buttons">
             <div class="control is-grouped">
-                <a class="button is-small" v-on:click="prevPage">
+                <a class="button is-small" v-on:click="prevPage" v-shortkey="['ctrl', 'p']" @shortkey="prevPage">
                     <i class="fa fa-chevron-left"></i>
                 </a>
-                <a class="button is-small" v-on:click="nextPage">
+                <a class="button is-small" v-on:click="nextPage" v-shortkey="['ctrl', 'n']" @shortkey="nextPage">
                     <i class="fa fa-chevron-right"></i>
                 </a>
             </div>
@@ -106,5 +106,5 @@
     crossorigin="anonymous"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.15.1/moment.min.js" integrity="sha256-4PIvl58L9q7iwjT654TQJM+C/acEyoG738iL8B8nhXg="
     crossorigin="anonymous"></script>
-<script type="text/javascript" src="{% static 'annotation.1.js' %}"></script>
+<script type="text/javascript" src="{% static 'main.js' %}"></script>
 {% endblock %}

doccano/app/server/webpack.config.js

@@ -0,0 +1,23 @@
+const VueLoaderPlugin = require('vue-loader/lib/plugin')
+
+    module.exports = {
+    module: {
+	rules: [
+		// ... other rules
+{
+    test: /\.vue$/,
+    loader: 'vue-loader'
+}
+    ]
+    },
+    plugins: [
+	      // make sure to include the plugin!
+	      new VueLoaderPlugin()
+	      ],
+    resolve: {
+	extensions: ['.js', '.vue'],
+	alias: {
+	    vue$: 'vue/dist/vue.esm.js', //webpack使う場合はこっちを指定する https://jp.vuejs.org/v2/guide/installation.html#%E7%94%A8%E8%AA%9E
+	},
+    },
+}