Mercurial > gemma

annotate client/src/components/map/MapPopup.vue @ 3480:965b2fbb1890

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Colorize gauge symbol based on availability of measurements
author Tom Gottfried <tom@intevation.de>
date Mon, 27 May 2019 15:45:55 +0200
parents 80037790032d
children 271683dee9bf
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
3204
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
1 <template>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
2 <div class="map-popup rounded" ref="map-popup">
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
3 <UIBoxHeader :title="title" :closeCallback="close" small />
3300
e37b8afd7bd9 client: map popup: fixed margins
Markus Kottlaender <markus@intevation.de>
parents: 3231
diff changeset
4 <div class="p-1 small text-nowrap" style="margin-top: -0.25rem">
3204
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
5 <div
3300
e37b8afd7bd9 client: map popup: fixed margins
Markus Kottlaender <markus@intevation.de>
parents: 3231
diff changeset
6 class="d-flex flex-nowrap justify-content-between align-items-center mt-1"
3204
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
7 v-if="bottlenecks.length"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
8 v-for="bottleneck in bottlenecks"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
9 :key="bottleneck.get('objnam')"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
10 >
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
11 <div class="mr-2">
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
12 <font-awesome-icon icon="ship" class="mr-1" fixed-width />
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
13 {{ bottleneck.get("objnam") }}
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
14 </div>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
15 <div>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
16 <button
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
17 class="btn btn-xs btn-info"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
18 v-tooltip="surveysLabel"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
19 @click="openSurveys(bottleneck)"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
20 >
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
21 <font-awesome-icon icon="chart-area" fixed-width />
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
22 </button>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
23 <button
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
24 class="btn btn-xs btn-info ml-1"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
25 v-tooltip="fairwayAvailabilityLabel"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
26 @click="openFairwayAvailabilityForBottleneck(bottleneck)"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
27 >
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
28 <font-awesome-icon icon="chart-line" fixed-width />
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
29 </button>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
30 </div>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
31 </div>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
32
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
33 <div
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
34 class="d-flex flex-nowrap justify-content-between align-items-center mt-1"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
35 v-if="gauges.length"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
36 v-for="gauge in gauges"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
37 :key="gauge.get('objname')"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
38 >
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
39 <div class="mr-2">
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
40 <font-awesome-icon icon="ruler-vertical" class="mr-1" fixed-width />
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
41 {{ gauge.get("objname") }}
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
42 </div>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
43 <button
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
44 class="btn btn-xs btn-info"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
45 v-tooltip="waterlevelsLabel"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
46 @click="openGauges(gauge)"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
47 >
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
48 <font-awesome-icon icon="ruler-vertical" fixed-width />
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
49 </button>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
50 </div>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
51
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
52 <div
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
53 class="d-flex flex-nowrap justify-content-between align-items-center mt-1"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
54 v-if="stretches.length"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
55 v-for="stretch in stretches"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
56 :key="stretch.get('objnam')"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
57 >
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
58 <div class="mr-2">
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
59 <font-awesome-icon icon="road" class="mr-1" fixed-width />
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
60 {{ stretch.get("objnam") }}
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
61 </div>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
62 <button
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
63 class="btn btn-xs btn-info"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
64 v-tooltip="fairwayAvailabilityLabel"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
65 @click="openFairwayAvailabilityForStretch(stretch)"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
66 >
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
67 <font-awesome-icon icon="chart-line" fixed-width />
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
68 </button>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
69 </div>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
70
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
71 <div
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
72 class="d-flex flex-nowrap justify-content-between align-items-center mt-1"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
73 v-if="sections.length"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
74 v-for="section in sections"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
75 :key="section.get('objnam')"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
76 >
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
77 <div class="mr-2">
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
78 <font-awesome-icon icon="road" class="mr-1" fixed-width />
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
79 {{ section.get("objnam") }}
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
80 </div>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
81 <button
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
82 class="btn btn-xs btn-info"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
83 v-tooltip="fairwayAvailabilityLabel"
3309
80037790032d client: fully implemented sections
Markus Kottlaender <markus@intevation.de>
parents: 3300
diff changeset
84 @click="openFairwayAvailabilityForSection(section)"
3204
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
85 >
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
86 <font-awesome-icon icon="chart-line" fixed-width />
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
87 </button>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
88 </div>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
89 </div>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
90 <div
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
91 v-if="identifiedCoordinates"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
92 class="border-top text-muted p-1 coordinates"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
93 >
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
94 Lat: {{ identifiedCoordinates[1].toFixed(8) }}, Lon:
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
95 {{ identifiedCoordinates[0].toFixed(8) }}
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
96 </div>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
97 </div>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
98 </template>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
99
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
100 <style lang="sass">
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
101 .map-popup
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
102 position: absolute
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
103 background: #fff
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
104 min-width: 200px
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
105 min-height: 85px
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
106 box-shadow: 0 0.1rem 0.5rem rgba(0, 0, 0, 0.2)
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
107 border-top-left-radius: 0 !important
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
108 margin-left: 10px
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
109 &::before
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
110 content: ""
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
111 position: absolute
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
112 top: 0
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
113 left: -10px
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
114 border: 5px solid transparent
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
115 border-top: 5px solid white
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
116 border-right: 5px solid white
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
117 .coordinates
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
118 font-size: 70%
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
119 </style>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
120
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
121 <script>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
122 /* This is Free Software under GNU Affero General Public License v >= 3.0
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
123 * without warranty, see README.md and license for details.
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
124 *
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
125 * SPDX-License-Identifier: AGPL-3.0-or-later
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
126 * License-Filename: LICENSES/AGPL-3.0.txt
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
127 *
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
128 * Copyright (C) 2018 by via donau
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
129 * – Österreichische Wasserstraßen-Gesellschaft mbH
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
130 * Software engineering by Intevation GmbH
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
131 *
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
132 * Author(s):
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
133 * Thomas Junk <thomas.junk@intevation.de>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
134 * Markus Kottländer <markus.kottlaender@intevation.de>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
135 */
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
136 import { mapState } from "vuex";
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
137 import Overlay from "ol/Overlay.js";
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
138 import { getCenter } from "ol/extent";
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
139
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
140 export default {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
141 computed: {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
142 ...mapState("map", [
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
143 "mapPopup",
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
144 "identifiedFeatures",
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
145 "identifiedCoordinates"
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
146 ]),
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
147 title() {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
148 return this.$gettext("Identified Features");
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
149 },
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
150 bottlenecks() {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
151 return this.identifiedFeatures.filter(f =>
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
152 /^bottlenecks/.test(f.getId())
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
153 );
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
154 },
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
155 gauges() {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
156 return this.identifiedFeatures.filter(f => /^gauges/.test(f.getId()));
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
157 },
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
158 stretches() {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
159 return this.identifiedFeatures.filter(f => /^stretches/.test(f.getId()));
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
160 },
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
161 sections() {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
162 return this.identifiedFeatures.filter(f => /^sections/.test(f.getId()));
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
163 },
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
164 surveysLabel() {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
165 return this.$gettext("Surveys");
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
166 },
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
167 fairwayAvailabilityLabel() {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
168 return this.$gettext("Fairway Availability");
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
169 },
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
170 waterlevelsLabel() {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
171 return this.$gettext("Waterlevels");
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
172 }
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
173 },
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
174 methods: {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
175 close() {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
176 this.mapPopup.setPosition(undefined);
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
177 },
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
178 openSurveys(bottleneck) {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
179 this.$store.commit("application/showProfiles", true);
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
180 this.$store.dispatch(
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
181 "bottlenecks/setSelectedBottleneck",
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
182 bottleneck.get("objnam")
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
183 );
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
184 this.$store.dispatch("map/moveMap", {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
185 coordinates: getCenter(
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
186 bottleneck
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
187 .getGeometry()
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
188 .clone()
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
189 .transform("EPSG:3857", "EPSG:4326")
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
190 .getExtent()
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
191 ),
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
192 zoom: 17,
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
193 preventZoomOut: true
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
194 });
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
195 this.close();
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
196 },
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
197 openGauges(gauge) {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
198 this.$store.commit("application/showGauges", true);
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
199 this.$store.dispatch("gauges/selectedGaugeISRS", gauge.get("isrs_code"));
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
200 this.close();
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
201 },
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
202 openFairwayAvailability() {
3231
2dab20bed284 show_statistics: refac to fairwayavailability
Thomas Junk <thomas.junk@intevation.de>
parents: 3207
diff changeset
203 this.$store.commit("application/showFairwayDepth", true);
3204
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
204 this.close();
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
205 },
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
206 openFairwayAvailabilityForBottleneck(bottleneck) {
3207
ba7bc3740fb3 client: renamed store modules to better reflect their context
Markus Kottlaender <markus@intevation.de>
parents: 3206
diff changeset
207 this.$store.commit("fairwayavailability/type", "bottlenecks");
3204
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
208 this.$store.dispatch(
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
209 "bottlenecks/setSelectedBottleneck",
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
210 bottleneck.get("objnam")
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
211 );
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
212 this.$store.dispatch("map/moveMap", {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
213 coordinates: getCenter(
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
214 bottleneck
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
215 .getGeometry()
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
216 .clone()
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
217 .transform("EPSG:3857", "EPSG:4326")
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
218 .getExtent()
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
219 ),
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
220 zoom: 17,
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
221 preventZoomOut: true
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
222 });
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
223 this.openFairwayAvailability();
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
224 },
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
225 openFairwayAvailabilityForStretch(stretch) {
3207
ba7bc3740fb3 client: renamed store modules to better reflect their context
Markus Kottlaender <markus@intevation.de>
parents: 3206
diff changeset
226 this.$store.commit("fairwayavailability/type", "stretches");
3204
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
227 this.$store.commit("imports/selectedStretchId", stretch.getId());
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
228 this.$store.dispatch("map/moveToFeauture", {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
229 feature: stretch,
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
230 zoom: 17
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
231 });
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
232 this.openFairwayAvailability();
3309
80037790032d client: fully implemented sections
Markus Kottlaender <markus@intevation.de>
parents: 3300
diff changeset
233 },
80037790032d client: fully implemented sections
Markus Kottlaender <markus@intevation.de>
parents: 3300
diff changeset
234 openFairwayAvailabilityForSection(section) {
80037790032d client: fully implemented sections
Markus Kottlaender <markus@intevation.de>
parents: 3300
diff changeset
235 this.$store.commit("fairwayavailability/type", "sections");
80037790032d client: fully implemented sections
Markus Kottlaender <markus@intevation.de>
parents: 3300
diff changeset
236 this.$store.commit("imports/selectedSectionId", section.getId());
80037790032d client: fully implemented sections
Markus Kottlaender <markus@intevation.de>
parents: 3300
diff changeset
237 this.$store.dispatch("map/moveToFeauture", {
80037790032d client: fully implemented sections
Markus Kottlaender <markus@intevation.de>
parents: 3300
diff changeset
238 feature: section,
80037790032d client: fully implemented sections
Markus Kottlaender <markus@intevation.de>
parents: 3300
diff changeset
239 zoom: 17
80037790032d client: fully implemented sections
Markus Kottlaender <markus@intevation.de>
parents: 3300
diff changeset
240 });
80037790032d client: fully implemented sections
Markus Kottlaender <markus@intevation.de>
parents: 3300
diff changeset
241 this.openFairwayAvailability();
3204
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
242 }
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
243 },
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
244 mounted() {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
245 const mapPopup = new Overlay({
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
246 element: this.$refs["map-popup"],
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
247 autoPan: true,
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
248 autoPanAnimation: {
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
249 duration: 250
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
250 }
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
251 });
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
252 this.$store.commit("map/mapPopup", mapPopup);
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
253 }
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
254 };
1253fe15e3e3 client: identify: implemented popup when clicking the map and the intention is not clear...
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
255 </script>