@artstesh/maps 1.1.25 → 1.1.26

package/dist/fesm2015/maps-components.js

@@ -22,6 +22,8 @@ import OSM from 'ol/source/OSM';
 import { Vector as Vector$1 } from 'ol/layer';
 import { bbox } from 'ol/loadingstrategy';
 import Cluster from 'ol/source/Cluster';
+import Static from 'ol/source/ImageStatic';
+import ImageLayer from 'ol/layer/Image';
 import Map from 'ol/Map';
 import View from 'ol/View';
 import Overlay from 'ol/Overlay';
@@ -867,6 +869,22 @@ class ZoomControlFactory {
     }
 }
 
+class AddImageLayerCommand extends PostboyGenericMessage {
+    constructor(layer) {
+        super();
+        this.layer = layer;
+    }
+}
+AddImageLayerCommand.ID = '70f9b86f-8bc2-4f28-ae79-a13fc0b1ee5d';
+
+class RemoveImageLayerCommand extends PostboyGenericMessage {
+    constructor(layer) {
+        super();
+        this.layer = layer;
+    }
+}
+RemoveImageLayerCommand.ID = 'c8e7efdb-17ff-4cf9-89be-e688b8de3b95';
+
 class MapPostboyService extends PostboyService {
     constructor() {
         super();
@@ -898,6 +916,7 @@ class MapManagementService {
         this.observeLayerQuery();
         this.observeFeaturesInArea();
         this.observeFeaturesInPoint();
+        this.observeImageLayer();
     }
     observeRemoveTile() {
         this.postboy.sub(RemoveTileCommand).subscribe((c) => {
@@ -916,6 +935,18 @@ class MapManagementService {
             this.map.addLayer(c.layer);
         });
     }
+    observeImageLayer() {
+        this.postboy.sub(AddImageLayerCommand).subscribe((c) => {
+            if (!this.map)
+                return;
+            this.map.addLayer(c.layer);
+        });
+        this.postboy.sub(RemoveImageLayerCommand).subscribe((c) => {
+            if (!this.map)
+                return;
+            this.map.removeLayer(c.layer);
+        });
+    }
     observeMapRender() {
         this.postboy.sub(MapRenderedEvent).subscribe((m) => {
             this.map = m.map;
@@ -1361,6 +1392,8 @@ class MessageRegistratorService extends PostboyAbstractRegistrator {
         this.recordSubject(AddLayerCommand);
         this.recordSubject(RemoveLayerCommand);
         this.recordSubject(AddTileCommand);
+        this.recordSubject(RemoveImageLayerCommand);
+        this.recordSubject(AddImageLayerCommand);
         this.recordSubject(RemoveTileCommand);
         this.recordSubject(MapClickEvent);
         this.recordSubject(CloseTooltipCommand);
@@ -2172,6 +2205,207 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                 type: Input
             }] } });
 
+class ImageLayerSettings {
+    constructor() {
+        /**
+         * Represents the tiles URL.
+         * @typedef {string} url
+         *
+         * @example
+         * 'https://example.ex/{z}/{x}/{y}.png'
+         */
+        this.url = '';
+        /**
+         * Use interpolated values when resampling.
+         * By default, linear interpolation is used when resampling.
+         * Set to false to use the nearest neighbor instead.
+         */
+        this.interpolate = undefined;
+        /**
+         * The projection of the coordinate system.
+         *
+         * @type {string}
+         * @default 'EPSG:3857'
+         */
+        this.projection = 'EPSG:3857';
+        this.extent = [0, 0, 0, 0];
+        /**
+         * Additional headers that should be added to each tile request
+         *
+         * @type {Record<string, string>}
+         * @default An empty array
+         */
+        this.requestHeaders = null;
+    }
+    /**
+     * Creates a copy of the given tile layer settings.
+     *
+     * @param {ImageLayerSettings} model - The tile layer settings to be copied.
+     * @return {ImageLayerSettings} - A new instance of ImageLayerSettings with the same properties as the model.
+     */
+    static copy(model) {
+        const result = new ImageLayerSettings();
+        result.interpolate = model.interpolate;
+        result.projection = model.projection;
+        result.extent = model.extent;
+        result.url = model.url;
+        result.requestHeaders = model.requestHeaders;
+        return result;
+    }
+    /**
+     * Sets the URL of the ImageLayerSettings object.
+     *
+     * @param {string} url - The URL to be set.
+     * @return {ImageLayerSettings} - The updated ImageLayerSettings object.
+     */
+    setUrl(url) {
+        return ImageLayerSettings.copy(Object.assign(Object.assign({}, this), { url }));
+    }
+    /**
+     * Sets the interpolation state for the image layer settings.
+     *
+     * @param {boolean} [interpolate] - Use interpolated values when resampling.
+     * By default, linear interpolation is used when resampling.
+     * Set to false to use the nearest neighbor instead.
+     * @return {ImageLayerSettings} A new instance of ImageLayerSettings with the updated interpolation setting.
+     */
+    setInterpolate(interpolate) {
+        return ImageLayerSettings.copy(Object.assign(Object.assign({}, this), { interpolate }));
+    }
+    setExtent(extent) {
+        return ImageLayerSettings.copy(Object.assign(Object.assign({}, this), { extent }));
+    }
+    /**
+     * Sets the requestHeaders of the ImageLayerSettings object.
+     *
+     * @param {Record<string, string>} requestHeaders - The headers which should be provided.
+     * @return {ImageLayerSettings} - The updated ImageLayerSettings object.
+     */
+    setRequestHeaders(requestHeaders) {
+        return ImageLayerSettings.copy(Object.assign(Object.assign({}, this), { requestHeaders }));
+    }
+    /**
+     * Sets the maximum zoom level for the tile layer.
+     *
+     * @param {number} maxZoom - The maximum zoom level.
+     * @returns {ImageLayerSettings} - The updated tile layer settings object.
+     */
+    setMaxZoom(maxZoom) {
+        return ImageLayerSettings.copy(Object.assign(Object.assign({}, this), { maxZoom }));
+    }
+    /**
+     * Sets the minimum zoom level for the Tile Layer.
+     *
+     * @param {number} minZoom - The minimum zoom level to be set.
+     * @return {ImageLayerSettings} The modified ImageLayerSettings object with the updated minimum zoom level.
+     */
+    setMinZoom(minZoom) {
+        return ImageLayerSettings.copy(Object.assign(Object.assign({}, this), { minZoom }));
+    }
+    /**
+     * Sets the opacity of the ImageLayerSettings.
+     *
+     * @param {number} opacity - The opacity value to set. Must be a number between 0 and 1.
+     * @return {ImageLayerSettings} - A new instance of ImageLayerSettings with the opacity set.
+     */
+    setOpacity(opacity) {
+        return ImageLayerSettings.copy(Object.assign(Object.assign({}, this), { opacity }));
+    }
+    /**
+     * Sets the projection for the tile layer settings.
+     *
+     * @param {string} projection - The desired projection for the tile layer settings.
+     * @return {ImageLayerSettings} - The updated tile layer settings with the new projection.
+     */
+    setProjection(projection) {
+        return ImageLayerSettings.copy(Object.assign(Object.assign({}, this), { projection }));
+    }
+    /**
+     * Checks if the current instance of ImageLayerSettings is equal to the given model.
+     * @param {ImageLayerSettings} model - The model to compare against.
+     * @return {boolean} - True if all properties of the current instance matches the properties of the model;
+     *                    otherwise, false.
+     */
+    isSame(model) {
+        if (this.url !== model.url)
+            return false;
+        if (this.projection !== model.projection)
+            return false;
+        if (this.extent !== model.extent)
+            return false;
+        if (this.interpolate !== model.interpolate)
+            return false;
+        if (this.requestHeaders !== model.requestHeaders)
+            return false;
+        return true;
+    }
+}
+
+class ImageLayerFactory {
+    build(settings) {
+        const source = new Static({
+            url: settings.url,
+            interpolate: settings.interpolate,
+            crossOrigin: 'Anonymous',
+            projection: get(settings.projection),
+            imageExtent: settings.extent,
+        });
+        return new ImageLayer({ source });
+    }
+}
+ImageLayerFactory.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ImageLayerFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+ImageLayerFactory.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ImageLayerFactory, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ImageLayerFactory, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class ImageLayerComponent extends DestructibleComponent {
+    constructor(postboy, factory) {
+        super();
+        this.postboy = postboy;
+        this.factory = factory;
+        this._settings = new ImageLayerSettings();
+        this.onDestroy = () => this.removeLayer();
+    }
+    set settings(value) {
+        if (!value || this._settings.isSame(value))
+            return;
+        this._settings = value;
+        this.initLayer();
+    }
+    ngOnInit() {
+        this.postboy
+            .sub(MapRenderedEvent)
+            .pipe(filter((m) => !!m), first())
+            .subscribe((m) => this.initLayer());
+    }
+    initLayer() {
+        this.removeLayer();
+        this.layer = this.factory.build(this._settings);
+        this.postboy.fire(new AddImageLayerCommand(this.layer));
+    }
+    removeLayer() {
+        if (this.layer)
+            this.postboy.fire(new RemoveImageLayerCommand(this.layer));
+    }
+}
+ImageLayerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ImageLayerComponent, deps: [{ token: MapPostboyService }, { token: ImageLayerFactory }], target: i0.ɵɵFactoryTarget.Component });
+ImageLayerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ImageLayerComponent, selector: "art-image-layer", inputs: { settings: "settings" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ImageLayerComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'art-image-layer',
+                    template: '',
+                    styleUrls: [],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], ctorParameters: function () { return [{ type: MapPostboyService }, { type: ImageLayerFactory }]; }, propDecorators: { settings: [{
+                type: Input
+            }] } });
+
 class MapPlateFactory {
     build(settings) {
         return new Map({
@@ -2675,14 +2909,16 @@ MapModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.
         TooltipComponent,
         PolygonsComponent,
         ClusterLayerComponent,
-        MapControlZoomComponent], imports: [CommonModule], exports: [MapPlateComponent,
+        MapControlZoomComponent,
+        ImageLayerComponent], imports: [CommonModule], exports: [MapPlateComponent,
         FeatureLayerComponent,
         MarkersComponent,
         TileLayerComponent,
         TooltipComponent,
         PolygonsComponent,
         ClusterLayerComponent,
-        MapControlZoomComponent] });
+        MapControlZoomComponent,
+        ImageLayerComponent] });
 MapModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapModule, imports: [[CommonModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapModule, decorators: [{
             type: NgModule,
@@ -2699,6 +2935,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                         PolygonsComponent,
                         ClusterLayerComponent,
                         MapControlZoomComponent,
+                        ImageLayerComponent,
                     ],
                     exports: [
                         MapPlateComponent,
@@ -2709,6 +2946,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                         PolygonsComponent,
                         ClusterLayerComponent,
                         MapControlZoomComponent,
+                        ImageLayerComponent,
                     ],
                 }]
         }] });
