# HG changeset patch
# User Thomas Junk <thomas.junk@intevation.de>
# Date 1626182557 -7200
# Node ID 25d0d315937660419a069d10a115889f94e5e6c6
# Parent  fbad74acd23fd306d3e2b6fd0c37130147546da3
Esc/click to stop operation.

diff -r fbad74acd23f -r 25d0d3159376 client/src/components/KeyboardHandler.vue
--- a/client/src/components/KeyboardHandler.vue	Wed Jul 07 20:11:17 2021 +0200
+++ b/client/src/components/KeyboardHandler.vue	Tue Jul 13 15:22:37 2021 +0200
@@ -1,7 +1,7 @@
 <template>
   <transition name="fade">
     <div class="notice" v-if="showNotice">
-      <span>{{ noticeText }}</span>
+      <span @click="stopOperation">{{ noticeText }}</span>
     </div>
   </transition>
 </template>
@@ -70,28 +70,37 @@
       }
     }
   },
+  methods: {
+    closeCompareView() {
+      this.$store.commit("fairwayprofile/additionalSurvey", null);
+    },
+    stopDrawing() {
+      this.$store.commit("map/lineToolEnabled", false);
+      this.$store.commit("map/polygonToolEnabled", false);
+      this.$store.commit("map/cutToolEnabled", false);
+      this.$store.commit("map/setCurrentMeasurement", null);
+      this.openLayersMaps.forEach(m => {
+        m.getLayer("DRAWTOOL")
+          .getSource()
+          .clear();
+      });
+    },
+    stopOperation() {
+      if (
+        this.lineToolEnabled ||
+        this.polygonToolEnabled ||
+        this.cutToolEnabled
+      ) {
+        this.stopDrawing();
+      } else if (this.paneSetup.includes("COMPARESURVEYS")) {
+        this.closeCompareView();
+      }
+    }
+  },
   mounted() {
     window.addEventListener("keydown", e => {
       // Escape
-      if (e.keyCode === 27) {
-        if (
-          this.lineToolEnabled ||
-          this.polygonToolEnabled ||
-          this.cutToolEnabled
-        ) {
-          this.$store.commit("map/lineToolEnabled", false);
-          this.$store.commit("map/polygonToolEnabled", false);
-          this.$store.commit("map/cutToolEnabled", false);
-          this.$store.commit("map/setCurrentMeasurement", null);
-          this.openLayersMaps.forEach(m => {
-            m.getLayer("DRAWTOOL")
-              .getSource()
-              .clear();
-          });
-        } else if (this.paneSetup.includes("COMPARESURVEYS")) {
-          this.$store.commit("fairwayprofile/additionalSurvey", null);
-        }
-      }
+      if (e.key === "Esc" || e.key === "Escape") this.stopOperation();
     });
   }
 };