Mercurial > gemma
diff client/src/fairway/Fairwayprofile.vue @ 1163:fb5c83d4ea1d
added copy coordinates button to fairway profile
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Wed, 14 Nov 2018 07:29:51 +0100 |
parents | 74e180ad3d6b |
children | dc99decbf9e3 |
line wrap: on
line diff
--- a/client/src/fairway/Fairwayprofile.vue Tue Nov 13 17:22:32 2018 +0100 +++ b/client/src/fairway/Fairwayprofile.vue Wed Nov 14 07:29:51 2018 +0100 @@ -39,6 +39,11 @@ <br> Lon: {{ endPoint[0] }} <br> + <button v-clipboard:copy="coordinatesForClipboard" + v-clipboard:success="onCopyCoordinates" + class="btn btn-outline-secondary btn-sm mt-2"> + Copy coordinates + </button> </small> </div> </div> @@ -112,7 +117,7 @@ */ import * as d3 from "d3"; import { mapState } from "vuex"; -import { displayError } from "../application/lib/errors.js"; +import { displayError, displayInfo } from "../application/lib/errors.js"; const GROUND_COLOR = "#4A2F06"; @@ -171,6 +176,17 @@ x => x.level === this.selectedWaterLevel ); return result.color; + }, + coordinatesForClipboard() { + return ( + this.startPoint[1] + + "," + + this.startPoint[0] + + "," + + this.endPoint[1] + + "," + + this.endPoint[0] + ); } }, data() { @@ -443,6 +459,12 @@ .attr("fill-opacity", opacity) .attr("d", profileLine); } + }, + onCopyCoordinates() { + displayInfo({ + title: "Success", + message: "Coordinates copied to clipboard!" + }); } }, mounted() {