@@ -2909,5 +3147,5 @@ class StringifyFeatureHelper {
  * Generated bundle index. Do not edit.
  */
 
-export { AddControlCommand, CalculateAreaExecutor, CancelDrawingCommand, CancelFeatureModificationCommand, CloseTooltipCommand, ClusterLayerComponent, ClusterLayerSettings, DrawSelectionAreaCommand, DrawingType, FeatureLayerComponent, FeatureLayerSettings, FeatureOutputFormat, FilterFeaturesInAreaExecutor, FilterFeaturesInPointExecutor, FitToFeaturesCommand, FitToPolygonsCommand, GetFeaturesInAreaQuery, GetFeaturesInPointQuery, GetMapPositionExecutor, MapClickEvent, MapConstants, MapControl, MapControlZoomComponent, MapFeatureHoveredEvent, MapLyrs, MapLyrsLabel, MapModule, MapMoveEndEvent, MapPlateComponent, MapPointerMoveEvent, MapPostboyService, MapRenderedEvent, MapSettings, MarkerModel, MarkerStyleHelper, MarkersComponent, MessageRegistratorService, ModifyFeatureCommand, OsmTileLayerComponent, PolygonModel, PolygonSelfIntersectionExecutor, PolygonStyleHelper, PolygonsComponent, RemoveControlCommand, SetMapCenterCommand, StartDrawingCommand, StringifyFeatureHelper, TextStyleHelper, TileLayerComponent, TileLayerSettings, TooltipComponent, TooltipSettings, ZoomControlSettings };
+export { AddControlCommand, CalculateAreaExecutor, CancelDrawingCommand, CancelFeatureModificationCommand, CloseTooltipCommand, ClusterLayerComponent, ClusterLayerSettings, DrawSelectionAreaCommand, DrawingType, FeatureLayerComponent, FeatureLayerSettings, FeatureOutputFormat, FilterFeaturesInAreaExecutor, FilterFeaturesInPointExecutor, FitToFeaturesCommand, FitToPolygonsCommand, GetFeaturesInAreaQuery, GetFeaturesInPointQuery, GetMapPositionExecutor, ImageLayerComponent, ImageLayerSettings, MapClickEvent, MapConstants, MapControl, MapControlZoomComponent, MapFeatureHoveredEvent, MapLyrs, MapLyrsLabel, MapModule, MapMoveEndEvent, MapPlateComponent, MapPointerMoveEvent, MapPostboyService, MapRenderedEvent, MapSettings, MarkerModel, MarkerStyleHelper, MarkersComponent, MessageRegistratorService, ModifyFeatureCommand, OsmTileLayerComponent, PolygonModel, PolygonSelfIntersectionExecutor, PolygonStyleHelper, PolygonsComponent, RemoveControlCommand, SetMapCenterCommand, StartDrawingCommand, StringifyFeatureHelper, TextStyleHelper, TileLayerComponent, TileLayerSettings, TooltipComponent, TooltipSettings, ZoomControlSettings };
 //# sourceMappingURL=maps-components.js.map