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

package/common/controls/ControlCommon.js

@@ -0,0 +1,150 @@
+import BaseObject from 'ol/Object';
+/**
+ * A class representing a control to display on map.
+ *
+ * @example
+ * const control = new Control();
+ *
+ * @classproperty {ol/Map~Map|mapboxgl.Map} map - The map which the control refers to.
+ * @classproperty {boolean} active - Active the control.
+ * @classproperty {HTMLElement} element - The HTML element used to render the control.
+ * @classproperty {HTMLElement} target - The HTML element where to render the element property. Default is the map's element. Read only.
+ */
+class ControlCommon extends BaseObject {
+    /**
+     * Constructor
+     *
+     * @param {Object} [options] Control options.
+     * @param {boolean} [options.active = true] Whether the control is active or not.
+     * @param {HTMLElement} [options.element] The HTML element used to render the control.
+     * @param {HTMLElement} [options.target] The HTML element where to render the element property. Default is the map's element.
+     * @param {function} [options.render] Render function called whenever the control needs to be rerendered.
+     */
+    constructor(options = {}) {
+        super(options);
+        this.defineProperties(options);
+        const { active } = Object.assign({ active: options.active !== false }, options);
+        /**
+         * @ignore
+         */
+        this.active = active;
+    }
+    /**
+     * Define control's properties.
+     *
+     * @private
+     * @ignore
+     */
+    defineProperties(options) {
+        const { target, element, render } = Object.assign({}, options);
+        Object.defineProperties(this, {
+            active: {
+                get: () => this.get('active'),
+                set: (newActive) => {
+                    this.set('active', newActive);
+                    if (newActive) {
+                        this.activate();
+                    }
+                    else {
+                        this.deactivate();
+                    }
+                    this.render();
+                },
+            },
+            map: {
+                get: () => this.get('map'),
+                set: (map) => {
+                    // Remove previous node.
+                    if (this.map && this.element && this.element.parentNode) {
+                        this.element.parentNode.removeChild(this.element);
+                    }
+                    // Clean listeners
+                    this.deactivate();
+                    this.set('map', map);
+                    if (this.map) {
+                        // Add new node
+                        const targett = this.target ||
+                            (this.map.getTargetElement &&
+                                this.map.getTargetElement()) ||
+                            (this.map.getContainer &&
+                                this.map.getContainer());
+                        if (!this.element) {
+                            this.createDefaultElement();
+                        }
+                        if (this.element) {
+                            targett.appendChild(this.element);
+                        }
+                        // Add listeners
+                        if (this.active) {
+                            this.activate();
+                        }
+                    }
+                    this.render();
+                },
+            },
+            target: {
+                value: target,
+            },
+            element: {
+                value: element,
+                writable: true,
+            },
+            render: {
+                /** @ignore */
+                value: render || this.render,
+                writable: true,
+            },
+        });
+    }
+    /**
+     * Attach the control to the map. Add events, html element ...
+     */
+    attachToMap(map) {
+        this.map = map;
+    }
+    /**
+     * Detach the control From the map. Remove events, html element ..
+     */
+    detachFromMap() {
+        this.map = undefined;
+    }
+    /**
+     * Add listeners then renders the control.
+     * To be defined in inherited classes.
+     */
+    activate() {
+        this.deactivate();
+    }
+    /**
+     * Remove listeners added by activate() function then renders the control.
+     * To be defined in inherited classes.
+     */
+    // eslint-disable-next-line class-methods-use-this
+    deactivate() {
+        // eslint-disable-next-line no-console
+        console.error('The function deactivate() must be implemented in subclasses');
+    }
+    /**
+     * The default render function. It renders content in the HTML element.
+     * To be defined in inherited classes.
+     *
+     * @private
+     */
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    render(options) {
+        // eslint-disable-next-line no-console
+        console.error('The function render() must be implemented in subclasses');
+    }
+    /**
+     * The default element to display if this.element is not defined.
+     * To be defined in inherited classes.
+     *
+     * @private
+     */
+    // eslint-disable-next-line class-methods-use-this
+    createDefaultElement() {
+        // eslint-disable-next-line no-console
+        console.error('The function createDefaultElement() must be implemented in subclasses');
+    }
+}
+export default ControlCommon;

package/common/controls/CopyrightControlCommon.d.ts

