Mercurial > gemma
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>