changeset 1153:16d42e8183b3

cancel draw/cut tool by pressing escape key
author Markus Kottlaender <markus@intevation.de>
date Tue, 13 Nov 2018 12:29:32 +0100
parents 7cb06f85a905
children 0330a5a8480e
files client/src/drawtool/Drawtool.vue
diffstat 1 files changed, 12 insertions(+), 1 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/drawtool/Drawtool.vue	Tue Nov 13 12:03:05 2018 +0100
+++ b/client/src/drawtool/Drawtool.vue	Tue Nov 13 12:29:32 2018 +0100
@@ -1,5 +1,5 @@
 <template>
-    <div class="d-flex flex-column">
+    <div class="d-flex flex-column" @keyup.esc="alert('test')">
         <div @click="toggleLineMode" class="ui-element d-flex shadow drawtool">
             <i :class="['fa fa-pencil', {inverted: drawMode === 'LineString'}]"></i>
         </div>
@@ -119,6 +119,7 @@
         .clear();
       this.openLayersMap.removeInteraction(this.drawTool);
       this.$store.commit("map/drawTool", null);
+      this.$store.commit("map/drawMode", null);
     },
     drawEnd(event) {
       if (this.drawMode === "Polygon") {
@@ -168,6 +169,7 @@
         .clear();
       this.openLayersMap.removeInteraction(this.cutTool);
       this.$store.commit("map/cutTool", null);
+      this.$store.commit("map/cutMode", false);
     },
     cutEnd(event) {
       const length = getLength(event.feature.getGeometry());
@@ -238,6 +240,15 @@
         featureCallback
       );
     }
+  },
+  mounted() {
+    window.addEventListener('keydown', (e) => {
+      // Escape
+      if (e.keyCode === 27) {
+        this.disableDrawTool();
+        this.disableCutTool();
+      }
+    });
   }
 };
 </script>