@@ -0,0 +1,13 @@
+import ControlCommon from './ControlCommon';
+/**
+ * A class representing a copyright control to display on map.
+ * This class only draw an html element, with an empty string in it.
+ * Use subclasses to use it in an ol or mapbox map.
+ */
+declare class CopyrightControlCommon extends ControlCommon {
+    render(): void;
+    createDefaultElement(): void;
+    getCopyrights(): string[];
+}
+export default CopyrightControlCommon;
+//# sourceMappingURL=CopyrightControlCommon.d.ts.map

package/common/controls/CopyrightControlCommon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CopyrightControlCommon.d.ts","sourceRoot":"","sources":["../../../src/common/controls/CopyrightControlCommon.ts"],"names":[],"mappings":"AACA,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAE5C;;;;GAIG;AACH,cAAM,sBAAuB,SAAQ,aAAa;IAChD,MAAM;IASN,oBAAoB;IAYpB,aAAa;CAQd;AAED,eAAe,sBAAsB,CAAC"}

package/common/controls/CopyrightControlCommon.js

@@ -0,0 +1,34 @@
+/* eslint-disable max-classes-per-file */
+import ControlCommon from './ControlCommon';
+/**
+ * A class representing a copyright control to display on map.
+ * This class only draw an html element, with an empty string in it.
+ * Use subclasses to use it in an ol or mapbox map.
+ */
+class CopyrightControlCommon extends ControlCommon {
+    render() {
+        if (!this.element) {
+            return;
+        }
+        this.element.innerHTML = this.active
+            ? this.getCopyrights().join(' | ')
+            : '';
+    }
+    createDefaultElement() {
+        this.element = document.createElement('div');
+        this.element.id = 'mbt-copyright';
+        Object.assign(this.element.style, {
+            position: 'absolute',
+            bottom: 0,
+            right: 0,
+            fontSize: '.8rem',
+            padding: '0 10px',
+        });
+    }
+    getCopyrights() {
+        // eslint-disable-next-line no-console
+        console.error('The getCopyrights() function must be implemented in subclasses.', this);
+        return [];
+    }
+}
+export default CopyrightControlCommon;

package/common/controls/StopFinderControlCommon.d.ts

@@ -0,0 +1,55 @@
+import { FeatureCollection } from '@turf/helpers';
+import { Feature } from 'geojson';
+import { StopsAPI } from '../../api';
+import { StopsAPIOptions } from '../../api/StopsAPI';
+import { StopsParameters } from '../../types';
+import ControlCommon, { ControlCommonOptions } from './ControlCommon';
+export type StopFinderControlCommonOptions = ControlCommonOptions & StopsAPIOptions & {
+    placeholder?: string;
+    apiParams: StopsParameters;
+};
+/**
+ * A class representing a stop finder control to display on map.
+ * This class only draw the html elements.
+ * The geographic logic must be implemented by subclasses.
+ */
+declare class StopFinderControlCommon extends ControlCommon {
+    apiParams: StopsParameters;
+    placeholder: string;
+    api: StopsAPI;
+    abortController?: AbortController;
+    suggestionsElt?: HTMLElement;
+    inputElt?: HTMLInputElement;
+    clearElt?: HTMLDivElement;
+    /**
+     * Constructor.
+     *
+     * @param {Object} options Map options
+     * @param {string} options.apiKey Access key for [geOps services](https://developer.geops.io/). See StopsAPI.
+     * @param {string} [options.url='https://api.geops.io/tracker/v1'] Stops service url. See StopsAPI.
+     * @param {string} [options.placeholder='Search for a stop...'] Input field placeholder.
+     * @param {StopsSearchParams} [options.apiParams={ limit: 20 }] Request parameters. See [Stops service documentation](https://developer.geops.io/apis/5dcbd702a256d90001cf1361/).
+     */
+    constructor(options: StopFinderControlCommonOptions);
+    deactivate(): void;
+    render(featureCollection?: FeatureCollection): void;
+    createDefaultElement(): void;
+    /**
+     * Launch a search.
+     *
+     * @param {String} query The query to search for.
+     * @param {AbortController} abortController Abort controller used to cancel the request.
+     * @return {Promise<Array<GeoJSONFeature>>} An array of GeoJSON features with coordinates in [EPSG:4326](http://epsg.io/4326).
+     */
+    search(q: string, abortController: AbortController): Promise<void>;
+    /**
+     * To be defined in inherited class
+     */
+    onSuggestionClick(suggestion: Feature): void;
+    /**
+     * Clear the search field and close the control.
+     */
+    clear(): void;
+}
+export default StopFinderControlCommon;
+//# sourceMappingURL=StopFinderControlCommon.d.ts.map

