mobility-toolbox-js 1.7.1 → 1.7.4

package/ol/controls/RoutingControl.js

@@ -10,6 +10,27 @@ import RoutingAPI from '../../api/routing/RoutingAPI';
 import Control from '../../common/controls/Control';
 import RoutingLayer from '../layers/RoutingLayer';
 
+// Examples for a single hop:
+// basel sbb a station named "basel sbb"
+// ZUE, station "Zürich HB" by its common abbreviation
+// Zürich Hauptbahnhof or HBF Zürich are all valid synonyms für "Zürich HB"
+// @47.37811,8.53935 a station at position 47.37811, 8.53935
+// @47.37811,8.53935$4 track 4 in a station at position 47.37811, 8.53935
+// zürich hb@47.37811,8.53935$8 track 8 in station "Zürich HB" at position 47.37811, 8.53935
+const REGEX_VIA_POINT =
+  /^([^@$!\n]*)(@?([\d.]+),([\d.]+))?(\$?([a-zA-Z0-9]{0,2}))$/;
+
+// Examples for a single hop:
+//
+// 47.37811,8.53935 a position 47.37811, 8.53935
+const REGEX_VIA_POINT_COORD = /^([\d.]+),([\d.]+)$/;
+
+// Examples for a single hop:
+//
+// !8596126 a station with id 8596126
+// !8596126$4 a station with id 8596126
+const REGEX_VIA_POINT_STATION_ID = /^!([^$]*)(\$?([a-zA-Z0-9]{0,2}))$/;
+
 const getFlatCoordinatesFromSegments = (segmentArray) => {
   const coords = [];
   segmentArray.forEach((seg) => {
@@ -37,6 +58,8 @@ const getFlatCoordinatesFromSegments = (segmentArray) => {
  * @classproperty {Array.<Array<graph="osm", minZoom=0, maxZoom=99>>} graphs - Array of routing graphs and min/max zoom levels. If you use the control in combination with the [geOps Maps API](https://developer.geops.io/apis/maps/), you may want to use the optimal level of generalizations: "[['gen4', 0, 8], ['gen3', 8, 9], ['gen2', 9, 11], ['gen1', 11, 13], ['osm', 13, 99]]"
  * @classproperty {string} mot - Mean of transport to be used for routing.
  * @classproperty {object} routingApiParams - object of additional parameters to pass to the routing api request.
+ * @classproperty {object} snapToClosestStation - If true, the routing will snap the coordinate to the closest station. Default to false.
+ * @classproperty {boolean} useRawViaPoints - Experimental property. Wen true, it allows the user to add via points using different kind of string. See "via" parameter defined by the [geOps Routing API](https://developer.geops.io/apis/routing/). Default to false, only array of coordinates and station's id are supported as via points.
  * @classproperty {RoutingLayer|Layer} routingLayer - Layer for adding route features.
  * @classproperty {function} onRouteError - Callback on error.
  * @classproperty {boolean} loading - True if the control is requesting the backend.
@@ -90,6 +113,12 @@ class RoutingControl extends Control {
     /** @ignore */
     this.routingApiParams = options.routingApiParams || {};
 
+    /** @ignore */
+    this.useRawViaPoints = options.useRawViaPoints || false;
+
+    /** @ignore */
+    this.snapToClosestStation = options.snapToClosestStation || false;
+
     /** @ignore */
     this.cacheStationData = {};
 
@@ -106,8 +135,7 @@ class RoutingControl extends Control {
     this.segments = [];
 
     /** @ignore */
-    this.stopsApiUrl =
-      options.stopsApiUrl || 'https://api.geops.io/stops/v1/lookup/';
+    this.stopsApiUrl = options.stopsApiUrl || 'https://api.geops.io/stops/v1/';
 
     /** @ignore */
     this.api = new RoutingAPI({
@@ -139,8 +167,14 @@ class RoutingControl extends Control {
 
     /** @ignore */
     this.viaPoints = [];
+
+    /** @ignore */
     this.onMapClick = this.onMapClick.bind(this);
+
+    /** @ignore */
     this.onModifyEnd = this.onModifyEnd.bind(this);
+
+    /** @ignore */
     this.onModifyStart = this.onModifyStart.bind(this);
 
     /** @ignore */
@@ -173,9 +207,13 @@ class RoutingControl extends Control {
    * @param {number} index Integer representing the index of the added viaPoint.
    * @param {number} [overwrite=0] Marks the number of viaPoints that are removed at the specified index on add.
    */
-  addViaPoint(coordinates, index = this.viaPoints.length, overwrite = 0) {
+  addViaPoint(
+    coordinatesOrString,
+    index = this.viaPoints.length,
+    overwrite = 0,
+  ) {
     /* Add/Insert/Overwrite viapoint and redraw route */
-    this.viaPoints.splice(index, overwrite, coordinates);
+    this.viaPoints.splice(index, overwrite, coordinatesOrString);
     this.drawRoute();
     this.dispatchEvent({
       type: 'change:route',
@@ -247,12 +285,15 @@ class RoutingControl extends Control {
 
     const formattedViaPoints = this.viaPoints.map((viaPoint) => {
       if (Array.isArray(viaPoint)) {
+        const projection = this.map.getView().getProjection();
         // viaPoint is a coordinate
         // Coordinates need to be reversed as required by the backend RoutingAPI
-        return [toLonLat(viaPoint)[1], toLonLat(viaPoint)[0]];
+        const [lon, lat] = toLonLat(viaPoint, projection);
+        return this.snapToClosestStation ? [`@${lat}`, lon] : [lat, lon];
       }
-      // viaPoint is a UID
-      return `!${viaPoint}`;
+
+      // viaPoint is a string to use as it is
+      return this.useRawViaPoints ? viaPoint : `!${viaPoint}`;
     });
 
     this.loading = true;
@@ -344,36 +385,118 @@ class RoutingControl extends Control {
   }
 
   /**
-   * Draw a via point.
+   * Draw a via point. This function can parse all the possibilitiies
    *
    * @private
    */
   drawViaPoint(viaPoint, idx) {
     const pointFeature = new Feature();
     pointFeature.set('viaPointIdx', idx);
+
+    // The via point is a coordinate using the current map's projection
     if (Array.isArray(viaPoint)) {
       pointFeature.setGeometry(new Point(viaPoint));
-      return this.routingLayer.olLayer.getSource().addFeature(pointFeature);
+      this.routingLayer.olLayer.getSource().addFeature(pointFeature);
+      return Promise.resolve(pointFeature);
     }
-    return fetch(
-      `${this.stopsApiUrl}${viaPoint.split('$')[0]}?key=${this.stopsApiKey}`,
-    )
-      .then((res) => res.json())
-      .then((stationData) => {
-        const { coordinates } = stationData.features[0].geometry;
-        this.cacheStationData[viaPoint] = fromLonLat(coordinates);
-        pointFeature.setGeometry(new Point(fromLonLat(coordinates)));
-        this.routingLayer.olLayer.getSource().addFeature(pointFeature);
-      })
-      .catch((error) => {
-        // Dispatch error event and execute error function
-        this.dispatchEvent({
-          type: 'error',
-          target: this,
+
+    // Possibility to parse:
+    //
+    // !8596126 a station with id 8596126
+    // !8596126$4 a station with id 8596126
+    if (!this.useRawViaPoints || REGEX_VIA_POINT_STATION_ID.test(viaPoint)) {
+      let stationId;
+      let track;
+      if (this.useRawViaPoints) {
+        [, stationId, , track] = REGEX_VIA_POINT_STATION_ID.exec(viaPoint);
+      } else {
+        [stationId, track] = viaPoint.split('$');
+      }
+
+      return fetch(
+        `${this.stopsApiUrl}lookup/${stationId}?key=${this.stopsApiKey}`,
+      )
+        .then((res) => res.json())
+        .then((stationData) => {
+          const { coordinates } = stationData.features[0].geometry;
+          this.cacheStationData[viaPoint] = fromLonLat(coordinates);
+          pointFeature.set('viaPointTrack', track);
+          pointFeature.setGeometry(new Point(fromLonLat(coordinates)));
+          this.routingLayer.olLayer.getSource().addFeature(pointFeature);
+          return pointFeature;
+        })
+        .catch((error) => {
+          // Dispatch error event and execute error function
+          this.dispatchEvent({
+            type: 'error',
+            target: this,
+          });
+          this.onRouteError(error, this);
+          this.loading = false;
         });
-        this.onRouteError(error, this);
-        this.loading = false;
-      });
+    }
+
+    // Only when this.useRawViaPoints is true.
+    // Possibility to parse:
+    //
+    // 47.37811,8.53935 a position 47.37811, 8.53935
+    if (this.useRawViaPoints && REGEX_VIA_POINT_COORD.test(viaPoint)) {
+      const [lat, lon] = REGEX_VIA_POINT_COORD.exec(viaPoint);
+      const coordinates = fromLonLat(
+        [parseFloat(lon), parseFloat(lat)],
+        this.map.getView().getProjection(),
+      );
+      pointFeature.setGeometry(new Point(coordinates));
+      this.routingLayer.olLayer.getSource().addFeature(pointFeature);
+      return Promise.resolve(pointFeature);
+    }
+
+    // Only when this.useRawViaPoints is true.
+    // It will parse the via point to find some name, id, track coordinates.
+    //
+    // Possibility to parse:
+    //
+    // @47.37811,8.53935 a station at position 47.37811, 8.53935
+    // @47.37811,8.53935$4 track 4 in a station at position 47.37811, 8.53935
+    // zürich hb@47.37811,8.53935$8 track 8 in station "Zürich HB" at position 47.37811, 8.53935
+    const [, stationName, , lat, lon, , track] = REGEX_VIA_POINT.exec(viaPoint);
+
+    if (lon && lat) {
+      const coordinates = fromLonLat(
+        [parseFloat(lon), parseFloat(lat)],
+        this.map.getView().getProjection(),
+      );
+      pointFeature.set('viaPointTrack', track);
+      pointFeature.setGeometry(new Point(coordinates));
+      this.routingLayer.olLayer.getSource().addFeature(pointFeature);
+      return Promise.resolve(pointFeature);
+    }
+
+    if (stationName) {
+      return fetch(
+        `${this.stopsApiUrl}?key=${this.stopsApiKey}&q=${stationName}&limit=1`,
+      )
+        .then((res) => res.json())
+        .then((stationData) => {
+          const { coordinates } = stationData.features[0].geometry;
+          this.cacheStationData[viaPoint] = fromLonLat(coordinates);
+          pointFeature.set('viaPointTrack', track);
+          pointFeature.setGeometry(new Point(fromLonLat(coordinates)));
+          this.routingLayer.olLayer.getSource().addFeature(pointFeature);
+          return pointFeature;
+        })
+        .catch((error) => {
+          // Dispatch error event and execute error function
+          this.dispatchEvent({
+            type: 'error',
+            target: this,
+          });
+          this.onRouteError(error, this);
+          this.loading = false;
+          return null;
+        });
+    }
+    return Promise.resolve(null);
   }
 
   /**

package/ol/controls/RoutingControl.test.js

@@ -1,5 +1,6 @@
 import fetch from 'jest-fetch-mock';
 import View from 'ol/View';
+import qs from 'query-string';
 import Map from '../Map';
 import RoutingControl from './RoutingControl';
 
@@ -38,6 +39,8 @@ describe('RoutingControl', () => {
   test('should be activate by default', () => {
     const control = new RoutingControl();
     expect(control.active).toBe(true);
+    expect(control.snapToClosestStation).toBe(false);
+    expect(control.useRawViaPoints).toBe(false);
   });
 
   test('launch routing and add features', (done) => {
@@ -99,10 +102,10 @@ describe('RoutingControl', () => {
       .then(() => {
         // Should use correct URL
         expect(fetch.mock.calls[0][0]).toEqual(
-          'https://foo.ch/a4dca961d199ff76?key=foo',
+          'https://foo.ch/lookup/a4dca961d199ff76?key=foo',
         );
         expect(fetch.mock.calls[1][0]).toEqual(
-          'https://foo.ch/e3666f03cba06b2b?key=foo',
+          'https://foo.ch/lookup/e3666f03cba06b2b?key=foo',
         );
         expect(fetch.mock.calls[2][0]).toEqual(
           'https://foo.ch/?coord-punish=1000&coord-radius=100&elevation=false&graph=gen5&key=foo&mot=bus&resolve-hops=false&via=%21a4dca961d199ff76%7C%21e3666f03cba06b2b',
@@ -146,4 +149,68 @@ describe('RoutingControl', () => {
       done();
     });
   });
+
+  test('calls routing api with @ before the coordinates when snapToClosestStation is true', (done) => {
+    fetch.mockResponses(
+      [JSON.stringify(RoutingControlStation1), { status: 200 }],
+      [JSON.stringify(global.fetchRouteResponse), { status: 200 }],
+    );
+
+    const control = new RoutingControl({
+      apiKey: 'foo',
+      snapToClosestStation: true,
+    });
+    control.map = map;
+    expect(map.getTarget().querySelector('#ol-toggle-routing')).toBeDefined();
+    control.viaPoints = [
+      [950476.4055933182, 6003322.253698345],
+      [950389.0813034325, 6003656.659274571],
+      'e3666f03cba06b2b',
+    ];
+    control
+      .drawRoute(control.viaPoints)
+      .then(() => {
+        const params = qs.parseUrl(fetch.mock.calls[1][0]).query;
+        expect(params.via).toBe(
+          '@47.3739194713294,8.538274823394632|@47.37595378493421,8.537490375951839|!e3666f03cba06b2b',
+        );
+        done();
+      })
+      .catch(() => {});
+  });
+
+  test('calls routing api with raw via points', (done) => {
+    fetch.mockResponses(
+      [JSON.stringify(RoutingControlStation1), { status: 200 }],
+      [JSON.stringify(RoutingControlStation2), { status: 200 }],
+      [JSON.stringify(global.fetchRouteResponse), { status: 200 }],
+    );
+
+    const control = new RoutingControl({
+      apiKey: 'foo',
+      useRawViaPoints: true,
+    });
+    control.map = map;
+    expect(map.getTarget().querySelector('#ol-toggle-routing')).toBeDefined();
+    control.viaPoints = [
+      '46.2,7.1',
+      '@46.2,7.1',
+      '@46.2,7$1',
+      'station name$2', // will send a stops request fo the station name
+      'station name@46.2,7', // will use the coordinate
+      'stationname@46.2,7.7$3', // will use the coordinate
+      '!stationid', // will send a stops lookup request fo the station id
+      [950389, 6003656],
+    ];
+    control
+      .drawRoute(control.viaPoints)
+      .then(() => {
+        const params = qs.parseUrl(fetch.mock.calls[2][0]).query;
+        expect(params.via).toBe(
+          '46.2,7.1|@46.2,7.1|@46.2,7$1|station name$2|station name@46.2,7|stationname@46.2,7.7$3|!stationid|47.375949774398805,8.537489645590679',
+        );
+        done();
+      })
+      .catch(() => {});
+  });
 });

package/ol/layers/TralisLayer.test.js

@@ -61,6 +61,18 @@ describe('TrajservLayer', () => {
     expect(clone).toBeInstanceOf(TralisLayer);
   });
 
+  test('should use the sort function.', () => {
+    const fn = () => true;
+    const laye = new TralisLayer({
+      url: 'ws://localhost:1234',
+      apiKey: 'apiKey',
+      sort: fn,
+    });
+    expect(laye).toBeInstanceOf(TralisLayer);
+    expect(laye.useDelayStyle).toBe(false);
+    expect(laye.sort).toBe(fn);
+  });
+
   test('should set a default sort function if useDelayStyle is used.', () => {
     const laye = new TralisLayer({
       url: 'ws://localhost:1234',
@@ -82,7 +94,7 @@ describe('TrajservLayer', () => {
     expect(trajectories).toEqual([red, yellow, cancelled, green2, green, gray]);
   });
 
-  test('should override the defaulrt sort function when useDelayStyle is used.', () => {
+  test('should override the default sort function when useDelayStyle is used.', () => {
     const laye = new TralisLayer({
       url: 'ws://localhost:1234',
       apiKey: 'apiKey',
@@ -103,4 +115,31 @@ describe('TrajservLayer', () => {
     trajectories.sort(laye.sort);
     expect(trajectories).toEqual([cancelled, green2, red, yellow, green, gray]);
   });
+
+  test('should use filter function.', () => {
+    const fn = () => true;
+    const laye = new TralisLayer({
+      url: 'ws://localhost:1234',
+      apiKey: 'apiKey',
+      useDelayStyle: true,
+      filter: fn, // reverse the array
+    });
+    expect(laye).toBeInstanceOf(TralisLayer);
+    expect(laye.useDelayStyle).toBe(true);
+    expect(laye.filter).toBe(fn);
+  });
+
+  test('should override filter function if operator, tripNumber, regexPublishedLineName is set.', () => {
+    const fn = () => true;
+    const laye = new TralisLayer({
+      url: 'ws://localhost:1234',
+      apiKey: 'apiKey',
+      useDelayStyle: true,
+      filter: fn, // reverse the array
+      publishedLineName: '.*',
+    });
+    expect(laye).toBeInstanceOf(TralisLayer);
+    expect(laye.useDelayStyle).toBe(true);
+    expect(laye.filter).not.toBe(fn);
+  });
 });

package/package.json

@@ -2,7 +2,7 @@
   "name": "mobility-toolbox-js",
   "license": "MIT",
   "description": "Toolbox for JavaScript applications in the domains of mobility and logistics.",
-  "version": "1.7.1",
+  "version": "1.7.4",
   "main": "index.js",
   "module": "module.js",
   "dependencies": {