mobility-toolbox-js 2.0.0-beta.34 → 2.0.0-beta.37

package/common/mixins/CopyrightMixin.js

@@ -1,39 +1,17 @@
-"use strict";
 /* eslint-disable class-methods-use-this */
 /* eslint-disable max-classes-per-file */
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CopyrightInterface = void 0;
 /**
  * Copyright control interface.
  *
  */
-var CopyrightInterface = /** @class */ (function () {
-    function CopyrightInterface() {
-    }
+export class CopyrightInterface {
     /**
      * Return an array of layer's copyright.
      *
      * @return {String[]} A list of copyrights to render.
      */
-    CopyrightInterface.prototype.getCopyrights = function () { };
-    return CopyrightInterface;
-}());
-exports.CopyrightInterface = CopyrightInterface;
+    getCopyrights() { }
+}
 /**
  * Mixin for CopyrightInterface.
  *
@@ -41,32 +19,25 @@ exports.CopyrightInterface = CopyrightInterface;
  * @return {Class}  A class that implements <CopyrightInterface> class and extends Base;
  * @private
  */
-var CopyrightMixin = function (Base) {
-    return /** @class */ (function (_super) {
-        __extends(class_1, _super);
-        function class_1() {
-            return _super !== null && _super.apply(this, arguments) || this;
+const CopyrightMixin = (Base) => class extends Base {
+    render() {
+        if (!this.element) {
+            return;
         }
-        class_1.prototype.render = function () {
-            if (!this.element) {
-                return;
-            }
-            this.element.innerHTML = this.active
-                ? this.getCopyrights().join(' | ')
-                : '';
-        };
-        class_1.prototype.createDefaultElement = function () {
-            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',
-            });
-        };
-        return class_1;
-    }(Base));
+        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',
+        });
+    }
 };
-exports.default = CopyrightMixin;
+export default CopyrightMixin;

package/common/mixins/MapboxLayerMixin.js

@@ -1,60 +1,27 @@
-"use strict";
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MapboxLayerInterface = void 0;
 /* eslint-disable max-classes-per-file */
-var proj_1 = require("ol/proj");
-var Layer_1 = require("ol/layer/Layer");
-var Source_1 = require("ol/source/Source");
-var GeoJSON_1 = require("ol/format/GeoJSON");
-var utils_1 = require("../utils");
+import { toLonLat } from 'ol/proj';
+import OLLayer from 'ol/layer/Layer';
+import Source from 'ol/source/Source';
+import GeoJSON from 'ol/format/GeoJSON';
+import { getUrlWithParams, getMapboxMapCopyrights } from '../utils';
 /**
  * MapboxLayerInterface
  */
-var MapboxLayerInterface = /** @class */ (function () {
-    function MapboxLayerInterface() {
-    }
+export class MapboxLayerInterface {
     /**
      * Return the render function function for the ol layer.
      *
      */
     // eslint-disable-next-line class-methods-use-this
-    MapboxLayerInterface.prototype.getOlLayerRender = function () { };
+    getOlLayerRender() { }
     /**
      * Return the Class to instanciate for the mapbox map.
      *
      * @return {mapboxgl.Map|maplibregl.Map} map
      */
     // eslint-disable-next-line class-methods-use-this
-    MapboxLayerInterface.prototype.getMapboxMapClass = function () { };
-    return MapboxLayerInterface;
-}());
-exports.MapboxLayerInterface = MapboxLayerInterface;
+    getMapboxMapClass() { }
+}
 /**
  * Mixin for MapboxLayerLayerInterface.
  * It's used to share code between Mapbox and Maplibre layers without importing both libs
@@ -63,178 +30,169 @@ exports.MapboxLayerInterface = MapboxLayerInterface;
  * @return {Class}  A class that implements {MapboxLayerLayerInterface} class and extends Base;
  * @private
  */
