mobility-toolbox-js 3.0.0-beta.6 → 3.0.0-beta.8

package/api/RealtimeAPI.js

@@ -1,3 +1,4 @@
+/* eslint-disable no-underscore-dangle */
 /* eslint-disable class-methods-use-this */
 import WebSocketAPI from './WebSocketAPI';
 import debounceWebsocketMessages from '../common/utils/debounceWebsocketMessages';
@@ -17,14 +18,14 @@ export const RealtimeModes = {
     SCHEMATIC: 'schematic',
 };
 /**
- * This class provides convenience methods to use to the [geOps Realtime API](https://developer.geops.io/apis/realtime/).
+ * This class provides convenience methods to use to the [geOps realtime API](https://developer.geops.io/apis/realtime/).
  *
  * @example
  * import { RealtimeAPI } from 'mobility-toolbox-js/api';
  *
  * const api = new RealtimeAPI({
  *   apiKey: "yourApiKey",
- *   bbox: [782001, 5888803, 923410, 5923660, 11, "mots=rail],
+ *   bbox: [782001, 5888803, 923410, 5923660, 11, "mots=rail"],
  *   // url: "wss://api.geops.io/tracker-ws/v1/",
  * });
  *
@@ -34,106 +35,113 @@ export const RealtimeModes = {
  *    console.log('Log trajectories:', JSON.stringify(data.content));
  * });
  *
- * @classproperty {string} apiKey - Access key for [geOps APIs](https://developer.geops.io/)
- * @classproperty {RealtimeBbox} bbox - The bounding box to receive data from. \ Example: \ [ minX, minY, maxX, maxY, zoom, "tenant=tenant1", "gen_level=5", "mots=mot1,mot2" ]. \ tenant, gen_level and mots are optional.
- * @classproperty {string} url - The [geOps Realtime API](https://developer.geops.io/apis/realtime/) url.
  * @public
  */
 class RealtimeAPI {
+    get url() {
+        return this._url;
+    }
+    set url(newUrl) {
+        if (this._url !== newUrl) {
+            this._url = newUrl;
+            // Update the websocket only if the url has changed and the websocket is already open or is opening.
+            if (this.wsApi.open || this.wsApi.connecting) {
+                this.open();
+            }
+        }
+    }
+    /**
+     * The bounding box to receive data from.\
+     * Example: [minX, minY, maxX, maxY, zoom, mots , gen_level, tenant, ...]\
+     *  \
+     * Where:
+     * - **minX**: a string representation of an integer (not a float) representing the minimal X coordinate (in EPSG:3857) of a bounding box\
+     *  
+     * - **minY**: a string representation of an integer (not a float) representing the minimal Y coordinate (in EPSG:3857) of a bounding box\
+     *  
+     * - **maxX**: a string representation of an integer (not a float) representing the maximal X coordinate (in EPSG:3857) of a bounding box\
+     *  
+     * - **maxY**: a string representation of an integer (not a float) representing the maximal Y coordinate (in EPSG:3857) of a bounding box\
+     *  
+     * - **zoom**: a string representation of an integer representing the zoom level (from 4 to 22). When zoom < 8 only the trains are displayed for performance reasons.\
+     * &nbsp;
+     * - **mots**: A comma separated list of modes of transport. **Optional**.\
+     *         Example: "mots=rail,subway".\
+     * &nbsp;
+     * - **gen_level**: An integer representing the generalization level. **Optional**.\
+     *              Example: "gen_level=5"\
+     * &nbsp;
+     * - **tenant**: A string representing the tenant. **Optional**.\
+     *           Example: "tenant=sbb"\
+     * &nbsp;
+     * - ...: Any other values added to the bbox will be send to the server
+     *
+     * @type {string[]}
+     *
+     * @public
+     */
+    get bbox() {
+        return this._bbox;
+    }
+    set bbox(newBbox) {
+        if (JSON.stringify(newBbox) !== JSON.stringify(this._bbox)) {
+            this._bbox = newBbox;
+            if (this.wsApi && this._bbox) {
+                this.wsApi.send(`BBOX ${this._bbox.join(' ')}`);
+            }
+        }
+    }
+    get buffer() {
+        return this._buffer;
+    }
+    set buffer(newBuffer) {
+        if (JSON.stringify(newBuffer) !== JSON.stringify(this._buffer)) {
+            this._buffer = newBuffer;
+            if (this.wsApi && this._buffer) {
+                this.wsApi.send(`BUFFER ${this._buffer.join(' ')}`);
+            }
+        }
+    }
     /**
      * Constructor
      *
-     * @param {RealtimeAPIOptions} options A string representing the url of the service or an object containing the url and the apiKey.
-     * @param {string} options.url Url to the [geOps realtime api](https://developer.geops.io/apis/realtime/).
+     * @param {Object} options A string representing the url of the service or an object containing the url and the apiKey.
+     * @param {string} options.url Url to the [geOps realtime API](https://developer.geops.io/apis/realtime/).
      * @param {string} options.apiKey Access key for [geOps apis](https://developer.geops.io/).
-     * @param {number[5]} [options.bbox=[minX, minY, maxX, maxY, zoom, tenant]] The bounding box to receive data from.
+     * @param {string[]} options.bbox The bounding box to receive data from.
+     * @public
      */
     constructor(options = {}) {
         this.version = '2';
-        this.defineProperties(options);
-        this.onOpen = this.onOpen.bind(this);
-    }
-    defineProperties(options = {}) {
-        let opt = options || {};
+        let opt = options;
         if (typeof options === 'string') {
             opt = { url: options };
         }
-        const { apiKey, version } = opt;
-        let { url, bbox, buffer = [100, 100] } = opt;
+        const { apiKey } = opt;
+        const { url } = opt;
         const wsApi = new WebSocketAPI();
-        if (!url) {
-            url = 'wss://api.geops.io/tracker-ws/v1/';
-        }
-        if (apiKey) {
-            url = `${url}?key=${apiKey}`;
+        let suffix = '';
+        if (apiKey && !(url === null || url === void 0 ? void 0 : url.includes('key='))) {
+            suffix = `?key=${apiKey}`;
         }
-        Object.defineProperties(this, {
-            url: {
-                get: () => url,
-                set: (newUrl) => {
-                    if (url !== newUrl) {
-                        url = newUrl;
-                        // Update the websocket only if the url has changed and the websocket is already open or is opening.
-                        if (this.wsApi.open || this.wsApi.connecting) {
-                            this.open();
-                        }
-                    }
-                },
-            },
-            bbox: {
-                get: () => bbox,
-                set: (newBbox) => {
-                    if (JSON.stringify(newBbox) !== JSON.stringify(bbox)) {
-                        bbox = newBbox;
-                        if (this.wsApi && bbox) {
-                            this.wsApi.send(`BBOX ${bbox.join(' ')}`);
-                        }
-                    }
-                },
-            },
-            buffer: {
-                get: () => buffer,
-                set: (newBuffer) => {
-                    if (JSON.stringify(newBuffer) !== JSON.stringify(buffer)) {
-                        buffer = newBuffer;
-                        if (this.wsApi) {
-                            this.wsApi.send(`BUFFER ${buffer.join(' ')}`);
-                        }
-                    }
-                },
-            },
-            version: {
-                value: version,
-                writable: true,
-            },
-            /**
-             * The websocket helper class to connect the websocket.
-             *
-             * @private
-             */
-            wsApi: {
-                value: wsApi,
-                writable: true,
-            },
-            /**
-             * Interval between PING request in ms.
-             * If equal to 0,  no PING request are sent.
-             * @type {number}
-             * @private
-             */
-            pingIntervalMs: {
-                value: options.pingIntervalMs || 10000,
-                writable: true,
-            },
-            /**
-             * Timeout in ms after an automatic reconnection when the websoscket has been closed by the server.
-             * @type {number}
-             */
-            reconnectTimeoutMs: {
-                value: options.pingIntervalMs || 100,
-                writable: true,
-            },
-        });
+        this._url = (url || 'wss://api.geops.io/tracker-ws/v1/') + suffix;
+        this._buffer = opt.buffer || [100, 100];
+        this.version = opt.version || '2';
+        /**
+         * Interval between PING request in ms.
+         * If equal to 0,  no PING request are sent.
+         * @type {number}
+         */
+        this.pingIntervalMs = opt.pingIntervalMs || 10000;
+        /**
+         * Timeout in ms after an automatic reconnection when the websoscket has been closed by the server.
+         * @type {number}
+         */
+        this.reconnectTimeoutMs = opt.reconnectTimeoutMs || 100;
+        /**
+         * The websocket helper class to connect the websocket.
+         */
+        this.wsApi = wsApi;
     }
     /**
      * Open the websocket connection.
@@ -141,7 +149,7 @@ class RealtimeAPI {
      * @public
      */
     open() {
-        this.wsApi.connect(this.url, this.onOpen);
+        this.wsApi.connect(this.url, this.onOpen.bind(this));
         // Register reconnection on close.
         if (this.wsApi.websocket) {
             this.wsApi.websocket.onclose = () => {
@@ -160,7 +168,6 @@ class RealtimeAPI {
     /**
      * Unsubscribe trajectory and deleted_vehicles channels. To resubscribe you have to set a new BBOX.
      */
-    // eslint-disable-next-line class-methods-use-this
     reset() {
         this.wsApi.send('RESET');
     }

package/common/utils/getLayersAsFlatArray.js

@@ -7,8 +7,12 @@ const getLayersAsFlatArray = (layersOrLayer) => {
     }
     let flatLayers = [];
     layers.forEach((layer) => {
+        var _a, _b;
         flatLayers.push(layer);
-        const children = layer.children || layer.get('children') || {};
+        // Handle children property and ol.layer.Group
+        const children = layer.children ||
+            layer.get('children') ||
+            ((_b = (_a = layer.getLayers) === null || _a === void 0 ? void 0 : _a.call(layer)) === null || _b === void 0 ? void 0 : _b.getArray());
         flatLayers = flatLayers.concat(getLayersAsFlatArray(children || []));
     });
     return flatLayers;

package/maplibre/layers/RealtimeLayer.js

@@ -8,7 +8,7 @@ import Layer from './Layer';
 import { getSourceCoordinates } from '../utils';
 import toMercatorExtent from '../../common/utils/toMercatorExtent';
 /**
- * Responsible for loading and display data from a geOps Realtime API.
+ * Responsible for loading and display data from a geOps realtime API.
  *
  * @example
  * import { RealtimeLayer } from 'mobility-toolbox-js/Maplibre';
@@ -31,7 +31,7 @@ class RealtimeLayer extends RealtimeLayerMixin(Layer) {
      *
      * @param {RealtimeLayerOptions} options
      * @param {string} options.apiKey Access key for [geOps apis](https://developer.geops.io/).
-     * @param {string} [options.url="wss://api.geops.io/tracker-ws/v1/"] The geOps Realtime API url.
+     * @param {string} [options.url="wss://api.geops.io/tracker-ws/v1/"] The geOps realtime API url.
      *
      */
     constructor(options = {}) {

package/mbt.js

@@ -19610,96 +19610,94 @@ uniform ${i3} ${s3} u_${a3};
     /**
      * Constructor
      *
-     * @param {RealtimeAPIOptions} options A string representing the url of the service or an object containing the url and the apiKey.
-     * @param {string} options.url Url to the [geOps realtime api](https://developer.geops.io/apis/realtime/).
+     * @param {Object} options A string representing the url of the service or an object containing the url and the apiKey.
+     * @param {string} options.url Url to the [geOps realtime API](https://developer.geops.io/apis/realtime/).
      * @param {string} options.apiKey Access key for [geOps apis](https://developer.geops.io/).
-     * @param {number[5]} [options.bbox=[minX, minY, maxX, maxY, zoom, tenant]] The bounding box to receive data from.
+     * @param {string[]} options.bbox The bounding box to receive data from.
+     * @public
      */
     constructor(options = {}) {
       this.version = "2";
-      this.defineProperties(options);
-      this.onOpen = this.onOpen.bind(this);
-    }
-    defineProperties(options = {}) {
-      let opt = options || {};
+      let opt = options;
       if (typeof options === "string") {
         opt = { url: options };
       }
-      const { apiKey, version } = opt;
-      let { url, bbox, buffer: buffer2 = [100, 100] } = opt;
+      const { apiKey } = opt;
+      const { url } = opt;
       const wsApi = new WebSocketAPI_default();
-      if (!url) {
-        url = "wss://api.geops.io/tracker-ws/v1/";
+      let suffix = "";
+      if (apiKey && !url?.includes("key=")) {
+        suffix = `?key=${apiKey}`;
       }
-      if (apiKey) {
-        url = `${url}?key=${apiKey}`;
+      this._url = (url || "wss://api.geops.io/tracker-ws/v1/") + suffix;
+      this._buffer = opt.buffer || [100, 100];
+      this.version = opt.version || "2";
+      this.pingIntervalMs = opt.pingIntervalMs || 1e4;
+      this.reconnectTimeoutMs = opt.reconnectTimeoutMs || 100;
+      this.wsApi = wsApi;
+    }
+    get url() {
+      return this._url;
+    }
+    set url(newUrl) {
+      if (this._url !== newUrl) {
+        this._url = newUrl;
+        if (this.wsApi.open || this.wsApi.connecting) {
+          this.open();
+        }
+      }
+    }
+    /**
+     * The bounding box to receive data from.\
+     * Example: [minX, minY, maxX, maxY, zoom, mots , gen_level, tenant, ...]\
+     *  \
+     * Where:
+     * - **minX**: a string representation of an integer (not a float) representing the minimal X coordinate (in EPSG:3857) of a bounding box\
+     *  
+     * - **minY**: a string representation of an integer (not a float) representing the minimal Y coordinate (in EPSG:3857) of a bounding box\
+     *  
+     * - **maxX**: a string representation of an integer (not a float) representing the maximal X coordinate (in EPSG:3857) of a bounding box\
+     *  
+     * - **maxY**: a string representation of an integer (not a float) representing the maximal Y coordinate (in EPSG:3857) of a bounding box\
+     *  
+     * - **zoom**: a string representation of an integer representing the zoom level (from 4 to 22). When zoom < 8 only the trains are displayed for performance reasons.\
+     * &nbsp;
+     * - **mots**: A comma separated list of modes of transport. **Optional**.\
+     *         Example: "mots=rail,subway".\
+     * &nbsp;
+     * - **gen_level**: An integer representing the generalization level. **Optional**.\
+     *              Example: "gen_level=5"\
+     * &nbsp;
+     * - **tenant**: A string representing the tenant. **Optional**.\
+     *           Example: "tenant=sbb"\
+     * &nbsp;
+     * - ...: Any other values added to the bbox will be send to the server
+     *
+     * @type {string[]}
+     *
+     * @public
+     */
+    get bbox() {
+      return this._bbox;
+    }
+    set bbox(newBbox) {
+      if (JSON.stringify(newBbox) !== JSON.stringify(this._bbox)) {
+        this._bbox = newBbox;
+        if (this.wsApi && this._bbox) {
+          this.wsApi.send(`BBOX ${this._bbox.join(" ")}`);
+        }
       }
-      Object.defineProperties(this, {
-        url: {
-          get: () => url,
-          set: (newUrl) => {
-            if (url !== newUrl) {
-              url = newUrl;
-              if (this.wsApi.open || this.wsApi.connecting) {
-                this.open();
-              }
-            }
-          }
-        },
-        bbox: {
-          get: () => bbox,
-          set: (newBbox) => {
-            if (JSON.stringify(newBbox) !== JSON.stringify(bbox)) {
-              bbox = newBbox;
-              if (this.wsApi && bbox) {
-                this.wsApi.send(`BBOX ${bbox.join(" ")}`);
-              }
-            }
-          }
-        },
-        buffer: {
-          get: () => buffer2,
-          set: (newBuffer) => {
-            if (JSON.stringify(newBuffer) !== JSON.stringify(buffer2)) {
-              buffer2 = newBuffer;
-              if (this.wsApi) {
-                this.wsApi.send(`BUFFER ${buffer2.join(" ")}`);
-              }
-            }
-          }
-        },
-        version: {
-          value: version,
-          writable: true
-        },
-        /**
-         * The websocket helper class to connect the websocket.
-         *
-         * @private
-         */
-        wsApi: {
-          value: wsApi,
-          writable: true
-        },
-        /**
-         * Interval between PING request in ms.
-         * If equal to 0,  no PING request are sent.
-         * @type {number}
-         * @private
-         */
-        pingIntervalMs: {
-          value: options.pingIntervalMs || 1e4,
-          writable: true
-        },
-        /**
-         * Timeout in ms after an automatic reconnection when the websoscket has been closed by the server.
-         * @type {number}
-         */
-        reconnectTimeoutMs: {
-          value: options.pingIntervalMs || 100,
-          writable: true
+    }
+    get buffer() {
+      return this._buffer;
+    }
+    set buffer(newBuffer) {
+      if (JSON.stringify(newBuffer) !== JSON.stringify(this._buffer)) {
+        this._buffer = newBuffer;
+        if (this.wsApi && this._buffer) {
+          this.wsApi.send(`BUFFER ${this._buffer.join(" ")}`);
         }
-      });
+      }
     }
     /**
      * Open the websocket connection.
@@ -19707,7 +19705,7 @@ uniform ${i3} ${s3} u_${a3};
      * @public
      */
     open() {
-      this.wsApi.connect(this.url, this.onOpen);
+      this.wsApi.connect(this.url, this.onOpen.bind(this));
       if (this.wsApi.websocket) {
         this.wsApi.websocket.onclose = () => {
           this.onClose();
@@ -19725,7 +19723,6 @@ uniform ${i3} ${s3} u_${a3};
     /**
      * Unsubscribe trajectory and deleted_vehicles channels. To resubscribe you have to set a new BBOX.
      */
-    // eslint-disable-next-line class-methods-use-this
     reset() {
       this.wsApi.send("RESET");
     }
@@ -20225,7 +20222,7 @@ uniform ${i3} ${s3} u_${a3};
     let flatLayers = [];
     layers.forEach((layer) => {
       flatLayers.push(layer);
-      const children = layer.children || layer.get("children") || {};
+      const children = layer.children || layer.get("children") || layer.getLayers?.()?.getArray();
       flatLayers = flatLayers.concat(getLayersAsFlatArray(children || []));
     });
     return flatLayers;
@@ -29162,6 +29159,9 @@ uniform ${i3} ${s3} u_${a3};
         element,
         ...options
       });
+      this.format = options.format || ((copyrights) => {
+        return copyrights?.join(" | ");
+      });
     }
     render({ frameState }) {
       if (!frameState) {
@@ -29171,14 +29171,23 @@ uniform ${i3} ${s3} u_${a3};
       let copyrights = [];
       frameState?.layerStatesArray.forEach((layerState) => {
         const { layer } = layerState;
-        if (frameState && inView(layerState, frameState.viewState) && layer && layer.getSource && layer.getSource() && layer.getSource().getAttributions()) {
-          copyrights = copyrights.concat(
-            layer.getSource().getAttributions()(frameState)
-          );
+        if (frameState && inView(layerState, frameState.viewState)) {
+          if (layer?.getSource()?.getAttributions()) {
+            copyrights = copyrights.concat(
+              layer.getSource().getAttributions()(frameState)
+            );
+          }
+          if (layer?.get("copyrights")) {
+            let copyProp = layer.get("copyrights");
+            copyProp = !Array.isArray(copyProp) ? [copyProp] : copyProp;
+            if (copyProp?.length) {
+              copyrights.push(...copyProp);
+            }
+          }
         }
       });
       const unique = removeDuplicate_default(copyrights) || [];
-      this.element.innerHTML = unique.join(" | ");
+      this.element.innerHTML = this.format(unique);
     }
   };
   var CopyrightControl_default = CopyrightControl;
@@ -44741,6 +44750,9 @@ uniform ${i3} ${s3} u_${a3};
       this.segments = [];
       this.format = new GeoJSON_default({ featureProjection: "EPSG:3857" });
       this.initialRouteDrag = {};
+      if (!this.element) {
+        this.createDefaultElement();
+      }
       this.loading = false;
       this.active = options.active || true;
       this.graphs = options.graphs || [["osm", 0, 99]];
@@ -45421,6 +45433,9 @@ uniform ${i3} ${s3} u_${a3};
       const coord = fromLonLat(suggestion.geometry.coordinates);
       this.getMap()?.getView().setCenter(coord);
     }
+    search(q, abortController) {
+      return this.controller.search(q, abortController);
+    }
   };
   var StopFinderControl_default = StopFinderControl;
 
@@ -45449,20 +45464,6 @@ uniform ${i3} ${s3} u_${a3};
             if (evt.key === "children") {
               this.onChildrenChange(evt.oldValue);
             }
-          }),
-          // Manage group visiblity
-          this.on("change:visible", () => {
-            this.onVisibleChange();
-          }),
-          // Listen for group visiblity change
-          // if a layer from a group is newly visible we hide the others.
-          // @ts-ignore
-          this.on(`change:visible:group`, (evt) => {
-            if (this.group === evt.target.group && this !== evt.target && this.visible) {
-              this.visible = false;
-            } else if (this.children) {
-              this.children.forEach((child) => child.dispatchEvent(evt));
-            }
           })
         );
         this.options = options;
@@ -45548,38 +45549,6 @@ uniform ${i3} ${s3} u_${a3};
           child.set("parent", this);
         });
       }
-      /** @private */
-      onVisibleChange() {
-        const parent = this.get("parent");
-        const children = this.get("children") || [];
-        if (this.getVisible()) {
-          const group = this.get("group");
-          if (parent) {
-            parent.setVisible(true);
-          }
-          if (children && !children.some((child) => child.getVisible())) {
-            children.forEach((child) => {
-              child.setVisible(true);
-            });
-          }
-          if (parent && group) {
-            let higherParent = parent;
-            while (higherParent.get("parent")) {
-              higherParent = higherParent.get("parent");
-            }
-            const evt = new Event_default(`change:visible:group`);
-            evt.target = this;
-            higherParent.dispatchEvent(evt);
-          }
-        } else {
-          children.forEach((child) => {
-            child.setVisible(false);
-          });
-          if (parent?.getVisible() && !parent?.get("children").find((child) => child.getVisible())) {
-            parent.setVisible(false);
-          }
-        }
-      }
       /**
        * Initialize the layer with the map passed in parameters.
        *
@@ -47373,7 +47342,7 @@ uniform ${i3} ${s3} u_${a3};
      * @param {RealtimeLayerOptions} options
      * @param {boolean} [options.allowRenderWhenAnimating=false] Allow rendering of the layer when the map is animating.
      * @param {string} options.apiKey Access key for [geOps apis](https://developer.geops.io/).
-     * @param {string} [options.url="wss://api.geops.io/tracker-ws/v1/"] The geOps Realtime API url.
+     * @param {string} [options.url="wss://api.geops.io/tracker-ws/v1/"] The geOps realtime API url.
      *
      */
     constructor(options) {
@@ -47685,7 +47654,7 @@ uniform ${i3} ${s3} u_${a3};
       }
       const source = layer?.getSource();
       if (source?.getFeatureInfoUrl) {
-        const id = getUid(void 0);
+        const id = getUid(layer);
         abortControllers[id]?.abort();
         abortControllers[id] = new AbortController();
         const resolution = map?.getView()?.getResolution();
@@ -48446,7 +48415,7 @@ uniform ${i3} ${s3} u_${a3};
      *
      * @param {RealtimeLayerOptions} options
      * @param {string} options.apiKey Access key for [geOps apis](https://developer.geops.io/).
-     * @param {string} [options.url="wss://api.geops.io/tracker-ws/v1/"] The geOps Realtime API url.
+     * @param {string} [options.url="wss://api.geops.io/tracker-ws/v1/"] The geOps realtime API url.
      *
      */
     constructor(options = {}) {