# HG changeset patch
# User Markus Kottlaender <markus@intevation.de>
# Date 1559305944 -7200
# Node ID 869505c5087b85926ffa7dad2027a57a49f3dfc4
# Parent  ffc8fb059d1ac6d4adccb63a3676333004223470
client: fairway profile: close compare view with ESC key

also added a notice at the top of the screen that indicates when ESC key can be used to either cancel drawing (line,
polygon, crosscut) or to close the compare split view for two sounding results

diff -r ffc8fb059d1a -r 869505c5087b client/src/components/App.vue
--- a/client/src/components/App.vue	Fri May 31 14:29:21 2019 +0200
+++ b/client/src/components/App.vue	Fri May 31 14:32:24 2019 +0200
@@ -28,6 +28,7 @@
     <router-view />
     <vue-snotify />
     <Popup />
+    <KeyboardHandler />
   </div>
 </template>
 
@@ -104,7 +105,8 @@
     Popup: () => import("./Popup"),
     AvailableFairwayDepthDialogue: () =>
       import("./fairway/AvailableFairwayDepthDialogue.vue"),
-    MapPopup: () => import("./map/MapPopup")
+    MapPopup: () => import("./map/MapPopup"),
+    KeyboardHandler: () => import("./KeyboardHandler")
   }
 };
 </script>
diff -r ffc8fb059d1a -r 869505c5087b client/src/components/KeyboardHandler.vue
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/client/src/components/KeyboardHandler.vue	Fri May 31 14:32:24 2019 +0200
@@ -0,0 +1,98 @@
+<template>
+  <transition name="fade">
+    <div class="notice" v-if="showNotice">
+      <span>{{ noticeText }}</span>
+    </div>
+  </transition>
+</template>
+
+<style lang="sass" scoped>
+.notice
+  position: absolute
+  top: 0
+  width: 100%
+  text-align: center
+  z-index: 1
+  font-size: 11px
+  line-height: 11px
+  > span
+    opacity: 0.5
+    background: white
+    display: inline-block
+    border-bottom-right-radius: 0.25rem
+    border-bottom-left-radius: 0.25rem
+    padding: 3px 5px
+</style>
+
+<script>
+/* This is Free Software under GNU Affero General Public License v >= 3.0
+ * without warranty, see README.md and license for details.
+ *
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ * License-Filename: LICENSES/AGPL-3.0.txt
+ *
+ * Copyright (C) 2018 by via donau
+ *   – Österreichische Wasserstraßen-Gesellschaft mbH
+ * Software engineering by Intevation GmbH
+ *
+ * Author(s):
+ * Markus Kottländer <markus.kottlaender@intevation.de>
+ */
+
+import { mapState } from "vuex";
+
+export default {
+  computed: {
+    ...mapState("application", ["paneSetup"]),
+    ...mapState("map", [
+      "openLayersMaps",
+      "lineToolEnabled",
+      "polygonToolEnabled",
+      "cutToolEnabled"
+    ]),
+    showNotice() {
+      return (
+        this.lineToolEnabled ||
+        this.polygonToolEnabled ||
+        this.cutToolEnabled ||
+        this.paneSetup.includes("COMPARESURVEYS")
+      );
+    },
+    noticeText() {
+      if (
+        this.lineToolEnabled ||
+        this.polygonToolEnabled ||
+        this.cutToolEnabled
+      ) {
+        return this.$gettext("Press ESC to stop drawing.");
+      } else if (this.paneSetup.includes("COMPARESURVEYS")) {
+        return this.$gettext("Press ESC to close compare view.");
+      }
+    }
+  },
+  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);
+        }
+      }
+    });
+  }
+};
+</script>
diff -r ffc8fb059d1a -r 869505c5087b client/src/components/toolbar/Toolbar.vue
--- a/client/src/components/toolbar/Toolbar.vue	Fri May 31 14:29:21 2019 +0200
+++ b/client/src/components/toolbar/Toolbar.vue	Fri May 31 14:32:24 2019 +0200
@@ -131,24 +131,7 @@
     AvailableFairwayDepth: () => import("./AvailableFairwayDepth")
   },
   computed: {
-    ...mapState("map", ["openLayersMaps"]),
     ...mapState("application", ["expandToolbar"])
-  },
-  mounted() {
-    window.addEventListener("keydown", e => {
-      // Escape
-      if (e.keyCode === 27) {
-        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();
-        });
-      }
-    });
   }
 };
 </script>