mobility-toolbox-js 2.0.0 → 2.0.1-beta.13

package/ol/controls/RoutingControl.test.js

@@ -1,33 +1,29 @@
-import fetch from 'jest-fetch-mock';
-import View from 'ol/View';
-import qs from 'query-string';
-import Map from 'ol/Map';
-import RoutingControl from './RoutingControl';
-
-import RoutingControlStation1 from './snapshots/RoutingControlStation1.json';
-import RoutingControlStation2 from './snapshots/RoutingControlStation2.json';
-import RoutingControlRouteGen5 from './snapshots/RoutingControlRouteGen5.json';
-import RoutingControlRouteGen10 from './snapshots/RoutingControlRouteGen10.json';
-import RoutingControlRouteGen30 from './snapshots/RoutingControlRouteGen30.json';
-import RoutingControlRouteGen100 from './snapshots/RoutingControlRouteGen100.json';
-import RoutingControlRouteOSM from './snapshots/RoutingControlRouteOSM.json';
-
-describe('RoutingControl', () => {
+import fetch from "jest-fetch-mock";
+import View from "ol/View";
+import qs from "query-string";
+import Map from "ol/Map";
+import RoutingControl from "./RoutingControl";
+import RoutingControlStation1 from "./snapshots/RoutingControlStation1.json";
+import RoutingControlStation2 from "./snapshots/RoutingControlStation2.json";
+import RoutingControlRouteGen5 from "./snapshots/RoutingControlRouteGen5.json";
+import RoutingControlRouteGen10 from "./snapshots/RoutingControlRouteGen10.json";
+import RoutingControlRouteGen30 from "./snapshots/RoutingControlRouteGen30.json";
+import RoutingControlRouteGen100 from "./snapshots/RoutingControlRouteGen100.json";
+import RoutingControlRouteOSM from "./snapshots/RoutingControlRouteOSM.json";
+describe("RoutingControl", () => {
   let map;
-
   beforeEach(() => {
-    const target = document.createElement('div');
+    const target = document.createElement("div");
     document.body.appendChild(target);
     map = new Map({
       target,
       view: new View({
         center: [0, 0],
-        zoom: 0,
-      }),
+        zoom: 0
+      })
     });
     global.fetch = fetch;
   });
-
   afterEach(() => {
     if (map) {
       map.setTarget(null);
@@ -35,182 +31,121 @@ describe('RoutingControl', () => {
     }
     fetch.resetMocks();
   });
-
-  test('should be activate by default', () => {
+  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) => {
+  test("launch routing and add features", (done) => {
     fetch.mockResponseOnce(JSON.stringify(global.fetchRouteResponse));
-
     const control = new RoutingControl({
-      url: 'https://foo.ch',
-      apiKey: 'foo',
+      url: "https://foo.ch",
+      apiKey: "foo"
     });
-    control.map = map;
-    expect(map.getTarget().querySelector('#ol-toggle-routing')).toBeDefined();
+    control.attachToMap(map);
+    expect(map.getTarget().querySelector("#ol-toggle-routing")).toBeDefined();
     control.viaPoints = [
-      [950476.4055933182, 6003322.253698345],
-      [950389.0813034325, 6003656.659274571],
+      [950476.4055933182, 6003322253698345e-9],
+      [950389.0813034325, 6003656659274571e-9]
     ];
-    control
-      .drawRoute(control.viaPoints)
-      .then(() => {
-        // Should use correct URL
-        expect(fetch.mock.calls[0][0]).toEqual(
-          'https://foo.ch?coord-punish=1000&coord-radius=100&elevation=false&graph=osm&key=foo&mot=bus&resolve-hops=false&via=47.3739194713294%2C8.538274823394632%7C47.37595378493421%2C8.537490375951839',
-        );
-        // routingLayer should contain three features (2 x viapoints, 1 x route)
-        expect(
-          control.routingLayer.olLayer.getSource().getFeatures().length,
-        ).toEqual(3);
-        done();
-      })
-      .catch(() => {});
+    control.drawRoute(control.viaPoints).then(() => {
+      expect(fetch.mock.calls[0][0]).toEqual("https://foo.ch?coord-punish=1000&coord-radius=100&elevation=false&graph=osm&key=foo&mot=bus&resolve-hops=false&via=47.3739194713294%2C8.538274823394632%7C47.37595378493421%2C8.537490375951839");
+      expect(control.routingLayer.olLayer.getSource().getFeatures().length).toEqual(3);
+      done();
+    }).catch(() => {
+    });
   });
-
-  test('launch routing and add features for multiple graphs', (done) => {
-    fetch.mockResponses(
-      [JSON.stringify(RoutingControlStation1), { status: 200 }],
-      [JSON.stringify(RoutingControlStation2), { status: 200 }],
-      [JSON.stringify(RoutingControlRouteGen5), { status: 200 }],
-      [JSON.stringify(RoutingControlRouteGen10), { status: 200 }],
-      [JSON.stringify(RoutingControlRouteGen30), { status: 200 }],
-      [JSON.stringify(RoutingControlRouteGen100), { status: 200 }],
-      [JSON.stringify(RoutingControlRouteOSM), { status: 200 }],
-    );
-
+  test("launch routing and add features for multiple graphs", (done) => {
+    fetch.mockResponses([JSON.stringify(RoutingControlStation1), { status: 200 }], [JSON.stringify(RoutingControlStation2), { status: 200 }], [JSON.stringify(RoutingControlRouteGen5), { status: 200 }], [JSON.stringify(RoutingControlRouteGen10), { status: 200 }], [JSON.stringify(RoutingControlRouteGen30), { status: 200 }], [JSON.stringify(RoutingControlRouteGen100), { status: 200 }], [JSON.stringify(RoutingControlRouteOSM), { status: 200 }]);
     const control = new RoutingControl({
-      url: 'https://foo.ch/',
-      stopsApiUrl: 'https://foo.ch/',
-      apiKey: 'foo',
+      url: "https://foo.ch/",
+      stopsApiUrl: "https://foo.ch/",
+      apiKey: "foo",
       graphs: [
-        ['gen5', 6, 7],
-        ['gen10', 8],
-        ['gen30', 9, 10],
-        ['gen100', 11, 13],
-        ['osm', 14, 99],
-      ],
+        ["gen5", 6, 7],
+        ["gen10", 8],
+        ["gen30", 9, 10],
+        ["gen100", 11, 13],
+        ["osm", 14, 99]
+      ]
+    });
+    control.attachToMap(map);
+    control.viaPoints = ["a4dca961d199ff76", "e3666f03cba06b2b"];
+    control.drawRoute(control.viaPoints).then(() => {
+      expect(fetch.mock.calls[0][0]).toEqual("https://foo.ch/lookup/a4dca961d199ff76?key=foo");
+      expect(fetch.mock.calls[1][0]).toEqual("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");
+      expect(fetch.mock.calls[3][0]).toEqual("https://foo.ch/?coord-punish=1000&coord-radius=100&elevation=false&graph=gen10&key=foo&mot=bus&resolve-hops=false&via=%21a4dca961d199ff76%7C%21e3666f03cba06b2b");
+      expect(fetch.mock.calls[4][0]).toEqual("https://foo.ch/?coord-punish=1000&coord-radius=100&elevation=false&graph=gen30&key=foo&mot=bus&resolve-hops=false&via=%21a4dca961d199ff76%7C%21e3666f03cba06b2b");
+      expect(fetch.mock.calls[5][0]).toEqual("https://foo.ch/?coord-punish=1000&coord-radius=100&elevation=false&graph=gen100&key=foo&mot=bus&resolve-hops=false&via=%21a4dca961d199ff76%7C%21e3666f03cba06b2b");
+      expect(fetch.mock.calls[6][0]).toEqual("https://foo.ch/?coord-punish=1000&coord-radius=100&elevation=false&graph=osm&key=foo&mot=bus&resolve-hops=false&via=%21a4dca961d199ff76%7C%21e3666f03cba06b2b");
+      expect(control.routingLayer.olLayer.getSource().getFeatures().length).toEqual(7);
+      done();
+    }).catch(() => {
     });
-    control.map = map;
-    control.viaPoints = ['a4dca961d199ff76', 'e3666f03cba06b2b'];
-    control
-      .drawRoute(control.viaPoints)
-      .then(() => {
-        // Should use correct URL
-        expect(fetch.mock.calls[0][0]).toEqual(
-          'https://foo.ch/lookup/a4dca961d199ff76?key=foo',
-        );
-        expect(fetch.mock.calls[1][0]).toEqual(
-          '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',
-        );
-        expect(fetch.mock.calls[3][0]).toEqual(
-          'https://foo.ch/?coord-punish=1000&coord-radius=100&elevation=false&graph=gen10&key=foo&mot=bus&resolve-hops=false&via=%21a4dca961d199ff76%7C%21e3666f03cba06b2b',
-        );
-        expect(fetch.mock.calls[4][0]).toEqual(
-          'https://foo.ch/?coord-punish=1000&coord-radius=100&elevation=false&graph=gen30&key=foo&mot=bus&resolve-hops=false&via=%21a4dca961d199ff76%7C%21e3666f03cba06b2b',
-        );
-        expect(fetch.mock.calls[5][0]).toEqual(
-          'https://foo.ch/?coord-punish=1000&coord-radius=100&elevation=false&graph=gen100&key=foo&mot=bus&resolve-hops=false&via=%21a4dca961d199ff76%7C%21e3666f03cba06b2b',
-        );
-        expect(fetch.mock.calls[6][0]).toEqual(
-          'https://foo.ch/?coord-punish=1000&coord-radius=100&elevation=false&graph=osm&key=foo&mot=bus&resolve-hops=false&via=%21a4dca961d199ff76%7C%21e3666f03cba06b2b',
-        );
-        // routingLayer should contain seven features (2 x viapoints, 5 x route for each graph)
-        expect(
-          control.routingLayer.olLayer.getSource().getFeatures().length,
-        ).toEqual(7);
-        done();
-      })
-      .catch(() => {});
   });
-
-  test('ignores Abort Error and returns undefined', (done) => {
+  test("ignores Abort Error and returns undefined", (done) => {
     const control = new RoutingControl({
-      url: 'https://foo.ch',
-      apiKey: 'foo',
+      url: "https://foo.ch",
+      apiKey: "foo"
     });
-    control.map = map;
+    control.attachToMap(map);
     control.viaPoints = [
-      [950476.4055933182, 6003322.253698345],
-      [950389.0813034325, 6003656.659274571],
+      [950476.4055933182, 6003322253698345e-9],
+      [950389.0813034325, 6003656659274571e-9]
     ];
-    const error = new Error('Error');
-    error.name = 'AbortError';
+    const error = new Error("Error");
+    error.name = "AbortError";
     fetch.mockRejectOnce(error);
     return control.drawRoute().then((data) => {
-      expect(data).toEqual([undefined]);
+      expect(data).toEqual([void 0]);
       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 }],
-    );
-
+  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,
+      apiKey: "foo",
+      snapToClosestStation: true
     });
-    control.map = map;
-    expect(map.getTarget().querySelector('#ol-toggle-routing')).toBeDefined();
+    control.attachToMap(map);
+    expect(map.getTarget().querySelector("#ol-toggle-routing")).toBeDefined();
     control.viaPoints = [
-      [950476.4055933182, 6003322.253698345],
-      [950389.0813034325, 6003656.659274571],
-      'e3666f03cba06b2b',
+      [950476.4055933182, 6003322253698345e-9],
+      [950389.0813034325, 6003656659274571e-9],
+      "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(() => {});
+    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 }],
-    );
-
+  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,
+      apiKey: "foo",
+      useRawViaPoints: true
     });
-    control.map = map;
-    expect(map.getTarget().querySelector('#ol-toggle-routing')).toBeDefined();
+    control.attachToMap(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],
+      "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",
+      [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(() => {});
+    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/controls/StopFinderControl.js

@@ -1,38 +1,10 @@
-import { fromLonLat } from 'ol/proj';
-import Control from '../../common/controls/Control';
-import mixin from '../../common/mixins/SearchMixin';
-
-/**
- * Search stations.
- *
- * @example
- * import { Map } from 'ol';
- * import { StopFinderControl } from 'mobility-toolbox-js/ol';
- *
- * const map = new Map({
- *   target: 'map',
- * });
- *
- * const control = new StopFinderControl({
- *   apiKey: [yourApiKey]
- * });
- *
- * control.map = map;
- *
- *
- * @see <a href="/example/ol-search">Openlayers search example</a>
- *
- * @extends {Control}
- * @implements {SearchInterface}
- */
+import { fromLonLat } from "ol/proj";
+import Control from "../../common/controls/Control";
+import mixin from "../../common/mixins/SearchMixin";
 class StopFinderControl extends mixin(Control) {
-  /**
-   * @private
-   */
   onSuggestionClick({ geometry }) {
     const coord = fromLonLat(geometry.coordinates);
     this.map.getView().setCenter(coord);
   }
 }
-
 export default StopFinderControl;

package/ol/controls/StopFinderControl.test.js

@@ -1,24 +1,21 @@
-import fetch from 'jest-fetch-mock';
-import View from 'ol/View';
-import Map from 'ol/Map';
-import StopFinderControl from './StopFinderControl';
-
-describe('StopFinderControl', () => {
+import fetch from "jest-fetch-mock";
+import View from "ol/View";
+import Map from "ol/Map";
+import StopFinderControl from "./StopFinderControl";
+describe("StopFinderControl", () => {
   let map;
-
   beforeEach(() => {
-    const target = document.createElement('div');
+    const target = document.createElement("div");
     document.body.appendChild(target);
     map = new Map({
       target,
       view: new View({
         center: [0, 0],
-        zoom: 0,
-      }),
+        zoom: 0
+      })
     });
     global.fetch = fetch;
   });
-
   afterEach(() => {
     if (map) {
       map.setTarget(null);
@@ -26,33 +23,25 @@ describe('StopFinderControl', () => {
     }
     fetch.resetMocks();
   });
-
-  test('should be activate by default', () => {
+  test("should be activate by default", () => {
     const control = new StopFinderControl();
     expect(control.active).toBe(true);
   });
-
-  test('launch a search and display results', (done) => {
+  test("launch a search and display results", (done) => {
     fetch.mockResponseOnce(JSON.stringify(global.stopsSearchResponse));
-
     const control = new StopFinderControl({
-      url: 'https://foo.ch',
-      apiKey: 'foo',
+      url: "https://foo.ch",
+      apiKey: "foo",
       apiParams: {
         limit: 10,
-        foo: 'bar',
-      },
+        foo: "bar"
+      }
     });
-    control.map = map;
+    control.attachToMap(map);
     expect(control.element).toBeDefined();
-    control.search('foo').then(() => {
-      // Correct url
-      expect(fetch.mock.calls[0][0]).toEqual(
-        'https://foo.ch?foo=bar&key=foo&limit=10&q=foo',
-      );
-      expect(
-        control.element.querySelector('div').querySelector('div').innerHTML,
-      ).toBe('Bern');
+    control.search("foo").then(() => {
+      expect(fetch.mock.calls[0][0]).toEqual("https://foo.ch?foo=bar&key=foo&limit=10&q=foo");
+      expect(control.element.querySelector("div").querySelector("div").innerHTML).toBe("Bern");
       done();
     });
   });

package/ol/controls/index.js

@@ -0,0 +1,3 @@
+export { default as CopyrightControl } from "./CopyrightControl";
+export { default as RoutingControl } from "./RoutingControl";
+export { default as StopFinderControl } from "./StopFinderControl";

package/ol/index.js

@@ -1,13 +1,5 @@
-export { default as Layer } from './layers/Layer';
-export { default as MapboxLayer } from './layers/MapboxLayer';
-export { default as MaplibreLayer } from './layers/MaplibreLayer';
-export { default as MapboxStyleLayer } from './layers/MapboxStyleLayer';
-export { default as RoutingLayer } from './layers/RoutingLayer';
-export { default as TralisLayer } from './layers/TralisLayer';
-export { default as VectorLayer } from './layers/VectorLayer';
-export { default as WMSLayer } from './layers/WMSLayer';
-export { default as CopyrightControl } from './controls/CopyrightControl';
-export { default as RoutingControl } from './controls/RoutingControl';
-export { default as StopFinderControl } from './controls/StopFinderControl';
-export * from '../common/styles';
-export * from './styles';
+export * from "../api";
+export * from "../common";
+export * from "./controls";
+export * from "./layers";
+export * from "./styles";