Mercurial > gemma
annotate client/src/components/Zoom.vue @ 2282:2e40909a975d
clean searchbar when context is changed
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Fri, 15 Feb 2019 11:55:56 +0100 |
parents | ecb0ad836aa0 |
children | 236da7c20eac |
rev | line source |
---|---|
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
1 <template> |
1360
3fee649d3d5d
add headers for licensing to some client files
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
2 <div |
3fee649d3d5d
add headers for licensing to some client files
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
3 class="d-flex buttoncontainer shadow-xs mb-3 position-absolute" |
3fee649d3d5d
add headers for licensing to some client files
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
4 :style="showSplitscreen ? 'margin-bottom: 51vh !important' : ''" |
3fee649d3d5d
add headers for licensing to some client files
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
5 > |
1480 | 6 <button |
7 class="zoomButton border-0 bg-white rounded-left ui-element" | |
8 @click="zoomOut" | |
9 > | |
1360
3fee649d3d5d
add headers for licensing to some client files
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
10 <font-awesome-icon icon="minus"></font-awesome-icon> |
3fee649d3d5d
add headers for licensing to some client files
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
11 </button> |
3fee649d3d5d
add headers for licensing to some client files
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
12 <button |
2184
826fc7309370
client: Added refresh button to reload the WFS layer data.
Raimund Renkert <raimund.renkert@intevation.de>
parents:
1558
diff
changeset
|
13 class="zoomButton border-0 bg-white ui-element border-right" |
826fc7309370
client: Added refresh button to reload the WFS layer data.
Raimund Renkert <raimund.renkert@intevation.de>
parents:
1558
diff
changeset
|
14 @click="refreshMap" |
826fc7309370
client: Added refresh button to reload the WFS layer data.
Raimund Renkert <raimund.renkert@intevation.de>
parents:
1558
diff
changeset
|
15 > |
826fc7309370
client: Added refresh button to reload the WFS layer data.
Raimund Renkert <raimund.renkert@intevation.de>
parents:
1558
diff
changeset
|
16 <font-awesome-icon icon="redo"></font-awesome-icon> |
826fc7309370
client: Added refresh button to reload the WFS layer data.
Raimund Renkert <raimund.renkert@intevation.de>
parents:
1558
diff
changeset
|
17 </button> |
826fc7309370
client: Added refresh button to reload the WFS layer data.
Raimund Renkert <raimund.renkert@intevation.de>
parents:
1558
diff
changeset
|
18 <button |
1360
3fee649d3d5d
add headers for licensing to some client files
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
19 class="zoomButton border-0 bg-white rounded-right ui-element border-right" |
3fee649d3d5d
add headers for licensing to some client files
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
20 @click="zoomIn" |
1279
60e15c2d26a2
licensing info updated
Thomas Junk <thomas.junk@intevation.de>
parents:
1272
diff
changeset
|
21 > |
1360
3fee649d3d5d
add headers for licensing to some client files
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
22 <font-awesome-icon icon="plus"></font-awesome-icon> |
3fee649d3d5d
add headers for licensing to some client files
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
23 </button> |
3fee649d3d5d
add headers for licensing to some client files
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
24 </div> |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
25 </template> |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
26 |
1449 | 27 <style lang="scss" scoped> |
28 .buttoncontainer { | |
29 bottom: 0; | |
30 left: 50%; | |
31 margin-left: -$icon-width; | |
32 } | |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
33 |
1449 | 34 .zoomButton { |
35 min-height: $icon-width; | |
36 min-width: $icon-width; | |
37 z-index: 1; | |
38 outline: none; | |
39 color: #666; | |
40 } | |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
41 </style> |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
42 <script> |
1279
60e15c2d26a2
licensing info updated
Thomas Junk <thomas.junk@intevation.de>
parents:
1272
diff
changeset
|
43 /* This is Free Software under GNU Affero General Public License v >= 3.0 |
60e15c2d26a2
licensing info updated
Thomas Junk <thomas.junk@intevation.de>
parents:
1272
diff
changeset
|
44 * without warranty, see README.md and license for details. |
60e15c2d26a2
licensing info updated
Thomas Junk <thomas.junk@intevation.de>
parents:
1272
diff
changeset
|
45 * |
60e15c2d26a2
licensing info updated
Thomas Junk <thomas.junk@intevation.de>
parents:
1272
diff
changeset
|
46 * SPDX-License-Identifier: AGPL-3.0-or-later |
60e15c2d26a2
licensing info updated
Thomas Junk <thomas.junk@intevation.de>
parents:
1272
diff
changeset
|
47 * License-Filename: LICENSES/AGPL-3.0.txt |
60e15c2d26a2
licensing info updated
Thomas Junk <thomas.junk@intevation.de>
parents:
1272
diff
changeset
|
48 * |
1360
3fee649d3d5d
add headers for licensing to some client files
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
49 * Copyright (C) 2018 by via donau |
1279
60e15c2d26a2
licensing info updated
Thomas Junk <thomas.junk@intevation.de>
parents:
1272
diff
changeset
|
50 * – Österreichische Wasserstraßen-Gesellschaft mbH |
60e15c2d26a2
licensing info updated
Thomas Junk <thomas.junk@intevation.de>
parents:
1272
diff
changeset
|
51 * Software engineering by Intevation GmbH |
60e15c2d26a2
licensing info updated
Thomas Junk <thomas.junk@intevation.de>
parents:
1272
diff
changeset
|
52 * |
60e15c2d26a2
licensing info updated
Thomas Junk <thomas.junk@intevation.de>
parents:
1272
diff
changeset
|
53 * Author(s): |
1360
3fee649d3d5d
add headers for licensing to some client files
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
54 * Markus Kottländer <markus@intevation.de> |
1279
60e15c2d26a2
licensing info updated
Thomas Junk <thomas.junk@intevation.de>
parents:
1272
diff
changeset
|
55 * Thomas Junk <thomas.junk@intevation.de> |
60e15c2d26a2
licensing info updated
Thomas Junk <thomas.junk@intevation.de>
parents:
1272
diff
changeset
|
56 */ |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
57 import { mapState } from "vuex"; |
2190 | 58 import { Vector as VectorLayer } from "ol/layer.js"; |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
59 |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
60 export default { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
61 name: "zoom", |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
62 computed: { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
63 ...mapState("map", ["openLayersMap"]), |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
64 ...mapState("application", ["showSplitscreen"]), |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
65 zoomLevel: { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
66 get() { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
67 return this.openLayersMap.getView().getZoom(); |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
68 }, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
69 set(value) { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
70 this.openLayersMap.getView().animate({ zoom: value, duration: 300 }); |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
71 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
72 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
73 }, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
74 methods: { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
75 zoomIn() { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
76 this.zoomLevel = this.zoomLevel + 1; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
77 }, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
78 zoomOut() { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
79 this.zoomLevel = this.zoomLevel - 1; |
2184
826fc7309370
client: Added refresh button to reload the WFS layer data.
Raimund Renkert <raimund.renkert@intevation.de>
parents:
1558
diff
changeset
|
80 }, |
826fc7309370
client: Added refresh button to reload the WFS layer data.
Raimund Renkert <raimund.renkert@intevation.de>
parents:
1558
diff
changeset
|
81 refreshMap() { |
826fc7309370
client: Added refresh button to reload the WFS layer data.
Raimund Renkert <raimund.renkert@intevation.de>
parents:
1558
diff
changeset
|
82 let layers = this.openLayersMap.getLayers().getArray(); |
826fc7309370
client: Added refresh button to reload the WFS layer data.
Raimund Renkert <raimund.renkert@intevation.de>
parents:
1558
diff
changeset
|
83 for (let i = 0; i < layers.length; i++) { |
826fc7309370
client: Added refresh button to reload the WFS layer data.
Raimund Renkert <raimund.renkert@intevation.de>
parents:
1558
diff
changeset
|
84 let layer = layers[i]; |
826fc7309370
client: Added refresh button to reload the WFS layer data.
Raimund Renkert <raimund.renkert@intevation.de>
parents:
1558
diff
changeset
|
85 if (layer instanceof VectorLayer) { |
2185 | 86 console.log(layer.get("source").loader_); |
87 layer.getSource().clear(true); | |
88 layer.getSource().refresh({ force: true }); | |
2184
826fc7309370
client: Added refresh button to reload the WFS layer data.
Raimund Renkert <raimund.renkert@intevation.de>
parents:
1558
diff
changeset
|
89 } |
826fc7309370
client: Added refresh button to reload the WFS layer data.
Raimund Renkert <raimund.renkert@intevation.de>
parents:
1558
diff
changeset
|
90 } |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
91 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
92 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
93 }; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
94 </script> |