diff --git a/lib/www/client/source/src/views/Map.vue b/lib/www/client/source/src/views/Map.vue
index 7f7e4d2..de0f2c5 100644
--- a/lib/www/client/source/src/views/Map.vue
+++ b/lib/www/client/source/src/views/Map.vue
@@ -39,30 +39,30 @@
- mdi-vector-line
+ mdi-vector-line
-
+
Last hour
-
+
Last 6 hours
-
+
Last 12 hours
-
+
Last 24 hours
-
+
Last week
@@ -663,66 +663,64 @@ export default {
},
vesselPosition: null,
- vesselTrackConfig: {
- lastRefresh: 0,
- refreshInterval: 12, // seconds
- intervalID: null,
- period: "hour",
- periodSettings: {
- hour: {
- title: "1 hour",
- offset: 3600 * 1000,
- decimation: 1,
- refreshInterval: 18,
- },
- hour6: {
- title: "6 hours",
- offset: 6 * 3600 * 1000,
- decimation: 1,
- refreshInterval: 18,
- },
- hour12: {
- title: "12 hours",
- offset: 12 * 3600 * 1000,
- decimation: 1,
- refreshInterval: 18,
- },
- day: {
- title: "24 hours",
- offset: 24 * 3600 * 1000,
- decimation: 12,
- refreshInterval: 18,
- },
- week: {
- title: "7 days",
- offset: 7 * 24 * 3600 * 1000,
- decimation: 60,
- refreshInterval: 60,
- },
- week2: {
- title: "14 days",
- offset: 14 * 24 * 3600 * 1000,
- decimation: 60,
- refreshInterval: 90,
- },
- month: {
- title: "30 days",
- offset: 30 * 24 * 3600 * 1000,
- decimation: 90,
- refreshInterval: 120,
- },
- quarter: {
- title: "90 days",
- offset: 90 * 24 * 3600 * 1000,
- decimation: 180,
- refreshInterval: 300,
- },
- year: {
- title: "1 year",
- offset: 365 * 24 * 3600 * 1000,
- decimation: 1200,
- refreshInterval: 1800,
- },
+ vesselTrackLastRefresh: 0,
+ vesselTrackRefreshInterval: 12, // seconds
+ vesselTrackIntervalID: null,
+ vesselTrackPeriod: "hour",
+ vesselTrackPeriodSettings: {
+ hour: {
+ title: "1 hour",
+ offset: 3600 * 1000,
+ decimation: 1,
+ refreshInterval: 18,
+ },
+ hour6: {
+ title: "6 hours",
+ offset: 6 * 3600 * 1000,
+ decimation: 1,
+ refreshInterval: 18,
+ },
+ hour12: {
+ title: "12 hours",
+ offset: 12 * 3600 * 1000,
+ decimation: 1,
+ refreshInterval: 18,
+ },
+ day: {
+ title: "24 hours",
+ offset: 24 * 3600 * 1000,
+ decimation: 12,
+ refreshInterval: 18,
+ },
+ week: {
+ title: "7 days",
+ offset: 7 * 24 * 3600 * 1000,
+ decimation: 60,
+ refreshInterval: 60,
+ },
+ week2: {
+ title: "14 days",
+ offset: 14 * 24 * 3600 * 1000,
+ decimation: 60,
+ refreshInterval: 90,
+ },
+ month: {
+ title: "30 days",
+ offset: 30 * 24 * 3600 * 1000,
+ decimation: 90,
+ refreshInterval: 120,
+ },
+ quarter: {
+ title: "90 days",
+ offset: 90 * 24 * 3600 * 1000,
+ decimation: 180,
+ refreshInterval: 300,
+ },
+ year: {
+ title: "1 year",
+ offset: 365 * 24 * 3600 * 1000,
+ decimation: 1200,
+ refreshInterval: 1800,
},
},
heatmapValue: "total_error",
@@ -866,22 +864,12 @@ export default {
deep: true
},
- vesselTrackConfig: {
- handler (cur, prev) {
- if (cur.period != prev.period) {
- console.log("period changed");
- this.vesselTrackConfig = {
- ...this.vesselTrackConfig,
- lastRefresh: this.currentSecond()
- }
- this.updateVesselIntervalTimer();
- }
- if (cur.lastRefresh != prev.lastRefresh) {
- console.log("refresh changed");
- this.render();
- }
- },
- deep: true
+ vesselTrackPeriod () {
+ this.updateVesselIntervalTimer();
+ },
+
+ vesselTrackLastRefresh () {
+ this.render();
},
lines () {
@@ -1537,18 +1525,15 @@ export default {
},
updateVesselIntervalTimer (refreshInterval) {
- this.vesselTrackConfig.refreshInterval = refreshInterval ??
- this.vesselTrackConfig.periodSettings[this.vesselTrackConfig.period]?.refreshInterval ?? 0;
+ this.vesselTrackRefreshInterval = refreshInterval ??
+ this.vesselTrackPeriodSettings[this.vesselTrackPeriod]?.refreshInterval ?? 0;
- this.vesselTrackConfig.intervalID = clearInterval(this.vesselTrackConfig.intervalID);
- if (this.vesselTrackConfig.refreshInterval) {
- this.vesselTrackConfig.lastRefresh = this.currentSecond();
- this.vesselTrackConfig.intervalID = setInterval( () => {
- this.vesselTrackConfig = {
- ...this.vesselTrackConfig,
- lastRefresh: this.currentSecond()
- }
- }, this.vesselTrackConfig.refreshInterval * 1000);
+ this.vesselTrackIntervalID = clearInterval(this.vesselTrackIntervalID);
+ if (this.vesselTrackRefreshInterval) {
+ this.vesselTrackLastRefresh = this.currentSecond();
+ this.vesselTrackIntervalID = setInterval( () => {
+ this.vesselTrackLastRefresh = this.currentSecond();
+ }, this.vesselTrackRefreshInterval * 1000);
}
},
@@ -1747,7 +1732,7 @@ export default {
beforeDestroy () {
this.unregisterNotificationHandlers();
- this.vesselTrackConfig.intervalID = this.clearInterval(this.vesselTrackConfig.intervalID);
+ this.vesselTrackIntervalID = this.clearInterval(this.vesselTrackIntervalID);
}
}
diff --git a/lib/www/client/source/src/views/MapLayersMixin.vue b/lib/www/client/source/src/views/MapLayersMixin.vue
index 82ca2d8..e54fe3f 100644
--- a/lib/www/client/source/src/views/MapLayersMixin.vue
+++ b/lib/www/client/source/src/views/MapLayersMixin.vue
@@ -276,9 +276,9 @@ export default {
vesselTrackLinesLayer (options = {}) {
- const cfg = this.vesselTrackConfig.periodSettings[this.vesselTrackConfig.period];
+ const cfg = this.vesselTrackPeriodSettings[this.vesselTrackPeriod];
- let ts1 = new Date(this.vesselTrackConfig.lastRefresh*1000);
+ let ts1 = new Date(this.vesselTrackLastRefresh*1000);
let ts0 = new Date(ts1.valueOf() - cfg.offset);
let di = cfg.decimation;
let l = 10000;