package/common/controls/StopFinderControlCommon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StopFinderControlCommon.d.ts","sourceRoot":"","sources":["../../../src/common/controls/StopFinderControlCommon.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAClC,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AACrC,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,aAAa,EAAE,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAEtE,MAAM,MAAM,8BAA8B,GAAG,oBAAoB,GAC/D,eAAe,GAAG;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,eAAe,CAAC;CAC5B,CAAC;AAEJ;;;;GAIG;AACH,cAAM,uBAAwB,SAAQ,aAAa;IACjD,SAAS,EAAE,eAAe,CAAC;IAE3B,WAAW,EAAE,MAAM,CAAC;IAEpB,GAAG,EAAE,QAAQ,CAAC;IAEd,eAAe,CAAC,EAAE,eAAe,CAAC;IAElC,cAAc,CAAC,EAAE,WAAW,CAAC;IAE7B,QAAQ,CAAC,EAAE,gBAAgB,CAAC;IAE5B,QAAQ,CAAC,EAAE,cAAc,CAAC;IAE1B;;;;;;;;OAQG;gBACS,OAAO,EAAE,8BAA8B;IAenD,UAAU;IAEV,MAAM,CAAC,iBAAiB,CAAC,EAAE,iBAAiB;IAwB5C,oBAAoB;IAuDpB;;;;;;OAMG;IACH,MAAM,CAAC,CAAC,EAAE,MAAM,EAAE,eAAe,EAAE,eAAe;IAsBlD;;OAEG;IAEH,iBAAiB,CAAC,UAAU,EAAE,OAAO;IAErC;;OAEG;IACH,KAAK;CASN;AAED,eAAe,uBAAuB,CAAC"}

package/common/controls/StopFinderControlCommon.js

@@ -0,0 +1,144 @@
+import { StopsAPI } from '../../api';
+import ControlCommon from './ControlCommon';
+/**
+ * A class representing a stop finder control to display on map.
+ * This class only draw the html elements.
+ * The geographic logic must be implemented by subclasses.
+ */
+class StopFinderControlCommon extends ControlCommon {
+    /**
+     * Constructor.
+     *
+     * @param {Object} options Map options
+     * @param {string} options.apiKey Access key for [geOps services](https://developer.geops.io/). See StopsAPI.
+     * @param {string} [options.url='https://api.geops.io/tracker/v1'] Stops service url. See StopsAPI.
+     * @param {string} [options.placeholder='Search for a stop...'] Input field placeholder.
+     * @param {StopsSearchParams} [options.apiParams={ limit: 20 }] Request parameters. See [Stops service documentation](https://developer.geops.io/apis/5dcbd702a256d90001cf1361/).
+     */
+    constructor(options) {
+        super(options);
+        const { apiParams, apiKey, url, placeholder } = options || {};
+        this.apiParams = Object.assign({ limit: 20 }, (apiParams || {}));
+        this.placeholder = placeholder || 'Search for a stop...';
+        const apiOptions = { apiKey };
+        if (url) {
+            apiOptions.url = url;
+        }
+        this.api = new StopsAPI(apiOptions);
+        this.abortController = new AbortController();
+    }
+    deactivate() { }
+    render(featureCollection) {
+        const suggestions = (featureCollection === null || featureCollection === void 0 ? void 0 : featureCollection.features) || [];
+        if (!this.suggestionsElt) {
+            return;
+        }
+        this.suggestionsElt.style.display = suggestions.length ? 'block' : 'none';
+        this.suggestionsElt.innerHTML = '';
+        suggestions.forEach((suggestion) => {
+            var _a, _b;
+            const suggElt = document.createElement('div');
+            suggElt.innerHTML = (_a = suggestion === null || suggestion === void 0 ? void 0 : suggestion.properties) === null || _a === void 0 ? void 0 : _a.name;
+            suggElt.onclick = () => {
+                // @ts-ignore
+                this.onSuggestionClick(suggestion);
+            };
+            Object.assign(suggElt.style, {
+                padding: '5px 12px',
+            });
+            (_b = this.suggestionsElt) === null || _b === void 0 ? void 0 : _b.appendChild(suggElt);
+        });
+    }
+    createDefaultElement() {
+        /**
+         * Define a default element.
+         */
+        this.element = document.createElement('div');
+        this.element.id = 'mbt-search';
+        Object.assign(this.element.style, {
+            position: 'absolute',
+            top: 0,
+            left: '50px',
+            margin: '10px',
+            display: 'flex',
+            flexDirection: 'column',
+            width: '320px',
+        });
+        // Create input element
+        this.inputElt = document.createElement('input');
+        this.inputElt.type = 'text';
+        this.inputElt.placeholder = this.placeholder;
+        this.inputElt.autocomplete = 'off';
+        this.inputElt.onkeyup = (evt) => {
+            var _a;
+            (_a = this.abortController) === null || _a === void 0 ? void 0 : _a.abort();
+            this.abortController = new AbortController();
+            // @ts-ignore
+            this.search(evt.target.value, this.abortController);
+        };
+        Object.assign(this.inputElt.style, {
+            padding: '10px 30px 10px 10px',
+        });
+        this.element.appendChild(this.inputElt);
+        // Create suggestions list element
+        this.suggestionsElt = document.createElement('div');
+        Object.assign(this.suggestionsElt.style, {
+            backgroundColor: 'white',
+            overflowY: 'auto',
+            cursor: 'pointer',
+        });
+        this.element.appendChild(this.suggestionsElt);
+        this.clearElt = document.createElement('div');
+        Object.assign(this.clearElt.style, {
+            display: 'none',
+            position: 'absolute',
+            right: '0',
+            padding: '0 10px',
+            fontSize: '200%',
+            cursor: 'pointer',
+        });
+        this.clearElt.innerHTML = '×';
+        this.clearElt.onclick = () => this.clear();
+        this.element.appendChild(this.clearElt);
+    }
+    /**
+     * Launch a search.
+     *
+     * @param {String} query The query to search for.
+     * @param {AbortController} abortController Abort controller used to cancel the request.
+     * @return {Promise<Array<GeoJSONFeature>>} An array of GeoJSON features with coordinates in [EPSG:4326](http://epsg.io/4326).
+     */
+    search(q, abortController) {
+        if (q !== undefined || q !== null) {
+            this.apiParams.q = q;
+        }
+        if (this.clearElt) {
+            this.clearElt.style.display = 'block';
+        }
+        return this.api
+            .search(this.apiParams, abortController && { signal: abortController.signal })
+            .then((data) => {
+            this.render(data);
+        })
+            .catch(() => {
+            this.render();
+        });
+    }
+    /**
+     * To be defined in inherited class
+     */
+    // eslint-disable-next-line no-unused-vars, @typescript-eslint/no-unused-vars
+    onSuggestionClick(suggestion) { }
+    /**
+     * Clear the search field and close the control.
+     */
+    clear() {
+        if (!this.suggestionsElt || !this.inputElt || !this.clearElt) {
+            return;
+        }
+        this.inputElt.value = '';
+        this.suggestionsElt.innerHTML = '';
+        this.clearElt.style.display = 'none';
+    }
+}
+export default StopFinderControlCommon;