-var MapboxLayerMixin = function (Base) {
-    return /** @class */ (function (_super) {
-        __extends(class_1, _super);
-        function class_1(options) {
-            if (options === void 0) { options = {}; }
-            var _this = _super.call(this, options) || this;
-            _this.olLayer = new Layer_1.default({
-                source: new Source_1.default({}),
-                render: _this.getOlLayerRender(_this),
-            });
-            /**
-             * Url of the mapbox style.
-             * @type {string}
-             * @private
-             */
-            _this.styleUrl = options.url;
-            /**
-             * Api key for the url of the mapbox style.
-             * If set to false, the apiKey is not required.
-             * @type {string}
-             * @private
-             */
-            _this.apiKey = options.apiKey;
-            /**
-             * Name of the apiKey to set in the url request.
-             * Default is 'key'.
-             * @type {string}
-             * @private
-             */
-            _this.apiKeyName = options.apiKeyName || 'key';
-            /** @ignore */
-            _this.updateAttribution = _this.updateAttribution.bind(_this);
-            return _this;
-        }
+const MapboxLayerMixin = (Base) => class extends Base {
+    constructor(options = {}) {
+        super(options);
+        this.olLayer = new OLLayer({
+            source: new Source({}),
+            render: this.getOlLayerRender(this),
+        });
         /**
-         * Initialize the layer and listen to feature clicks.
-         * @param {ol/Map~Map} map
+         * Url of the mapbox style.
+         * @type {string}
+         * @private
          */
-        class_1.prototype.attachToMap = function (map) {
-            _super.prototype.attachToMap.call(this, map);
-            if (!this.map) {
-                return;
-            }
-            /**
-             * The feature format.
-             * @type {ol/format/GeoJSON}
-             */
-            this.format = new GeoJSON_1.default({
-                featureProjection: this.map.getView().getProjection(),
-            });
-            this.loadMbMap();
-        };
+        this.styleUrl = options.url;
         /**
-         * Terminate what was initialized in init function. Remove layer, events...
+         * Api key for the url of the mapbox style.
+         * If set to false, the apiKey is not required.
+         * @type {string}
+         * @private
          */
-        class_1.prototype.detachFromMap = function () {
-            if (this.mbMap) {
-                this.mbMap.off('idle', this.updateAttribution);
-                // Some asynchrone repaints are triggered even if the mbMap has been removed,
-                // to avoid display of errors we set an empty function.
-                this.mbMap.triggerRepaint = function () { };
-                this.mbMap.remove();
-                this.mbMap = null;
-            }
-            this.loaded = false;
-            _super.prototype.detachFromMap.call(this);
-        };
+        this.apiKey = options.apiKey;
         /**
-         * Create the mapbox map.
+         * Name of the apiKey to set in the url request.
+         * Default is 'key'.
+         * @type {string}
          * @private
          */
-        class_1.prototype.loadMbMap = function () {
-            var _a;
-            var _this = this;
-            this.olListenersKeys.push(this.map.on('change:target', function () {
-                _this.loadMbMap();
-            }));
-            if (!this.map.getTargetElement()) {
-                return;
-            }
-            if (!this.visible) {
-                // On next change of visibility we load the map
-                this.olListenersKeys.push(this.once('change:visible', function () {
-                    _this.loadMbMap();
-                }));
-                return;
-            }
-            var container = document.createElement('div');
-            container.style.position = 'absolute';
-            container.style.width = '100%';
-            container.style.height = '100%';
-            if (!this.apiKey && !this.styleUrl.includes(this.apiKeyName)) {
-                // eslint-disable-next-line no-console
-                console.error("No apiKey defined for mapbox layer with style url to ".concat(this.styleUrl));
-            }
-            var Map = this.getMapboxMapClass();
-            /**
-             * A mapbox map
-             * @type {mapboxgl.Map}
-             */
-            this.mbMap = new Map(__assign({ style: (0, utils_1.getUrlWithParams)(this.styleUrl, (_a = {},
-                    _a[this.apiKeyName] = this.apiKey,
-                    _a)).toString(), container: container, interactive: false, trackResize: false, attributionControl: false }, (this.options.mapOptions || {})));
-            this.mbMap.once('load', function () {
-                /**
-                 * Is the map loaded.
-                 * @type {boolean}
-                 */
-                _this.loaded = true;
-                _this.dispatchEvent({
-                    type: 'load',
-                    target: _this,
-                });
-            });
-            this.mbMap.on('idle', this.updateAttribution);
-        };
+        this.apiKeyName = options.apiKeyName || 'key';
+        /** @ignore */
+        this.updateAttribution = this.updateAttribution.bind(this);
+    }
+    /**
+     * Initialize the layer and listen to feature clicks.
+     * @param {ol/Map~Map} map
+     */
+    attachToMap(map) {
+        super.attachToMap(map);
+        if (!this.map) {
+            return;
+        }
         /**
-         * Update attributions of the source.
-         * @private
+         * The feature format.
+         * @type {ol/format/GeoJSON}
          */
-        class_1.prototype.updateAttribution = function (evt) {
-            var _a, _b;
-            var newAttributions = (0, utils_1.getMapboxMapCopyrights)(evt.target) || [];
-            if (((_a = this.copyrights) === null || _a === void 0 ? void 0 : _a.toString()) !== newAttributions.toString()) {
-                this.copyrights = newAttributions;
-                (_b = this.olLayer.getSource()) === null || _b === void 0 ? void 0 : _b.setAttributions(newAttributions);
-            }
-        };
+        this.format = new GeoJSON({
+            featureProjection: this.map.getView().getProjection(),
+        });
+        this.loadMbMap();
+    }
+    /**
+     * Terminate what was initialized in init function. Remove layer, events...
+     */
+    detachFromMap() {
+        if (this.mbMap) {
+            this.mbMap.off('idle', this.updateAttribution);
+            // Some asynchrone repaints are triggered even if the mbMap has been removed,
+            // to avoid display of errors we set an empty function.
+            this.mbMap.triggerRepaint = () => { };
+            this.mbMap.remove();
+            this.mbMap = null;
+        }
+        this.loaded = false;
+        super.detachFromMap();
+    }
+    /**
+     * Create the mapbox map.
+     * @private
+     */
+    loadMbMap() {
+        this.olListenersKeys.push(this.map.on('change:target', () => {
+            this.loadMbMap();
+        }));
+        if (!this.map.getTargetElement()) {
+            return;
+        }
+        if (!this.visible) {
+            // On next change of visibility we load the map
+            this.olListenersKeys.push(this.once('change:visible', () => {
+                this.loadMbMap();
+            }));
+            return;
+        }
+        const container = document.createElement('div');
+        container.style.position = 'absolute';
+        container.style.width = '100%';
+        container.style.height = '100%';
+        if (!this.apiKey && !this.styleUrl.includes(this.apiKeyName)) {
+            // eslint-disable-next-line no-console
+            console.error(`No apiKey defined for mapbox layer with style url to ${this.styleUrl}`);
+        }
+        const Map = this.getMapboxMapClass();
         /**
-         * Request feature information for a given coordinate.
-         * @param {ol/coordinate~Coordinate} coordinate Coordinate to request the information at.
-         * @param {Object} options A [mapboxgl.Map#queryrenderedfeatures](https://docs.mapbox.com/mapbox-gl-js/api/map/#map#queryrenderedfeatures) options parameter.
-         * @return {Promise<FeatureInfo>} Promise with features, layer and coordinate. The original Mapbox feature is available as a property named 'mapboxFeature'.
+         * A mapbox map
+         * @type {mapboxgl.Map}
          */
-        class_1.prototype.getFeatureInfoAtCoordinate = function (coordinate, options) {
-            var _this = this;
-            // Ignore the getFeatureInfo until the mapbox map is loaded
-            if (!options ||
-                !this.format ||
-                !this.mbMap ||
-                !this.mbMap.isStyleLoaded()) {
-                return Promise.resolve({ coordinate: coordinate, features: [], layer: this });
-            }
-            var pixel = coordinate && this.mbMap.project((0, proj_1.toLonLat)(coordinate));
-            if (this.hitTolerance) {
-                var x = pixel.x, y = pixel.y;
-                pixel = [
-                    { x: x - this.hitTolerance, y: y - this.hitTolerance },
-                    { x: x + this.hitTolerance, y: y + this.hitTolerance },
-                ];
-            }
-            // At this point we get GeoJSON Mapbox feature, we transform it to an OpenLayers
-            // feature to be consistent with other layers.
-            var features = this.mbMap
-                .queryRenderedFeatures(pixel, options)
-                .map(function (feature) {
-                var olFeature = _this.format.readFeature(feature);
-                if (olFeature) {
-                    // We save the original mapbox feature to avoid losing informations
-                    // potentially needed for other functionnality like highlighting
-                    // (id, layer id, source, sourceLayer ...)
-                    olFeature.set('mapboxFeature', feature);
-                }
-                return olFeature;
-            });
-            return Promise.resolve({
-                layer: this,
-                features: features,
-                coordinate: coordinate,
+        this.mbMap = new Map(Object.assign({ style: getUrlWithParams(this.styleUrl, {
+                [this.apiKeyName]: this.apiKey,
+            }).toString(), container, interactive: false, trackResize: false, attributionControl: false }, (this.options.mapOptions || {})));
+        this.mbMap.once('load', () => {
+            /**
+             * Is the map loaded.
+             * @type {boolean}
+             */
+            this.loaded = true;
+            this.dispatchEvent({
+                type: 'load',
+                target: this,
             });
-        };
-        return class_1;
-    }(Base));
+        });
+        this.mbMap.on('idle', this.updateAttribution);
+    }
+    /**
+     * Update attributions of the source.
+     * @private
+     */
+    updateAttribution(evt) {
+        var _a, _b;
+        const newAttributions = getMapboxMapCopyrights(evt.target) || [];
+        if (((_a = this.copyrights) === null || _a === void 0 ? void 0 : _a.toString()) !== newAttributions.toString()) {
+            this.copyrights = newAttributions;
+            (_b = this.olLayer.getSource()) === null || _b === void 0 ? void 0 : _b.setAttributions(newAttributions);
+        }
+    }
+    /**
+     * Request feature information for a given coordinate.
+     * @param {ol/coordinate~Coordinate} coordinate Coordinate to request the information at.
+     * @param {Object} options A [mapboxgl.Map#queryrenderedfeatures](https://docs.mapbox.com/mapbox-gl-js/api/map/#map#queryrenderedfeatures) options parameter.
+     * @return {Promise<FeatureInfo>} Promise with features, layer and coordinate. The original Mapbox feature is available as a property named 'mapboxFeature'.
+     */
+    getFeatureInfoAtCoordinate(coordinate, options) {
+        // Ignore the getFeatureInfo until the mapbox map is loaded
+        if (!options ||
+            !this.format ||
+            !this.mbMap ||
+            !this.mbMap.isStyleLoaded()) {
+            return Promise.resolve({ coordinate, features: [], layer: this });
+        }
+        let pixel = coordinate && this.mbMap.project(toLonLat(coordinate));
+        if (this.hitTolerance) {
+            const { x, y } = pixel;
+            pixel = [
+                { x: x - this.hitTolerance, y: y - this.hitTolerance },
+                { x: x + this.hitTolerance, y: y + this.hitTolerance },
+            ];
+        }
+        // At this point we get GeoJSON Mapbox feature, we transform it to an OpenLayers
+        // feature to be consistent with other layers.
+        const features = this.mbMap
+            .queryRenderedFeatures(pixel, options)
+            .map((feature) => {
+            const olFeature = this.format.readFeature(feature);
+            if (olFeature) {
+                // We save the original mapbox feature to avoid losing informations
+                // potentially needed for other functionnality like highlighting
+                // (id, layer id, source, sourceLayer ...)
+                olFeature.set('mapboxFeature', feature);
+            }
+            return olFeature;
+        });
+        return Promise.resolve({
+            layer: this,
+            features,
+            coordinate,
+        });
+    }
 };
-exports.default = MapboxLayerMixin;
+export default MapboxLayerMixin;