Mercurial > gemma

annotate client/src/application/Main.vue @ 1144:5f98d0c9d738

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
linted code
author Markus Kottlaender <markus@intevation.de>
date Mon, 12 Nov 2018 15:12:04 +0100
parents 2fda33d55d81
children 74e180ad3d6b
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
1 <template>
621
b17a4482d07d feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
2 <div class="main d-flex flex-column">
1123
d9e6a1f6f394 moved all collapse flags for UI elements to store
Markus Kottlaender <markus@intevation.de>
parents: 1111
diff changeset
3 <Maplayer :split="showSplitscreen" :lat="6155376" :long="1819178" :zoom="11"></Maplayer>
d9e6a1f6f394 moved all collapse flags for UI elements to store
Markus Kottlaender <markus@intevation.de>
parents: 1111
diff changeset
4 <div v-if="showSplitscreen" class="profile d-flex flex-row">
1025
a55f20dc8d8d refac: store profiles by date
Thomas Junk <thomas.junk@intevation.de>
parents: 1019
diff changeset
5 <FairwayProfile
a55f20dc8d8d refac: store profiles by date
Thomas Junk <thomas.junk@intevation.de>
parents: 1019
diff changeset
6 :additionalSurveys="additionalSurveys"
a55f20dc8d8d refac: store profiles by date
Thomas Junk <thomas.junk@intevation.de>
parents: 1019
diff changeset
7 :height="height"
a55f20dc8d8d refac: store profiles by date
Thomas Junk <thomas.junk@intevation.de>
parents: 1019
diff changeset
8 :width="width"
a55f20dc8d8d refac: store profiles by date
Thomas Junk <thomas.junk@intevation.de>
parents: 1019
diff changeset
9 :xScale="xAxis"
a55f20dc8d8d refac: store profiles by date
Thomas Junk <thomas.junk@intevation.de>
parents: 1019
diff changeset
10 :yScaleLeft="yAxisLeft"
a55f20dc8d8d refac: store profiles by date
Thomas Junk <thomas.junk@intevation.de>
parents: 1019
diff changeset
11 :yScaleRight="yAxisRight"
a55f20dc8d8d refac: store profiles by date
Thomas Junk <thomas.junk@intevation.de>
parents: 1019
diff changeset
12 :margin="margins"
a55f20dc8d8d refac: store profiles by date
Thomas Junk <thomas.junk@intevation.de>
parents: 1019
diff changeset
13 ></FairwayProfile>
621
b17a4482d07d feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
14 </div>
593
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 592
diff changeset
15 </div>
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
16 </template>
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
17
1139
2fda33d55d81 scoped css
Markus Kottlaender <markus@intevation.de>
parents: 1123
diff changeset
18 <style lang="scss" scoped>
593
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 592
diff changeset
19 .profile {
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 592
diff changeset
20 background-color: white;
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 592
diff changeset
21 height: 50vh;
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 592
diff changeset
22 }
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
23 </style>
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
24
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
25 <script>
1019
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
26 /*
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
27 * This is Free Software under GNU Affero General Public License v >= 3.0
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
28 * without warranty, see README.md and license for details.
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
29 *
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
30 * SPDX-License-Identifier: AGPL-3.0-or-later
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
31 * License-Filename: LICENSES/AGPL-3.0.txt
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
32 *
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
33 * Copyright (C) 2018 by via donau
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
34 * – Österreichische Wasserstraßen-Gesellschaft mbH
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
35 * Software engineering by Intevation GmbH
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
36 *
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
37 * Author(s):
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
38 * Thomas Junk <thomas.junk@intevation.de>
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
39 */
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
40
592
8e67604d972a moved main.vue to application
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
41 import Maplayer from "../map/Maplayer";
593
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 592
diff changeset
42 import FairwayProfile from "../fairway/Fairwayprofile";
1144
5f98d0c9d738 linted code
Markus Kottlaender <markus@intevation.de>
parents: 1139
diff changeset
43 import { mapState } from "vuex";
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
44 import debounce from "debounce";
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
45
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
46 export default {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
47 name: "mainview",
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
48 components: {
593
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 592
diff changeset
49 Maplayer,
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 592
diff changeset
50 FairwayProfile
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 592
diff changeset
51 },
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
52 data() {
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
53 return {
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
54 width: null,
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
55 height: null,
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
56 margin: {
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
57 top: 20,
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
58 right: 40,
901
36731fbe51a2 bottom margin increased for bottleneckdeselection
Thomas Junk <thomas.junk@intevation.de>
parents: 879
diff changeset
59 bottom: 30,
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
60 left: 40
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
61 }
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
62 };
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
63 },
593
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 592
diff changeset
64 computed: {
1123
d9e6a1f6f394 moved all collapse flags for UI elements to store
Markus Kottlaender <markus@intevation.de>
parents: 1111
diff changeset
65 ...mapState("application", ["showSplitscreen"]),
1013
15c3cc6f29a4 refac: fairwayprofile store cleanup
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
66 ...mapState("fairwayprofile", [
780
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 767
diff changeset
67 "currentProfile",
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 767
diff changeset
68 "minAlt",
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 767
diff changeset
69 "maxAlt",
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
70 "totalLength",
802
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
71 "waterLevels",
841
07be3e5f99a9 WIP Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
72 "fairwayCoordinates",
1111
f106aee673e7 selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents: 1106
diff changeset
73 "selectedWaterLevel"
780
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 767
diff changeset
74 ]),
1111
f106aee673e7 selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents: 1106
diff changeset
75 ...mapState("bottlenecks", ["surveys", "selectedSurvey"]),
1015
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 1013
diff changeset
76 additionalSurveys() {
1111
f106aee673e7 selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents: 1106
diff changeset
77 if (!this.surveys) return [];
f106aee673e7 selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents: 1106
diff changeset
78 if (!this.selectedSurvey) return this.surveys;
f106aee673e7 selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents: 1106
diff changeset
79 return this.surveys.filter(survey => {
f106aee673e7 selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents: 1106
diff changeset
80 return survey.date_info !== this.selectedSurvey.date_info;
1015
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 1013
diff changeset
81 });
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 1013
diff changeset
82 },
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
83 xAxis() {
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
84 return [this.xScale.x, this.xScale.y];
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
85 },
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
86 yAxisLeft() {
845
596ef3b46028 WIP Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 844
diff changeset
87 const hi = Math.max(this.maxAlt, this.selectedWaterLevel);
596ef3b46028 WIP Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 844
diff changeset
88 return [this.yScaleLeft.lo, hi];
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
89 },
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
90 yAxisRight() {
1094
80b47f5d41c3 refac: use 10% relative to scale as buffer for scale dimensions
Thomas Junk <thomas.junk@intevation.de>
parents: 1076
diff changeset
91 const DELTA = this.maxAlt * 1.1 - this.maxAlt;
1076
e99b2b7d76a1 feat: fairwayprofile configurable scale-delta for profile added
Thomas Junk <thomas.junk@intevation.de>
parents: 1075
diff changeset
92 return [this.maxAlt * 1 + DELTA, -DELTA];
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
93 },
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
94 margins() {
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
95 return this.margin;
767
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 713
diff changeset
96 },
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 713
diff changeset
97 yScaleLeft() {
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 713
diff changeset
98 return {
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 713
diff changeset
99 lo: this.minAlt,
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 713
diff changeset
100 hi: this.maxAlt
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 713
diff changeset
101 };
780
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 767
diff changeset
102 },
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 767
diff changeset
103 xScale() {
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 767
diff changeset
104 return {
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 767
diff changeset
105 x: 0,
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 767
diff changeset
106 y: this.totalLength
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 767
diff changeset
107 };
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
108 }
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
109 },
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
110 created() {
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
111 window.addEventListener("resize", debounce(this.scaleFairwayProfile), 100);
879
52fe3e20f750 client: improve print styling
Bernhard Reiter <bernhard@intevation.de>
parents: 849
diff changeset
112 window.addEventListener("onbeforeprint", this.test);
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
113 },
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
114 updated() {
767
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 713
diff changeset
115 this.scaleFairwayProfile();
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
116 },
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
117 destroyed() {
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
118 window.removeEventListener("resize", debounce(this.scaleFairwayProfile));
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
119 },
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
120 methods: {
879
52fe3e20f750 client: improve print styling
Bernhard Reiter <bernhard@intevation.de>
parents: 849
diff changeset
121 test(evt) {
52fe3e20f750 client: improve print styling
Bernhard Reiter <bernhard@intevation.de>
parents: 849
diff changeset
122 console.log("test: ", evt);
52fe3e20f750 client: improve print styling
Bernhard Reiter <bernhard@intevation.de>
parents: 849
diff changeset
123 },
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
124 scaleFairwayProfile() {
767
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 713
diff changeset
125 if (!document.querySelector(".profile")) return;
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 713
diff changeset
126 const clientHeight = document.querySelector(".profile").clientHeight;
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 713
diff changeset
127 const clientWidth = document.querySelector(".profile").clientWidth;
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 713
diff changeset
128 if (!clientHeight || !clientWidth) return;
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
129 this.height = document.querySelector(".profile").clientHeight - 25;
1015
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 1013
diff changeset
130 this.width = document.querySelector(".profile").clientWidth - 220;
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
131 }
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
132 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
133 };
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
134 </script>