package/common/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./utils";
+export * from "./styles";
+//# sourceMappingURL=index.d.ts.map

package/common/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/common/index.js"],"names":[],"mappings":""}

package/common/index.js

@@ -1,4 +1,2 @@
-export { default as Tracker } from "./Tracker";
-export * as trackerConfig from "./trackerConfig";
-export * from "./utils";
-export * from "./styles";
+export * from './utils';
+export * from './styles';

package/common/layers/LayerCommon.d.ts

@@ -0,0 +1,94 @@
+import BaseObject from 'ol/Object';
+import type { AnyMap, LayerGetFeatureInfoOptions, LayerGetFeatureInfoResponse } from '../../types';
+export type LayerCommonOptions = {
+    key?: string;
+    name?: string;
+    group?: string;
+    copyrights?: string[];
+    children?: Layer[];
+    visible?: Boolean;
+    disabled?: Boolean;
+    hitTolerance?: Number;
+    properties?: {
+        [x: string]: any;
+    };
+    map?: AnyMap;
+};
+/**
+ * A class representing a layer to display on map.
+ *
+ * @example
+ * const layer = new Layer({
+ *   name: 'My Layer',
+ * });
+ *
+ * @classproperty {string} key - Identifier of the layer. Must be unique.
+ * @classproperty {string} name - Name of the layer
+ * @classproperty {string[]} copyrights - Array of copyrights.
+ * @classproperty {Layer[]} children - List of children layers.
+ * @classproperty {boolean} visible - Define if the layer is currently display on the map.
+ * @classproperty {boolean} disabled - Define if the layer is currently display on the map but can't be seen (extent, zoom ,data restrictions).
+ * @classproperty {number} hitTolerance - Hit-detection tolerance in css pixels. Pixels inside the radius around the given position will be checked for features.
+ * @classproperty {Object} properties - Custom properties.
+ * @classproperty {ol/Map~Map|mapboxgl.Map} map - The map where the layer is displayed.
+ */
+export default class Layer extends BaseObject {
+    key?: string;
+    name?: string;
+    group?: string;
+    copyrights?: string[];
+    children?: Layer[];
+    visible?: boolean;
+    disabled?: boolean;
+    hitTolerance?: number;
+    properties?: {
+        [x: string]: any;
+    };
+    map?: AnyMap;
+    parent?: Layer;
+    options: LayerCommonOptions;
+    /**
+     * Constructor
+     *
+     * @param {Object} options
+     * @param {string} [options.key=uuid()] Identifier of the layer. Muste be unique. Default use a generated uuid.
+     * @param {string} [options.name] Name of the layer.
+     * @param {string[]} [options.copyrights] Array of copyrights.
+     * @param {Array<Layer>} [options.children=[]] Sublayers, all child layers will have a parent property associated to this layer.
+     * @param {boolean} [options.visible=true]  Define if the layer is currently display on the map.
+     * @param {boolean} [options.disabled=false] Define if the layer is currently display on the map but can't be seen (extent, zoom ,data restrictions).
+     * @param {number} [options.hitTolerance=5] Hit-detection tolerance in css pixels. Pixels inside the radius around the given position will be checked for features.
+     * @param {Object} [options.properties={}] Application-specific layer properties.
+     */
+    constructor(options?: LayerCommonOptions);
+    /**
+     * Define layer's properties that needs custom get and set.
+     *
+     * @ignore
+     */
+    defineProperties(options?: LayerCommonOptions): void;
+    /**
+     * Initialize the layer with the map passed in parameters.
+     *
+     * @param {ol/Map~Map|mapboxgl.Map} map A map.
+     */
+    attachToMap(map: AnyMap): void;
+    /**
+     * Terminate what was initialized in init function. Remove layer, events...
+     */
+    detachFromMap(): void;
+    /**
+     * Request feature information for a given coordinate.
+     * This function must be implemented by inheriting layers.
+     *
+     * @param {ol/coordinate~Coordinate} coordinate Coordinate.
+     * @param {Object} options Some options. See child classes to see which are supported.
+     * @return {Promise<FeatureInfo>} An empty response.
+     */
+    getFeatureInfoAtCoordinate(coordinate: number[], options?: LayerGetFeatureInfoOptions): Promise<LayerGetFeatureInfoResponse>;
+    /**
+     * Return the an array containing all the descendants of the layer in a flat array. Including the current layer.
+     */
+    flat(): any[];
+}
+//# sourceMappingURL=LayerCommon.d.ts.map

