Mercurial > gemma

comparison client/src/components/KeyboardHandler.vue @ 5448:25d0d3159376 uiimprovements

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Esc/click to stop operation.
author Thomas Junk <thomas.junk@intevation.de>
date Tue, 13 Jul 2021 15:22:37 +0200
parents 869505c5087b
children 8097ad2319f5
comparison
equal deleted inserted replaced
5401:fbad74acd23f 5448:25d0d3159376
1 <template> 1 <template>
2 <transition name="fade"> 2 <transition name="fade">
3 <div class="notice" v-if="showNotice"> 3 <div class="notice" v-if="showNotice">
4 <span>{{ noticeText }}</span> 4 <span @click="stopOperation">{{ noticeText }}</span>
5 </div> 5 </div>
6 </transition> 6 </transition>
7 </template> 7 </template>
8 8
9 <style lang="sass" scoped> 9 <style lang="sass" scoped>
68 } else if (this.paneSetup.includes("COMPARESURVEYS")) { 68 } else if (this.paneSetup.includes("COMPARESURVEYS")) {
69 return this.$gettext("Press ESC to close compare view."); 69 return this.$gettext("Press ESC to close compare view.");
70 } 70 }
71 } 71 }
72 }, 72 },
73 methods: {
74 closeCompareView() {
75 this.$store.commit("fairwayprofile/additionalSurvey", null);
76 },
77 stopDrawing() {
78 this.$store.commit("map/lineToolEnabled", false);
79 this.$store.commit("map/polygonToolEnabled", false);
80 this.$store.commit("map/cutToolEnabled", false);
81 this.$store.commit("map/setCurrentMeasurement", null);
82 this.openLayersMaps.forEach(m => {
83 m.getLayer("DRAWTOOL")
84 .getSource()
85 .clear();
86 });
87 },
88 stopOperation() {
89 if (
90 this.lineToolEnabled ||
91 this.polygonToolEnabled ||
92 this.cutToolEnabled
93 ) {
94 this.stopDrawing();
95 } else if (this.paneSetup.includes("COMPARESURVEYS")) {
96 this.closeCompareView();
97 }
98 }
99 },
73 mounted() { 100 mounted() {
74 window.addEventListener("keydown", e => { 101 window.addEventListener("keydown", e => {
75 // Escape 102 // Escape
76 if (e.keyCode === 27) { 103 if (e.key === "Esc" || e.key === "Escape") this.stopOperation();
77 if (
78 this.lineToolEnabled ||
79 this.polygonToolEnabled ||
80 this.cutToolEnabled
81 ) {
82 this.$store.commit("map/lineToolEnabled", false);
83 this.$store.commit("map/polygonToolEnabled", false);
84 this.$store.commit("map/cutToolEnabled", false);
85 this.$store.commit("map/setCurrentMeasurement", null);
86 this.openLayersMaps.forEach(m => {
87 m.getLayer("DRAWTOOL")
88 .getSource()
89 .clear();
90 });
91 } else if (this.paneSetup.includes("COMPARESURVEYS")) {
92 this.$store.commit("fairwayprofile/additionalSurvey", null);
93 }
94 }
95 }); 104 });
96 } 105 }
97 }; 106 };
98 </script> 107 </script>