Mercurial > gemma

annotate client/src/fairway/Fairwayprofile.vue @ 1204:ddfdf440da24

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
made searchbar contextual if bottlenecks are open search bar refers to that list if imports are open search bar is hidden
author Markus Kottlaender <markus@intevation.de>
date Mon, 19 Nov 2018 11:23:00 +0100
parents 502e0b960424
children ba8cd80d68b6
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>
1146
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
2 <div :class="['position-relative', {show: showSplitscreen}]" v-if="Object.keys(currentProfile).length">
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
3 <button
1166
0cddb3b24d24 moved fairway profile close/collapse buttons into profile container
Markus Kottlaender <markus@intevation.de>
parents: 1165
diff changeset
4 class="rounded-bottom bg-white border-0 position-absolute splitscreen-toggle shadow-sm"
1146
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
5 @click="$store.commit('application/showSplitscreen', false)"
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
6 v-if="showSplitscreen">
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
7 <i class="fa fa-angle-down"></i>
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
8 </button>
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
9 <button
1166
0cddb3b24d24 moved fairway profile close/collapse buttons into profile container
Markus Kottlaender <markus@intevation.de>
parents: 1165
diff changeset
10 class="rounded-bottom bg-white border-0 position-absolute clear-selection shadow-sm"
1146
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
11 @click="$store.dispatch('fairwayprofile/clearSelection');"
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
12 v-if="showSplitscreen">
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
13 <i class="fa fa-times text-danger"></i>
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
14 </button>
1176
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
15 <div class="profile d-flex flex-column pr-5">
1146
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
16 <h5 class="mb-0 mt-2">{{ selectedBottleneck }} ({{ selectedSurvey.date_info }})</h5>
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
17 <div class="d-flex flex-fill">
1176
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
18 <div class="fairwayprofile flex-grow-1"></div>
1146
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
19 <div class="additionalsurveys d-flex flex-column">
1176
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
20 <small>
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
21 Additional Surveys
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
22 <select v-model="additionalSurvey" class="form-control form-control-sm">
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
23 <option value="">None</option>
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
24 <option
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
25 v-for="survey in additionalSurveys"
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
26 :key="survey.date_info"
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
27 :value="survey"
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
28 >{{survey.date_info}}</option>
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
29 </select>
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
30 <hr>
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
31 <div class="d-flex text-left mb-2">
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
32 <div class="text-nowrap mr-1">
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
33 <b>Start:</b>
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
34 <br>
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
35 Lat: {{ startPoint[1] }}
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
36 <br>
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
37 Lon: {{ startPoint[0] }}
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
38 </div>
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
39 <div class="text-nowrap ml-1">
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
40 <b>End:</b>
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
41 <br>
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
42 Lat: {{ endPoint[1] }}
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
43 <br>
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
44 Lon: {{ endPoint[0] }}
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
45 </div>
1177
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
46 <button class="btn btn-outline-secondary btn-sm ml-2 mt-auto"
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
47 @click="showLabelInput = !showLabelInput">
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
48 <i :class="'fa fa-' + (showLabelInput ? 'times' : 'save')"></i>
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
49 </button>
1176
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
50 <button v-clipboard:copy="coordinatesForClipboard"
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
51 v-clipboard:success="onCopyCoordinates"
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
52 class="btn btn-outline-secondary btn-sm ml-2 mt-auto">
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
53 <i class="fa fa-copy"></i>
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
54 </button>
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
55 </div>
1177
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
56 <div v-if="showLabelInput">
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
57 Enter label for cross profile:
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
58 <div class="position-relative">
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
59 <input class="form-control form-control-sm pr-5" v-model="cutLabel" /><br>
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
60 <button class="btn btn-sm btn-outline-secondary position-absolute"
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
61 @click="saveCut"
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
62 v-if="cutLabel"
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
63 style="top: 0; right: 0;">
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
64 <i class="fa fa-check"></i>
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
65 </button>
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
66 </div>
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
67 </div>
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
68 Saved cross profiles:
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
69 <select class="form-control form-control-sm mb-2" v-model="coordinatesSelect">
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
70 <option></option>
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
71 <option v-for="(cut, index) in previousCuts" :value="cut.coordinates" :key="index">
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
72 {{ cut.label }}
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
73 </option>
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
74 </select>
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
75 Enter coordinates manually:
1176
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
76 <div class="position-relative">
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
77 <input class="form-control form-control-sm pr-5" placeholder="Lat,Lon,Lat,Lon" v-model="coordinatesInput" /><br>
1181
1335e088e7ef fixed bug
Markus Kottlaender <markus@intevation.de>
parents: 1177
diff changeset
78 <button class="btn btn-sm btn-outline-secondary position-absolute"
1335e088e7ef fixed bug
Markus Kottlaender <markus@intevation.de>
parents: 1177
diff changeset
79 @click="applyManualCoordinates"
1335e088e7ef fixed bug
Markus Kottlaender <markus@intevation.de>
parents: 1177
diff changeset
80 style="top: 0; right: 0;"
1335e088e7ef fixed bug
Markus Kottlaender <markus@intevation.de>
parents: 1177
diff changeset
81 v-if="coordinatesInput">
1176
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
82 <i class="fa fa-check"></i>
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
83 </button>
fdab87f013e2 improve fairway profile UI
Markus Kottlaender <markus@intevation.de>
parents: 1166
diff changeset
84 </div>
1146
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
85 </small>
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
86 </div>
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
87 </div>
1015
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
88 </div>
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
89 </div>
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
90 </template>
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
91
1146
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
92 <style lang="sass" scoped>
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
93 .profile
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
94 background-color: white
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
95 width: 100vw
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
96 height: 0
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
97 overflow: hidden
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
98 position: relative
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
99 z-index: 2
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
100
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
101 .splitscreen-toggle,
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
102 .clear-selection
1166
0cddb3b24d24 moved fairway profile close/collapse buttons into profile container
Markus Kottlaender <markus@intevation.de>
parents: 1165
diff changeset
103 right: $icon-width + $offset
1146
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
104 width: $icon-width
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
105 height: $icon-height
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
106 margin-top: 2px
1166
0cddb3b24d24 moved fairway profile close/collapse buttons into profile container
Markus Kottlaender <markus@intevation.de>
parents: 1165
diff changeset
107 z-index: 3
1146
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
108 outline: none
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
109
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
110 .clear-selection
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
111 right: $offset
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
112
1146
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
113 .show
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
114 .profile
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
115 height: 50vh
1015
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
116
1146
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
117 .waterlevelselection
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
118 margin-top: $large-offset
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
119 margin-right: $large-offset
1015
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
120
1146
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
121 .additionalsurveys
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
122 margin-top: $large-offset
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
123 margin-bottom: auto
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
124 margin-right: $large-offset
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
125 margin-left: auto
1177
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
126 max-width: 300px
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
127
1146
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
128 .additionalsurveys input
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
129 margin-right: $small-offset
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
130
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
131 .fairwayprofile
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
132 background-color: white
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
133 margin: $offset
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
134 margin-top: 0
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
135 </style>
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
136
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
137 <script>
1019
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
138 /*
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
139 * This is Free Software under GNU Affero General Public License v >= 3.0
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
140 * without warranty, see README.md and license for details.
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
141 *
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
142 * SPDX-License-Identifier: AGPL-3.0-or-later
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
143 * License-Filename: LICENSES/AGPL-3.0.txt
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
144 *
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
145 * Copyright (C) 2018 by via donau
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
146 * – Österreichische Wasserstraßen-Gesellschaft mbH
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
147 * Software engineering by Intevation GmbH
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
148 *
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
149 * Author(s):
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
150 * Thomas Junk <thomas.junk@intevation.de>
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
151 */
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
152 import * as d3 from "d3";
1164
dc99decbf9e3 added input to enter cross cut coordinates manually
Markus Kottlaender <markus@intevation.de>
parents: 1163
diff changeset
153 import { mapState, mapGetters } from "vuex";
1163
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
154 import { displayError, displayInfo } from "../application/lib/errors.js";
1164
dc99decbf9e3 added input to enter cross cut coordinates manually
Markus Kottlaender <markus@intevation.de>
parents: 1163
diff changeset
155 import Feature from "ol/Feature";
dc99decbf9e3 added input to enter cross cut coordinates manually
Markus Kottlaender <markus@intevation.de>
parents: 1163
diff changeset
156 import LineString from "ol/geom/LineString";
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
157
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
158 const GROUND_COLOR = "#4A2F06";
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
159
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
160 export default {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
161 name: "fairwayprofile",
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
162 props: [
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
163 "width",
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
164 "height",
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
165 "xScale",
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
166 "yScaleLeft",
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
167 "yScaleRight",
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
168 "margin",
1015
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
169 "additionalSurveys"
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
170 ],
1164
dc99decbf9e3 added input to enter cross cut coordinates manually
Markus Kottlaender <markus@intevation.de>
parents: 1163
diff changeset
171 data() {
dc99decbf9e3 added input to enter cross cut coordinates manually
Markus Kottlaender <markus@intevation.de>
parents: 1163
diff changeset
172 return {
dc99decbf9e3 added input to enter cross cut coordinates manually
Markus Kottlaender <markus@intevation.de>
parents: 1163
diff changeset
173 wait: false,
1177
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
174 coordinatesInput: "",
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
175 coordinatesSelect: null,
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
176 cutLabel: "",
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
177 showLabelInput: false
1164
dc99decbf9e3 added input to enter cross cut coordinates manually
Markus Kottlaender <markus@intevation.de>
parents: 1163
diff changeset
178 };
dc99decbf9e3 added input to enter cross cut coordinates manually
Markus Kottlaender <markus@intevation.de>
parents: 1163
diff changeset
179 },
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
180 computed: {
1164
dc99decbf9e3 added input to enter cross cut coordinates manually
Markus Kottlaender <markus@intevation.de>
parents: 1163
diff changeset
181 ...mapGetters("map", ["getLayerByName"]),
1146
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
182 ...mapState("application", ["showSplitscreen"]),
1030
bf10a7f990cc refac: fairway profile retrieves current data from store
Thomas Junk <thomas.junk@intevation.de>
parents: 1021
diff changeset
183 ...mapState("fairwayprofile", [
bf10a7f990cc refac: fairway profile retrieves current data from store
Thomas Junk <thomas.junk@intevation.de>
parents: 1021
diff changeset
184 "startPoint",
bf10a7f990cc refac: fairway profile retrieves current data from store
Thomas Junk <thomas.junk@intevation.de>
parents: 1021
diff changeset
185 "endPoint",
bf10a7f990cc refac: fairway profile retrieves current data from store
Thomas Junk <thomas.junk@intevation.de>
parents: 1021
diff changeset
186 "currentProfile",
1053
82ae9cb56982 refac: removed properties from fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 1046
diff changeset
187 "minAlt",
82ae9cb56982 refac: removed properties from fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 1046
diff changeset
188 "maxAlt",
82ae9cb56982 refac: removed properties from fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 1046
diff changeset
189 "totalLength",
82ae9cb56982 refac: removed properties from fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 1046
diff changeset
190 "fairwayCoordinates",
82ae9cb56982 refac: removed properties from fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 1046
diff changeset
191 "waterLevels",
1177
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
192 "selectedWaterLevel",
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
193 "previousCuts"
1030
bf10a7f990cc refac: fairway profile retrieves current data from store
Thomas Junk <thomas.junk@intevation.de>
parents: 1021
diff changeset
194 ]),
1146
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
195 ...mapState("bottlenecks", ["selectedBottleneck", "selectedSurvey"]),
1056
28eb62f7c676 additional survey as dynamic property
Thomas Junk <thomas.junk@intevation.de>
parents: 1054
diff changeset
196 additionalSurvey: {
28eb62f7c676 additional survey as dynamic property
Thomas Junk <thomas.junk@intevation.de>
parents: 1054
diff changeset
197 get() {
28eb62f7c676 additional survey as dynamic property
Thomas Junk <thomas.junk@intevation.de>
parents: 1054
diff changeset
198 return this.$store.getters["fairwayprofile/additionalSurvey"];
28eb62f7c676 additional survey as dynamic property
Thomas Junk <thomas.junk@intevation.de>
parents: 1054
diff changeset
199 },
28eb62f7c676 additional survey as dynamic property
Thomas Junk <thomas.junk@intevation.de>
parents: 1054
diff changeset
200 set(value) {
28eb62f7c676 additional survey as dynamic property
Thomas Junk <thomas.junk@intevation.de>
parents: 1054
diff changeset
201 this.$store.commit("fairwayprofile/setAdditionalSurvey", value);
28eb62f7c676 additional survey as dynamic property
Thomas Junk <thomas.junk@intevation.de>
parents: 1054
diff changeset
202 this.selectAdditionalSurveyData();
28eb62f7c676 additional survey as dynamic property
Thomas Junk <thomas.junk@intevation.de>
parents: 1054
diff changeset
203 }
28eb62f7c676 additional survey as dynamic property
Thomas Junk <thomas.junk@intevation.de>
parents: 1054
diff changeset
204 },
1030
bf10a7f990cc refac: fairway profile retrieves current data from store
Thomas Junk <thomas.junk@intevation.de>
parents: 1021
diff changeset
205 currentData() {
1111
f106aee673e7 selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents: 1075
diff changeset
206 if (
f106aee673e7 selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents: 1075
diff changeset
207 !this.selectedSurvey ||
f106aee673e7 selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents: 1075
diff changeset
208 !this.currentProfile.hasOwnProperty(this.selectedSurvey.date_info)
1142
dc3f0277628a feat: Importqueue listing (Proof of concept)
Thomas Junk <thomas.junk@intevation.de>
parents: 1111
diff changeset
209 )
dc3f0277628a feat: Importqueue listing (Proof of concept)
Thomas Junk <thomas.junk@intevation.de>
parents: 1111
diff changeset
210 return [];
1111
f106aee673e7 selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents: 1075
diff changeset
211 return this.currentProfile[this.selectedSurvey.date_info];
1030
bf10a7f990cc refac: fairway profile retrieves current data from store
Thomas Junk <thomas.junk@intevation.de>
parents: 1021
diff changeset
212 },
1038
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
213 additionalData() {
1111
f106aee673e7 selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents: 1075
diff changeset
214 if (
f106aee673e7 selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents: 1075
diff changeset
215 !this.additionalSurvey ||
f106aee673e7 selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents: 1075
diff changeset
216 !this.currentProfile.hasOwnProperty(this.additionalSurvey.date_info)
1142
dc3f0277628a feat: Importqueue listing (Proof of concept)
Thomas Junk <thomas.junk@intevation.de>
parents: 1111
diff changeset
217 )
dc3f0277628a feat: Importqueue listing (Proof of concept)
Thomas Junk <thomas.junk@intevation.de>
parents: 1111
diff changeset
218 return [];
1111
f106aee673e7 selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents: 1075
diff changeset
219 return this.currentProfile[this.additionalSurvey.date_info];
1038
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
220 },
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
221 waterColor() {
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
222 const result = this.waterLevels.find(
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
223 x => x.level === this.selectedWaterLevel
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
224 );
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
225 return result.color;
1163
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
226 },
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
227 coordinatesForClipboard() {
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
228 return (
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
229 this.startPoint[1] +
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
230 "," +
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
231 this.startPoint[0] +
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
232 "," +
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
233 this.endPoint[1] +
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
234 "," +
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
235 this.endPoint[0]
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
236 );
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
237 }
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
238 },
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
239 watch: {
1146
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
240 showSplitscreen() {
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
241 this.drawDiagram();
74e180ad3d6b fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents: 1142
diff changeset
242 },
1038
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
243 currentData() {
780
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
244 this.drawDiagram();
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
245 },
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
246 width() {
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
247 this.drawDiagram();
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
248 },
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
249 height() {
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
250 this.drawDiagram();
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
251 },
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
252 waterLevels() {
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
253 this.drawDiagram();
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
254 },
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
255 selectedWaterLevel() {
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
256 this.drawDiagram();
802
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
257 },
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
258 fairwayCoordinates() {
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
259 this.drawDiagram();
1177
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
260 },
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
261 selectedBottleneck() {
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
262 this.$store.dispatch("fairwayprofile/previousCuts");
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
263 this.cutLabel =
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
264 this.selectedBottleneck + " (" + new Date().toISOString() + ")";
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
265 },
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
266 coordinatesSelect(newValue) {
1199
181b8a947ecd fixed property of null bug
Markus Kottlaender <markus@intevation.de>
parents: 1181
diff changeset
267 if (newValue) {
181b8a947ecd fixed property of null bug
Markus Kottlaender <markus@intevation.de>
parents: 1181
diff changeset
268 this.applyCoordinates(newValue);
181b8a947ecd fixed property of null bug
Markus Kottlaender <markus@intevation.de>
parents: 1181
diff changeset
269 }
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
270 }
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
271 },
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
272 methods: {
1018
ab64c76af1b0 additional survey selection for 2nd crossprofile added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
273 selectAdditionalSurveyData() {
1054
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
274 if (
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
275 !this.additionalSurvey ||
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
276 this.wait ||
1111
f106aee673e7 selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents: 1075
diff changeset
277 this.currentProfile[this.additionalSurvey.date_info]
1054
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
278 ) {
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
279 this.drawDiagram();
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
280 return;
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
281 }
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
282 this.$store
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
283 .dispatch("fairwayprofile/loadProfile", this.additionalSurvey)
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
284 .then(() => {
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
285 this.wait = false;
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
286 })
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
287 .catch(error => {
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
288 this.wait = false;
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
289 let status = "ERROR";
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
290 let data = error;
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
291 const response = error.response;
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
292 if (response) {
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
293 status = response.status;
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
294 data = response.data;
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
295 }
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
296 displayError({
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
297 title: "Backend Error",
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
298 message: `${status}: ${data.message || data}`
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
299 });
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
300 });
1015
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
301 },
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
302 drawDiagram() {
1177
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
303 this.coordinatesSelect = null;
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
304 const chartDiv = document.querySelector(".fairwayprofile");
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
305 d3.select("svg").remove();
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
306 let svg = d3.select(chartDiv).append("svg");
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
307 svg.attr("width", this.width);
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
308 svg.attr("height", this.height);
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
309 const width = this.width - this.margin.right - 1.5 * this.margin.left;
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
310 const height = this.height - this.margin.top - 2 * this.margin.bottom;
1030
bf10a7f990cc refac: fairway profile retrieves current data from store
Thomas Junk <thomas.junk@intevation.de>
parents: 1021
diff changeset
311 const currentData = this.currentData;
1038
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
312 const additionalData = this.additionalData;
780
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
313 const {
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
314 xScale,
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
315 yScaleRight,
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
316 yScaleLeft,
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
317 graph
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
318 } = this.generateCoordinates(svg, height, width);
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
319 this.drawWaterlevel({
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
320 graph,
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
321 xScale,
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
322 yScaleRight,
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
323 height,
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
324 width
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
325 });
1059
51d412a79e4f omit render while clearing profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1056
diff changeset
326 if (currentData) {
51d412a79e4f omit render while clearing profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1056
diff changeset
327 this.drawProfile({
51d412a79e4f omit render while clearing profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1056
diff changeset
328 graph,
51d412a79e4f omit render while clearing profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1056
diff changeset
329 xScale,
51d412a79e4f omit render while clearing profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1056
diff changeset
330 yScaleRight,
51d412a79e4f omit render while clearing profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1056
diff changeset
331 currentData,
51d412a79e4f omit render while clearing profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1056
diff changeset
332 height,
51d412a79e4f omit render while clearing profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1056
diff changeset
333 width,
51d412a79e4f omit render while clearing profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1056
diff changeset
334 color: GROUND_COLOR,
51d412a79e4f omit render while clearing profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1056
diff changeset
335 strokeColor: "black",
51d412a79e4f omit render while clearing profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1056
diff changeset
336 opacity: 1
51d412a79e4f omit render while clearing profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1056
diff changeset
337 });
51d412a79e4f omit render while clearing profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1056
diff changeset
338 }
1038
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
339 if (additionalData) {
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
340 this.drawProfile({
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
341 graph,
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
342 xScale,
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
343 yScaleRight,
1054
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
344 currentData: additionalData,
1038
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
345 height,
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
346 width,
1054
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
347 color: GROUND_COLOR,
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
348 strokeColor: "#943007",
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
349 opacity: 0.6
1038
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
350 });
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
351 }
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
352 this.drawLabels({
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
353 graph,
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
354 xScale,
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
355 yScaleLeft,
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
356 currentData,
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
357 height,
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
358 width
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
359 });
802
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
360 this.drawFairway({
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
361 graph,
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
362 xScale,
803
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
363 yScaleRight,
802
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
364 currentData,
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
365 height,
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
366 width
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
367 });
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
368 },
807
34b2cfcab24c Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 803
diff changeset
369 drawFairway({ graph, xScale, yScaleRight }) {
803
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
370 for (let coordinates of this.fairwayCoordinates) {
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
371 const [startPoint, endPoint, depth] = coordinates;
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
372 let fairwayArea = d3
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
373 .area()
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
374 .x(function(d) {
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
375 return xScale(d.x);
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
376 })
849
d63e60b868bf WIP Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 845
diff changeset
377 .y0(yScaleRight(0))
803
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
378 .y1(function(d) {
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
379 return yScaleRight(d.y);
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
380 });
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
381 graph
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
382 .append("path")
1075
c1989ebe1d8a feat: invert fairwayprofile scale
Thomas Junk <thomas.junk@intevation.de>
parents: 1059
diff changeset
383 .datum([{ x: startPoint, y: depth }, { x: endPoint, y: depth }])
803
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
384 .attr("fill", "#002AFF")
810
68a39aea942a Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 807
diff changeset
385 .attr("stroke-opacity", 0.65)
68a39aea942a Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 807
diff changeset
386 .attr("fill-opacity", 0.65)
803
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
387 .attr("stroke", "#FFD20D")
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
388 .attr("d", fairwayArea);
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
389 }
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
390 },
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
391 drawLabels({ graph, height }) {
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
392 graph
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
393 .append("text")
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
394 .attr("transform", ["rotate(-90)"])
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
395 .attr("y", this.width - 60)
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
396 .attr("x", -(this.height - this.margin.top - this.margin.bottom) / 2)
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
397 .attr("dy", "1em")
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
398 .attr("fill", "black")
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
399 .style("text-anchor", "middle")
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
400 .text("Depth [m]");
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
401 graph
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
402 .append("text")
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
403 .attr("y", 0 - this.margin.left)
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
404 .attr("x", 0 - height / 4)
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
405 .attr("dy", "1em")
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
406 .attr("fill", "black")
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
407 .style("text-anchor", "middle")
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
408 .attr("transform", [
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
409 "translate(" + this.width / 2 + "," + this.height + ")",
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
410 "rotate(0)"
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
411 ])
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
412 .text("Width [m]");
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
413 },
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
414 generateCoordinates(svg, height, width) {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
415 let xScale = d3
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
416 .scaleLinear()
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
417 .domain(this.xScale)
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
418 .rangeRound([0, width]);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
419
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
420 xScale.ticks(5);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
421 let yScaleLeft = d3
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
422 .scaleLinear()
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
423 .domain(this.yScaleLeft)
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
424 .rangeRound([height, 0]);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
425
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
426 let yScaleRight = d3
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
427 .scaleLinear()
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
428 .domain(this.yScaleRight)
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
429 .rangeRound([height, 0]);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
430
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
431 let xAxis = d3.axisBottom(xScale);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
432 let yAxis2 = d3.axisRight(yScaleRight);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
433 let graph = svg
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
434 .append("g")
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
435 .attr(
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
436 "transform",
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
437 "translate(" + this.margin.left + "," + this.margin.top + ")"
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
438 );
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
439 graph
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
440 .append("g")
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
441 .attr("transform", "translate(0," + height + ")")
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
442 .call(xAxis.ticks(5));
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
443 graph
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
444 .append("g")
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
445 .attr("transform", "translate(" + width + ",0)")
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
446 .call(yAxis2);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
447 return { xScale, yScaleLeft, yScaleRight, graph };
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
448 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
449 drawWaterlevel({ graph, xScale, yScaleRight, height }) {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
450 let waterArea = d3
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
451 .area()
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
452 .x(function(d) {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
453 return xScale(d.x);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
454 })
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
455 .y0(height)
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
456 .y1(function(d) {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
457 return yScaleRight(d.y);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
458 });
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
459 graph
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
460 .append("path")
844
c2cba785ca4d WIP Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 841
diff changeset
461 .datum([{ x: 0, y: 0 }, { x: this.totalLength, y: 0 }])
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
462 .attr("fill", this.waterColor)
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
463 .attr("stroke", this.waterColor)
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
464 .attr("d", waterArea);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
465 },
1038
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
466 drawProfile({
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
467 graph,
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
468 xScale,
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
469 yScaleRight,
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
470 currentData,
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
471 height,
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
472 color,
1054
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
473 strokeColor,
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
474 opacity
1038
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
475 }) {
780
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
476 for (let part of currentData) {
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
477 let profileLine = d3
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
478 .line()
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
479 .x(d => {
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
480 return xScale(d.x);
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
481 })
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
482 .y(d => {
1075
c1989ebe1d8a feat: invert fairwayprofile scale
Thomas Junk <thomas.junk@intevation.de>
parents: 1059
diff changeset
483 return yScaleRight(d.y);
780
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
484 });
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
485 let profileArea = d3
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
486 .area()
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
487 .x(function(d) {
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
488 return xScale(d.x);
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
489 })
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
490 .y0(height)
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
491 .y1(function(d) {
1075
c1989ebe1d8a feat: invert fairwayprofile scale
Thomas Junk <thomas.junk@intevation.de>
parents: 1059
diff changeset
492 return yScaleRight(d.y);
780
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
493 });
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
494 graph
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
495 .append("path")
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
496 .datum(part)
1038
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
497 .attr("fill", color)
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
498 .attr("stroke", color)
780
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
499 .attr("stroke-width", 3)
1054
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
500 .attr("stroke-opacity", opacity)
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
501 .attr("fill-opacity", opacity)
780
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
502 .attr("d", profileArea);
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
503 graph
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
504 .append("path")
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
505 .datum(part)
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
506 .attr("fill", "none")
1038
e8ebfbc2aa05 feat: additional surveydata WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 1030
diff changeset
507 .attr("stroke", strokeColor)
780
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
508 .attr("stroke-linejoin", "round")
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
509 .attr("stroke-linecap", "round")
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
510 .attr("stroke-width", 3)
1054
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
511 .attr("stroke-opacity", opacity)
9bd4f82fcd8d display additional profile
Thomas Junk <thomas.junk@intevation.de>
parents: 1053
diff changeset
512 .attr("fill-opacity", opacity)
780
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
513 .attr("d", profileLine);
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
514 }
1163
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
515 },
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
516 onCopyCoordinates() {
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
517 displayInfo({
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
518 title: "Success",
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
519 message: "Coordinates copied to clipboard!"
fb5c83d4ea1d added copy coordinates button to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1146
diff changeset
520 });
1164
dc99decbf9e3 added input to enter cross cut coordinates manually
Markus Kottlaender <markus@intevation.de>
parents: 1163
diff changeset
521 },
1177
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
522 applyManualCoordinates() {
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
523 const coordinates = this.coordinatesInput
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
524 .split(",")
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
525 .map(coord => parseFloat(coord.trim()));
1200
502e0b960424 improve manual coordinate input validation
Markus Kottlaender <markus@intevation.de>
parents: 1199
diff changeset
526 this.applyCoordinates([
502e0b960424 improve manual coordinate input validation
Markus Kottlaender <markus@intevation.de>
parents: 1199
diff changeset
527 coordinates[1],
502e0b960424 improve manual coordinate input validation
Markus Kottlaender <markus@intevation.de>
parents: 1199
diff changeset
528 coordinates[0],
502e0b960424 improve manual coordinate input validation
Markus Kottlaender <markus@intevation.de>
parents: 1199
diff changeset
529 coordinates[3],
502e0b960424 improve manual coordinate input validation
Markus Kottlaender <markus@intevation.de>
parents: 1199
diff changeset
530 coordinates[2]
502e0b960424 improve manual coordinate input validation
Markus Kottlaender <markus@intevation.de>
parents: 1199
diff changeset
531 ]);
1177
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
532 },
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
533 applyCoordinates(coordinates) {
1200
502e0b960424 improve manual coordinate input validation
Markus Kottlaender <markus@intevation.de>
parents: 1199
diff changeset
534 // allow only numbers
1204
ddfdf440da24 made searchbar contextual
Markus Kottlaender <markus@intevation.de>
parents: 1200
diff changeset
535 coordinates = coordinates.filter(c => Number(c) === c);
1177
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
536 if (coordinates.length === 4) {
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
537 // draw line on map
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
538 const cutLayer = this.getLayerByName("Cut Tool");
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
539 cutLayer.data.getSource().clear();
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
540 const cut = new Feature({
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
541 geometry: new LineString([
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
542 [coordinates[0], coordinates[1]],
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
543 [coordinates[2], coordinates[3]]
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
544 ]).transform("EPSG:4326", "EPSG:3857")
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
545 });
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
546 cutLayer.data.getSource().addFeature(cut);
1164
dc99decbf9e3 added input to enter cross cut coordinates manually
Markus Kottlaender <markus@intevation.de>
parents: 1163
diff changeset
547
1177
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
548 // draw diagram
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
549 this.$store.dispatch("fairwayprofile/cut", cut);
1200
502e0b960424 improve manual coordinate input validation
Markus Kottlaender <markus@intevation.de>
parents: 1199
diff changeset
550 } else {
502e0b960424 improve manual coordinate input validation
Markus Kottlaender <markus@intevation.de>
parents: 1199
diff changeset
551 displayError({
502e0b960424 improve manual coordinate input validation
Markus Kottlaender <markus@intevation.de>
parents: 1199
diff changeset
552 title: "Invalid input",
1204
ddfdf440da24 made searchbar contextual
Markus Kottlaender <markus@intevation.de>
parents: 1200
diff changeset
553 message:
ddfdf440da24 made searchbar contextual
Markus Kottlaender <markus@intevation.de>
parents: 1200
diff changeset
554 "Please enter correct coordinates in the format: Lat,Lon,Lat,Lon"
1200
502e0b960424 improve manual coordinate input validation
Markus Kottlaender <markus@intevation.de>
parents: 1199
diff changeset
555 });
1164
dc99decbf9e3 added input to enter cross cut coordinates manually
Markus Kottlaender <markus@intevation.de>
parents: 1163
diff changeset
556 }
1177
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
557 },
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
558 saveCut() {
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
559 const previousCuts =
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
560 JSON.parse(localStorage.getItem("previousCuts")) || [];
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
561 const newEntry = {
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
562 label: this.cutLabel,
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
563 bottleneckName: this.selectedBottleneck,
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
564 coordinates: [...this.startPoint, ...this.endPoint]
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
565 };
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
566 const existingEntry = previousCuts.find(cut => {
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
567 return JSON.stringify(cut) === JSON.stringify(newEntry);
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
568 });
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
569 if (!existingEntry) previousCuts.push(newEntry);
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
570 if (previousCuts.length > 100) previousCuts.shift();
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
571 localStorage.setItem("previousCuts", JSON.stringify(previousCuts));
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
572 this.$store.dispatch("fairwayprofile/previousCuts");
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
573
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
574 this.showLabelInput = false;
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
575 displayInfo({
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
576 title: "Coordinates saved!",
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
577 message:
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
578 'You can now select these coordinates from the "Saved cross profiles" menu to restore this cross profile.'
48ae4458710d save cross profiles to local storage to restore them from a dropdown
Markus Kottlaender <markus@intevation.de>
parents: 1176
diff changeset
579 });
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
580 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
581 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
582 mounted() {
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
583 this.drawDiagram();
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
584 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
585 };
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
586 </script>