package/common/layers/LayerCommon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LayerCommon.d.ts","sourceRoot":"","sources":["../../../src/common/layers/LayerCommon.ts"],"names":[],"mappings":"AAAA,OAAO,UAAU,MAAM,WAAW,CAAC;AAInC,OAAO,KAAK,EACV,MAAM,EACN,0BAA0B,EAC1B,2BAA2B,EAC5B,MAAM,aAAa,CAAC;AAErB,MAAM,MAAM,kBAAkB,GAAG;IAC/B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,EAAE,CAAC;IACtB,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE;QAAE,CAAC,CAAC,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAC;IAClC,GAAG,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAEF;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,CAAC,OAAO,OAAO,KAAM,SAAQ,UAAU;IAC3C,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,UAAU,CAAC,EAAE,MAAM,EAAE,CAAC;IAEtB,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC;IAEnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,UAAU,CAAC,EAAE;QAAE,CAAC,CAAC,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAM;IAEvC,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,MAAM,CAAC,EAAE,KAAK,CAAC;IAEf,OAAO,EAAE,kBAAkB,CAAM;IAEjC;;;;;;;;;;;;OAYG;gBACS,OAAO,GAAE,kBAAuB;IAoC5C;;;;OAIG;IACH,gBAAgB,CAAC,OAAO,GAAE,kBAAuB;IA2IjD;;;;OAIG;IACH,WAAW,CAAC,GAAG,EAAE,MAAM;IAYvB;;OAEG;IAEH,aAAa;IAKb;;;;;;;OAOG;IAEH,0BAA0B,CACxB,UAAU,EAAE,MAAM,EAAE,EAEpB,OAAO,CAAC,EAAE,0BAA0B,GACnC,OAAO,CAAC,2BAA2B,CAAC;IAgBvC;;OAEG;IACH,IAAI;CAGL"}