changeset 5080:faa1521e597b time-sliding

client: Reload layers with value from time slider * each request starts only when last loading of layers is ended
author Fadi Abbud <fadi.abbud@intevation.de>
date Mon, 16 Mar 2020 18:20:41 +0100
parents 32948cba9824
children 89834f645de3
files client/src/components/TimeSlider.vue
diffstat 1 files changed, 34 insertions(+), 2 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/TimeSlider.vue	Mon Mar 16 12:43:53 2020 +0100
+++ b/client/src/components/TimeSlider.vue	Mon Mar 16 18:20:41 2020 +0100
@@ -105,11 +105,22 @@
         "application/setCurrentVisibleTime",
         this.selectedTime
       );
+    },
+    selectedTime() {
+      this.triggerMapReload();
     }
   },
   computed: {
-    ...mapState("application", ["showTimeSlider", "paneSetup"]),
-    ...mapState("map", ["ongoingRefresh", "ongoingTimeSlide"]),
+    ...mapState("application", [
+      "showTimeSlider",
+      "paneSetup",
+      "currentVisibleTime"
+    ]),
+    ...mapState("map", [
+      "ongoingRefresh",
+      "ongoingTimeSlide",
+      "openLayersMaps"
+    ]),
     reposition() {
       // reposition time slider in case of opened diagram
       if (["DEFAULT", "COMPARESURVEYS"].indexOf(this.paneSetup) === -1) {
@@ -165,6 +176,27 @@
     close() {
       this.$store.commit("application/showTimeSlider", false);
     },
+    triggerMapReload() {
+      // trigger refresh layers only when last loading of layers was ended
+      if (this.sourcesLoading()) {
+        return;
+      }
+      this.$store.commit("map/startTimeSlide");
+      this.$store.dispatch("map/refreshLayers");
+      this.$nextTick(() => {
+        this.$store.commit("map/finishTimeSlide");
+      });
+    },
+    sourcesLoading() {
+      let counter = 0;
+      this.openLayersMaps.forEach(map => {
+        let layers = map.getLayers().getArray();
+        for (let i = 0; i < layers.length; i++) {
+          if (layers[i].getSource().loading) counter++;
+        }
+      });
+      return counter;
+    },
     rescaleSlider(scaleFactor) {
       const tx =
         -scaleFactor *