annotate client/src/components/layers/Layerselect.vue @ 1926:1220cfe96efd

client: prepare isoline legend graphic for reuse * Change loading of the legend image for the isolines to directly convert it into a dataUrl, so it can be re-used later. Doing it here as, this is the place where asynchronous loading is taking place. * License header: Add BER as author and 2019.
author Bernhard Reiter <bernhard@intevation.de>
date Mon, 21 Jan 2019 10:41:46 +0100
parents 16fb9667ddf8
children 5a37ee321651
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
1272
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
1 <template>
1361
ea3a89a1813a remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents: 1277
diff changeset
2 <div>
ea3a89a1813a remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents: 1277
diff changeset
3 <div class="form-check d-flex flex-row flex-start selection">
ea3a89a1813a remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents: 1277
diff changeset
4 <input
ea3a89a1813a remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents: 1277
diff changeset
5 class="form-check-input"
ea3a89a1813a remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents: 1277
diff changeset
6 @change="visibilityToggled"
ea3a89a1813a remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents: 1277
diff changeset
7 :id="layername"
ea3a89a1813a remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents: 1277
diff changeset
8 type="checkbox"
ea3a89a1813a remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents: 1277
diff changeset
9 :checked="isVisible"
1480
9b81ac91a43e fix: linting
Thomas Junk <thomas.junk@intevation.de>
parents: 1449
diff changeset
10 />
9b81ac91a43e fix: linting
Thomas Junk <thomas.junk@intevation.de>
parents: 1449
diff changeset
11 <LegendElement
9b81ac91a43e fix: linting
Thomas Junk <thomas.junk@intevation.de>
parents: 1449
diff changeset
12 :layername="layername"
9b81ac91a43e fix: linting
Thomas Junk <thomas.junk@intevation.de>
parents: 1449
diff changeset
13 :layerindex="layerindex"
9b81ac91a43e fix: linting
Thomas Junk <thomas.junk@intevation.de>
parents: 1449
diff changeset
14 ></LegendElement>
9b81ac91a43e fix: linting
Thomas Junk <thomas.junk@intevation.de>
parents: 1449
diff changeset
15 <label class="layername form-check-label" @click="visibilityToggled">{{
9b81ac91a43e fix: linting
Thomas Junk <thomas.junk@intevation.de>
parents: 1449
diff changeset
16 layername
9b81ac91a43e fix: linting
Thomas Junk <thomas.junk@intevation.de>
parents: 1449
diff changeset
17 }}</label>
1272
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
18 </div>
1480
9b81ac91a43e fix: linting
Thomas Junk <thomas.junk@intevation.de>
parents: 1449
diff changeset
19 <div v-if="isVisible && layername == 'Bottleneck isolines'">
9b81ac91a43e fix: linting
Thomas Junk <thomas.junk@intevation.de>
parents: 1449
diff changeset
20 <img class="rounded my-1 d-block" :src="isolinesLegendImgUrl" />
1361
ea3a89a1813a remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents: 1277
diff changeset
21 </div>
ea3a89a1813a remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents: 1277
diff changeset
22 </div>
1272
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
23 </template>
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
24
1449
bb47531bdd22 sass to scss
Thomas Junk <thomas.junk@intevation.de>
parents: 1362
diff changeset
25 <style lang="scss" scoped>
bb47531bdd22 sass to scss
Thomas Junk <thomas.junk@intevation.de>
parents: 1362
diff changeset
26 .selection {
bb47531bdd22 sass to scss
Thomas Junk <thomas.junk@intevation.de>
parents: 1362
diff changeset
27 text-align: left;
bb47531bdd22 sass to scss
Thomas Junk <thomas.junk@intevation.de>
parents: 1362
diff changeset
28 }
bb47531bdd22 sass to scss
Thomas Junk <thomas.junk@intevation.de>
parents: 1362
diff changeset
29 .layername {
bb47531bdd22 sass to scss
Thomas Junk <thomas.junk@intevation.de>
parents: 1362
diff changeset
30 margin-left: $small-offset;
bb47531bdd22 sass to scss
Thomas Junk <thomas.junk@intevation.de>
parents: 1362
diff changeset
31 }
1272
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
32 </style>
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
33
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
34 <script>
1362
ca33ad696594 remove the first empyty lines
Fadi Abbud <fadi.abbud@intevation.de>
parents: 1361
diff changeset
35 /* This is Free Software under GNU Affero General Public License v >= 3.0
1272
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
36 * without warranty, see README.md and license for details.
1361
ea3a89a1813a remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents: 1277
diff changeset
37 *
1272
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
38 * SPDX-License-Identifier: AGPL-3.0-or-later
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
39 * License-Filename: LICENSES/AGPL-3.0.txt
1361
ea3a89a1813a remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents: 1277
diff changeset
40 *
1926
1220cfe96efd client: prepare isoline legend graphic for reuse
Bernhard Reiter <bernhard@intevation.de>
parents: 1669
diff changeset
41 * Copyright (C) 2018, 2019 by via donau
1272
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
42 * – Österreichische Wasserstraßen-Gesellschaft mbH
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
43 * Software engineering by Intevation GmbH
1361
ea3a89a1813a remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents: 1277
diff changeset
44 *
1272
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
45 * Author(s):
1926
1220cfe96efd client: prepare isoline legend graphic for reuse
Bernhard Reiter <bernhard@intevation.de>
parents: 1669
diff changeset
46 * * Thomas Junk <thomas.junk@intevation.de>
1220cfe96efd client: prepare isoline legend graphic for reuse
Bernhard Reiter <bernhard@intevation.de>
parents: 1669
diff changeset
47 * * Bernhard Reiter <bernhard.reiter@intevation.de>
1272
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
48 */
1613
f2d24dceecc7 refac: cleanup import paths
Thomas Junk <thomas.junk@intevation.de>
parents: 1558
diff changeset
49 import { HTTP } from "@/lib/http";
1272
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
50 export default {
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
51 props: ["layername", "layerindex", "isVisible"],
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
52 name: "layerselect",
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
53 data() {
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
54 return {
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
55 isolinesLegendImgUrl: ""
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
56 };
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
57 },
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
58 components: {
1669
16fb9667ddf8 refac: use dynamic imports for components
Thomas Junk <thomas.junk@intevation.de>
parents: 1613
diff changeset
59 LegendElement: () => import("./LegendElement.vue")
1272
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
60 },
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
61 methods: {
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
62 visibilityToggled() {
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
63 this.$emit("visibilityToggled", this.layerindex);
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
64 }
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
65 },
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
66 created() {
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
67 // fetch legend image for bottleneck isolines
1926
1220cfe96efd client: prepare isoline legend graphic for reuse
Bernhard Reiter <bernhard@intevation.de>
parents: 1669
diff changeset
68 // directly read as dataURL so it is reusable later
1272
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
69 // TODO: move to store
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
70 if (this.layername == "Bottleneck isolines") {
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
71 const src =
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
72 "/internal/wms?REQUEST=GetLegendGraphic&VERSION=1.0.0&FORMAT=image/png&WIDTH=20&HEIGHT=20&LAYER=sounding_results_contour_lines_geoserver&legend_options=columns:4;fontAntiAliasing:true";
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
73 HTTP.get(src, {
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
74 headers: {
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
75 Accept: "image/png",
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
76 "X-Gemma-Auth": localStorage.getItem("token")
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
77 },
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
78 responseType: "blob"
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
79 }).then(response => {
1926
1220cfe96efd client: prepare isoline legend graphic for reuse
Bernhard Reiter <bernhard@intevation.de>
parents: 1669
diff changeset
80 var that = this;
1220cfe96efd client: prepare isoline legend graphic for reuse
Bernhard Reiter <bernhard@intevation.de>
parents: 1669
diff changeset
81 const reader = new FileReader();
1220cfe96efd client: prepare isoline legend graphic for reuse
Bernhard Reiter <bernhard@intevation.de>
parents: 1669
diff changeset
82 reader.onload = function() {
1220cfe96efd client: prepare isoline legend graphic for reuse
Bernhard Reiter <bernhard@intevation.de>
parents: 1669
diff changeset
83 that.isolinesLegendImgUrl = this.result;
1220cfe96efd client: prepare isoline legend graphic for reuse
Bernhard Reiter <bernhard@intevation.de>
parents: 1669
diff changeset
84 };
1220cfe96efd client: prepare isoline legend graphic for reuse
Bernhard Reiter <bernhard@intevation.de>
parents: 1669
diff changeset
85 reader.readAsDataURL(response.data);
1272
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
86 });
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
87 }
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
88 }
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
89 };
bc55ffaeb639 cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
90 </script>