mobility-toolbox-js 1.7.8-beta.7 → 1.7.9

package/common/Tracker.js

@@ -98,7 +98,6 @@ export default class Tracker {
 
       // We simplify the trajectory object
       const { train_id: id, timeOffset } = trajectory.properties;
-
       // We set the rotation and the timeFraction of the trajectory (used by tralis).
       // if rotation === null that seems there is no rotation available.
       const { coord, rotation: rotationIcon } = getVehiclePosition(

package/common/mixins/TrackerLayerMixin.js

@@ -535,14 +535,14 @@ const TrackerLayerMixin = (Base) =>
         trajectories.sort(this.sort);
       }
       // console.timeEnd('sort');
-      window.trajectories = trajectories;
 
       // console.time('render');
       this.renderState = this.tracker.renderTrajectories(
         trajectories,
         { ...viewState, pixelRatio: this.pixelRatio, time },
         {
-          noInterpolate,
+          noInterpolate:
+            viewState.zoom < this.minZoomInterpolation ? true : noInterpolate,
           hoverVehicleId: this.hoverVehicleId,
           selectedVehicleId: this.selectedVehicleId,
           iconScale: this.iconScale,

package/common/mixins/TralisLayerMixin.js

@@ -21,6 +21,7 @@ export class TralisLayerInterface {
    * @param {string} options.apiKey Access key for [geOps services](https://developer.geops.io/).
    * @param {boolean} [options.debug=false] Display additional debug informations.
    * @param {TralisMode} [options.mode=TralisMode.TOPOGRAPHIC] Tralis's Mode.
+   * @param {number} [options.minZoomInterpolation=8] Minimal zoom when trains positions start to be interpolated.
    * @param {number} [options.minZoomNonTrain=9] Minimal zoom when non trains vehicles are allowed to be displayed.
    */
   constructor(options = {}) {}
@@ -87,6 +88,7 @@ const TralisLayerMixin = (TrackerLayer) =>
       this.api = options.api || new TralisAPI(options);
       this.tenant = options.tenant || ''; // sbb,sbh or sbm
       this.minZoomNonTrain = options.minZoomNonTrain || 9; // Min zoom level from which non trains are allowed to be displayed. Min value is 9 (as configured by the server
+      this.minZoomInterpolation = options.minZoomInterpolation || 8; // Min zoom level from which trains positions are not interpolated.
       this.format = new GeoJSON();
       this.generalizationLevelByZoom = options.generalizationLevelByZoom || {
         0: 5,
@@ -112,6 +114,27 @@ const TralisLayerMixin = (TrackerLayer) =>
       this.onTrajectoryMessage = this.onTrajectoryMessage.bind(this);
       this.onDeleteTrajectoryMessage =
         this.onDeleteTrajectoryMessage.bind(this);
+      this.onDocumentVisibilityChange =
+        this.onDocumentVisibilityChange.bind(this);
+    }
+
+    init(map) {
+      super.init(map);
+
+      // To avoid browser hanging when the tab is not visible for a certain amount of time,
+      // We stop the rendering and the websocket when hide and start again when show.
+      document.addEventListener(
+        'visibilitychange',
+        this.onDocumentVisibilityChange,
+      );
+    }
+
+    terminate() {
+      document.removeEventListener(
+        'visibilitychange',
+        this.onDocumentVisibilityChange,
+      );
+      super.terminate();
     }
 
     start() {
@@ -254,6 +277,16 @@ const TralisLayerMixin = (TrackerLayer) =>
     // getRefreshTimeInMs() {
     //   return 5000;
     // }
+    onDocumentVisibilityChange() {
+      if (!this.visible) {
+        return;
+      }
+      if (document.hidden) {
+        this.stop();
+      } else {
+        this.start();
+      }
+    }
 
     /**
      * Callback on websocket's trajectory channel events.

package/common/utils/getVehiclePosition.js

@@ -5,7 +5,8 @@ import GeomType from 'ol/geom/GeometryType';
  *
  * @param {number} now Current date to interpolate a position with. In ms.
  * @param {TralisTrajectory} trajectory The trajectory to interpolate.
-@returns
+ * @param {boolean} noInterpolate If true, the vehicle position is not interpolated on each render but only once.
+ * @returns
  */
 const getVehiclePosition = (now, trajectory, noInterpolate) => {
   const {