@artstesh/maps 5.0.8 → 5.0.10

package/dist/fesm2022/maps-components.mjs

@@ -3,26 +3,28 @@ import { Component, Injectable, ChangeDetectionStrategy, Input, ViewChild, NgMod
 import * as i4 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import { Feature } from 'ol';
-import { Point } from 'ol/geom';
+import { Point, LineString } from 'ol/geom';
 import { GeoJSON, WKT } from 'ol/format';
 import { getCenter, createEmpty, extend } from 'ol/extent';
-import { get, useGeographic } from 'ol/proj';
+import { get, useGeographic, transform } from 'ol/proj';
 import { PostboyGenericMessage, PostboyCallbackMessage, PostboyService, PostboyAbstractRegistrator } from '@artstesh/postboy';
-import { first, filter, auditTime } from 'rxjs/operators';
+import { forkJoin, combineLatest } from 'rxjs';
+import { tap, first, filter, auditTime } from 'rxjs/operators';
 import { Vector, XYZ } from 'ol/source';
 import { Draw } from 'ol/interaction';
+import { createRegularPolygon } from 'ol/interaction/Draw';
 import TileLayer from 'ol/layer/Tile';
 import OSM from 'ol/source/OSM';
 import { Vector as Vector$1 } from 'ol/layer';
 import { bbox } from 'ol/loadingstrategy';
-import { fromExtent } from 'ol/geom/Polygon';
+import Polygon, { fromExtent } from 'ol/geom/Polygon';
 import Cluster from 'ol/source/Cluster';
-import { combineLatest } from 'rxjs';
 import Map from 'ol/Map';
 import View from 'ol/View';
 import Overlay from 'ol/Overlay';
 import Style from 'ol/style/Style';
 import { Icon, Circle, Fill, Stroke, Text } from 'ol/style';
+import { METERS_PER_UNIT } from 'ol/proj/epsg4326';
 
 class DestructibleComponent {
     subs = [];
@@ -183,6 +185,7 @@ class PolygonModel {
 var DrawingType;
 (function (DrawingType) {
     DrawingType[DrawingType["Polygon"] = 1] = "Polygon";
+    DrawingType[DrawingType["Circle"] = 2] = "Circle";
 })(DrawingType || (DrawingType = {}));
 
 var FeatureOutputFormat;
@@ -191,6 +194,60 @@ var FeatureOutputFormat;
     FeatureOutputFormat[FeatureOutputFormat["WKT"] = 2] = "WKT";
 })(FeatureOutputFormat || (FeatureOutputFormat = {}));
 
+class Dictionary {
+    collection = {};
+    _keys = new Set();
+    get keys() {
+        return Array.from(this._keys);
+    }
+    get size() {
+        return this._keys.size;
+    }
+    static clone(dic, action) {
+        return Dictionary.create(dic.collection, action);
+    }
+    static create(dic, action) {
+        let keyList = Object.keys(dic);
+        const result = new Dictionary();
+        for (let i = 0; i < keyList.length; i++) {
+            let key = keyList[i];
+            result._keys.add(key);
+            result.collection[key] = action ? action(dic[key], key) : dic[key];
+        }
+        return result;
+    }
+    find(predicate) {
+        let result = null;
+        this.forEach((e) => {
+            if (result === null && predicate(e))
+                result = e;
+        });
+        return result;
+    }
+    has = (key) => this._keys.has(key);
+    take(key) {
+        return this._keys.has(key) ? this.collection[key] : null;
+    }
+    put(key, value) {
+        if (value == null)
+            return;
+        this.collection[key] = value;
+        this._keys.add(key);
+    }
+    rmv(key) {
+        if (!this._keys.has(key))
+            return;
+        delete this.collection[key];
+        this._keys.delete(key);
+    }
+    forEach(callback) {
+        let keys = Object.keys(this.collection);
+        for (let i = 0; i < keys.length; i++) {
+            callback(this.collection[keys[i]], i);
+        }
+    }
+}
+
 class MapRenderedEvent extends PostboyGenericMessage {
     map;
     static ID = 'b6121807-3b89-4cd3-82cf-089d2cefdc4f';
@@ -268,6 +325,22 @@ class CancelDrawingCommand extends PostboyGenericMessage {
     }
 }
 
+class DrawSelectionAreaCommand extends PostboyCallbackMessage {
+    type;
+    style;
+    ignore;
+    static ID = '573d8a0d-f25b-42b7-9ad7-0ac6d86ac362';
+    constructor(type, style, ignore = new Set()) {
+        super();
+        this.type = type;
+        this.style = style;
+        this.ignore = ignore;
+    }
+    get id() {
+        return DrawSelectionAreaCommand.ID;
+    }
+}
+
 class AddLayerCommand extends PostboyGenericMessage {
     layer;
     static ID = 'd93e250f-92bc-43ac-9c6a-46c521a1aaa5';
@@ -366,6 +439,50 @@ class DrawingFinishedEvent extends PostboyGenericMessage {
     }
 }
 
+class GenerateDrawQuery extends PostboyCallbackMessage {
+    layer;
+    style;
+    type;
+    static ID = 'f01c99ba-0953-4ab5-82f9-04e6fbb678c1';
+    constructor(layer, style, type) {
+        super();
+        this.layer = layer;
+        this.style = style;
+        this.type = type;
+    }
+    get id() {
+        return GenerateDrawQuery.ID;
+    }
+}
+
+class FilterFeaturesInAreaQuery extends PostboyCallbackMessage {
+    area;
+    features;
+    static ID = '36bb2d94-8028-4512-90dd-2386af3fc67c';
+    constructor(area, features) {
+        super();
+        this.area = area;
+        this.features = features;
+    }
+    get id() {
+        return FilterFeaturesInAreaQuery.ID;
+    }
+}
+
+class GetFeaturesInAreaQuery extends PostboyCallbackMessage {
+    area;
+    ignore;
+    static ID = 'efcf4271-a07a-40e0-9f02-d4dade40b8ac';
+    constructor(area, ignore = new Set()) {
+        super();
+        this.area = area;
+        this.ignore = ignore;
+    }
+    get id() {
+        return GetFeaturesInAreaQuery.ID;
+    }
+}
+
 class MapPostboyService extends PostboyService {
     constructor() {
         super();
@@ -381,7 +498,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
 class MapManagementService {
     postboy;
     map;
-    layers = {};
+    layers = new Dictionary();
     constructor(postboy) {
         this.postboy = postboy;
     }
@@ -393,6 +510,7 @@ class MapManagementService {
         this.observeAddTile();
         this.observeRemoveTile();
         this.observeLayerQuery();
+        this.observeFeaturesInArea();
     }
     observeRemoveTile() {
         this.postboy.subscribe(RemoveTileCommand.ID).subscribe((c) => {
@@ -402,7 +520,7 @@ class MapManagementService {
         });
     }
     observeLayerQuery() {
-        this.postboy.subscribe(GetLayerQuery.ID).subscribe((ev) => ev.finish(this.layers[ev.name] ?? null));
+        this.postboy.subscribe(GetLayerQuery.ID).subscribe((ev) => ev.finish(this.layers.take(ev.name)));
     }
     observeAddTile() {
         this.postboy.subscribe(AddTileCommand.ID).subscribe((c) => {
@@ -420,15 +538,15 @@ class MapManagementService {
         this.postboy.subscribe(AddLayerCommand.ID).subscribe((c) => {
             if (!this.map)
                 return;
-            this.layers[c.layer.get('name')] = c.layer;
+            this.layers.put(c.layer.get('name'), c.layer);
             this.map.addLayer(c.layer);
         });
     }
     observePlaceFeatures() {
         this.postboy.subscribe(PlaceLayerFeaturesCommand.ID).subscribe((c) => {
-            if (!this.layers[c.layer])
+            if (!this.layers.has(c.layer))
                 return;
-            let source = this.layers[c.layer]?.getSource();
+            let source = this.layers.take(c.layer).getSource();
             if (!!source['getSource'])
                 source = source?.getSource();
             source?.clear();
@@ -439,10 +557,32 @@ class MapManagementService {
         this.postboy.subscribe(RemoveLayerCommand.ID).subscribe((c) => {
             if (!this.map)
                 return;
-            delete this.layers[c.layer.get('name')];
+            this.layers.rmv(c.layer.get('name'));
             this.map.removeLayer(c.layer);
         });
     }
+    observeFeaturesInArea() {
+        this.postboy.subscribe(GetFeaturesInAreaQuery.ID).subscribe((qr) => {
+            let result = new Dictionary();
+            const queue = [];
+            const queries = [];
+            this.layers.forEach((l) => {
+                let layerName = l.get('name');
+                if (qr.ignore.has(layerName) || layerName === MapConstants.DrawingLayerId)
+                    return;
+                let source = l.getSource();
+                if (!!source['getSource'])
+                    source = source?.getSource();
+                const query = new FilterFeaturesInAreaQuery(qr.area, source?.getFeatures() ?? []);
+                queue.push(query.result.pipe(tap((r) => {
+                    result.put(l.get('name'), r.map((e) => ({ id: e.getId(), ...e.get(MapConstants.FeatureInfo) })));
+                })));
+                queries.push(query);
+            });
+            forkJoin(queue).subscribe(() => qr.finish(result));
+            queries.forEach((q) => this.postboy.fire(q));
+        });
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapManagementService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapManagementService });
 }
@@ -565,26 +705,46 @@ class DrawingService {
         this.postboy = postboy;
     }
     up() {
+        this.observeDrawing();
+        this.observeSelectArea();
+        this.observeMapRender();
+    }
+    observeSelectArea() {
+        this.postboy.subscribe(DrawSelectionAreaCommand.ID).subscribe((ev) => {
+            const drawingCommand = new StartDrawingCommand(ev.type, ev.style);
+            drawingCommand.result.subscribe((r) => {
+                if (!r) {
+                    ev.finish(new Dictionary());
+                    return;
+                }
+                const area = PolygonModel.fromGeoJson(1, r).feature.getGeometry();
+                const getFeaturesCommand = new GetFeaturesInAreaQuery(area, ev.ignore);
+                getFeaturesCommand.result.subscribe((result) => ev.finish(result));
+                this.postboy.fire(getFeaturesCommand);
+            });
+            this.postboy.fire(drawingCommand);
+        });
+    }
+    observeDrawing() {
         this.postboy.subscribe(StartDrawingCommand.ID).subscribe((ev) => {
             this.draw((l) => {
                 if (!l || !this.map) {
                     this.clearInteraction(l);
                     return;
                 }
-                const cancelSub = this.observeCancelation(ev, l);
-                this.drawInteraction = new Draw({
-                    source: l.getSource(),
-                    type: DrawingType[ev.type],
-                    style: ev.style,
-                });
-                this.map.addInteraction(this.drawInteraction);
-                this.drawInteraction.on('drawend', (evt) => {
-                    cancelSub.unsubscribe();
-                    this.onEnd(evt, ev, l);
+                const drawQuery = new GenerateDrawQuery(l, ev.style, ev.type);
+                drawQuery.result.subscribe((draw) => {
+                    const cancelSub = this.observeCancelation(ev, l);
+                    this.drawInteraction = draw;
+                    this.map?.addInteraction(this.drawInteraction);
+                    this.drawInteraction.on('drawend', (evt) => {
+                        cancelSub.unsubscribe();
+                        this.onEnd(evt, ev, l);
+                    });
                 });
+                this.postboy.fire(drawQuery);
             });
         });
-        this.observeMapRender();
     }
     onEnd(evt, command, layer) {
         command.finish(command.format === FeatureOutputFormat.GeoJson
@@ -625,10 +785,58 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
             type: Injectable
         }], ctorParameters: function () { return [{ type: MapPostboyService }]; } });
 
+class DrawingGenerationService {
+    postboy;
+    constructor(postboy) {
+        this.postboy = postboy;
+    }
+    up() {
+        this.postboy.subscribe(GenerateDrawQuery.ID).subscribe((ev) => {
+            ev.finish(new Draw({
+                source: ev.layer.getSource(),
+                type: DrawingType[ev.type],
+                style: ev.style,
+                geometryFunction: ev.type !== DrawingType.Circle ? undefined : createRegularPolygon(32),
+            }));
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrawingGenerationService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrawingGenerationService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrawingGenerationService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: MapPostboyService }]; } });
+
+class FeatureService {
+    postboy;
+    constructor(postboy) {
+        this.postboy = postboy;
+    }
+    up() {
+        this.postboy.subscribe(FilterFeaturesInAreaQuery.ID).subscribe((qr) => {
+            qr.finish(qr.features.filter((f) => FeatureService.booleanIntersects(qr.area, f.getGeometry())));
+        });
+    }
+    static booleanIntersects(g1, g2) {
+        if (g2.getType() === 'Point')
+            return g1.intersectsCoordinate(g2.getCoordinates());
+        if (g2.getType() === 'Circle')
+            return g1.intersectsCoordinate(g2.getCenter());
+        if (g2.getType() === 'Polygon')
+            return g1.intersectsCoordinate(g2.getInteriorPoint().getCoordinates());
+        return false;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FeatureService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FeatureService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FeatureService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: MapPostboyService }]; } });
+
 class MessageRegistratorService extends PostboyAbstractRegistrator {
-    constructor(service, management, state, feature, interaction, drawing) {
+    constructor(service, management, state, mapFeature, interaction, drawing, drawGenerator, feature) {
         super(service);
-        this.registerServices([management, state, interaction, feature, drawing]);
+        this.registerServices([management, state, interaction, mapFeature, drawing, drawGenerator, feature]);
     }
     _up() {
         this.registerReplay(MapRenderedEvent.ID);
@@ -645,13 +853,17 @@ class MessageRegistratorService extends PostboyAbstractRegistrator {
         this.registerSubject(StartDrawingCommand.ID);
         this.registerSubject(GetLayerQuery.ID);
         this.registerSubject(DrawingFinishedEvent.ID);
+        this.registerSubject(GenerateDrawQuery.ID);
+        this.registerSubject(FilterFeaturesInAreaQuery.ID);
+        this.registerSubject(GetFeaturesInAreaQuery.ID);
+        this.registerSubject(DrawSelectionAreaCommand.ID);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MessageRegistratorService, deps: [{ token: MapPostboyService }, { token: MapManagementService }, { token: MapStateService }, { token: MapFeatureService }, { token: MapClickService }, { token: DrawingService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MessageRegistratorService, deps: [{ token: MapPostboyService }, { token: MapManagementService }, { token: MapStateService }, { token: MapFeatureService }, { token: MapClickService }, { token: DrawingService }, { token: DrawingGenerationService }, { token: FeatureService }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MessageRegistratorService });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MessageRegistratorService, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: MapPostboyService }, { type: MapManagementService }, { type: MapStateService }, { type: MapFeatureService }, { type: MapClickService }, { type: DrawingService }]; } });
+        }], ctorParameters: function () { return [{ type: MapPostboyService }, { type: MapManagementService }, { type: MapStateService }, { type: MapFeatureService }, { type: MapClickService }, { type: DrawingService }, { type: DrawingGenerationService }, { type: FeatureService }]; } });
 
 class TileLayerSettings {
     maxZoom = 19;
@@ -1216,6 +1428,8 @@ class MapPlateComponent extends DestructibleComponent {
             MapClickService,
             MapFeatureService,
             DrawingService,
+            DrawingGenerationService,
+            FeatureService,
         ], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\r\n<lib-osm-tile-layer *ngIf=\"osmUrl && map\" [map]=\"map\" [url]=\"osmUrl\"></lib-osm-tile-layer>\r\n<lib-feature-layer *ngIf=\"map\" [settings]=\"drawingLayerSettings\"></lib-feature-layer>\r\n", styles: ["lib-map-plate{position:relative;display:flex;flex-direction:column;height:100%}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: OsmTileLayerComponent, selector: "lib-osm-tile-layer", inputs: ["url", "map"] }, { kind: "component", type: FeatureLayerComponent, selector: "lib-feature-layer", inputs: ["settings"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapPlateComponent, decorators: [{
@@ -1227,6 +1441,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         MapClickService,
                         MapFeatureService,
                         DrawingService,
+                        DrawingGenerationService,
+                        FeatureService,
                     ], template: "<ng-content></ng-content>\r\n<lib-osm-tile-layer *ngIf=\"osmUrl && map\" [map]=\"map\" [url]=\"osmUrl\"></lib-osm-tile-layer>\r\n<lib-feature-layer *ngIf=\"map\" [settings]=\"drawingLayerSettings\"></lib-feature-layer>\r\n", styles: ["lib-map-plate{position:relative;display:flex;flex-direction:column;height:100%}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: MapPostboyService }, { type: MapPlateFactory }, { type: MessageRegistratorService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { settings: [{
                 type: Input
@@ -1504,6 +1720,57 @@ class TextStyleHelper {
     }
 }
 
+class StringifyFeatureHelper {
+    static polygon(feature, format = FeatureOutputFormat.GeoJson) {
+        return format === FeatureOutputFormat.GeoJson
+            ? new GeoJSON().writeFeature(feature)
+            : new WKT().writeFeature(feature);
+    }
+    static circle(feature, format = FeatureOutputFormat.GeoJson) {
+        // const clone = feature.clone();
+        // clone.setGeometry(fromCircle(feature.getGeometry()! as Circle));
+        const tetemp = feature.getGeometryName();
+        const circle = feature.getGeometry();
+        // const temp = StringifyFeatureHelper.drawCircle(circle.getCenter(), circle.getRadius());
+        const ttt = feature.getGeometry().getExtent();
+        const eastPoint = [ttt[2], (ttt[1] + ttt[3]) / 2];
+        const aaa = [
+            ...transform([ttt[0], ttt[1]], 'EPSG:4326', 'EPSG:3857'),
+            ...transform([ttt[2], ttt[3]], 'EPSG:4326', 'EPSG:3857'),
+        ];
+        const radius = (aaa[2] - aaa[0]) / 2;
+        const radius2 = new LineString([circle.getCenter(), eastPoint]).getLength();
+        const polygonGeom = new Polygon(StringifyFeatureHelper.drawCircle(circle.getCenter(), radius));
+        // var edgeCoordinate = [circle.getCenter()[0] + radius, circle.getCenter()[1]];
+        // var wgs84Sphere = new Sphere(6378137);
+        return StringifyFeatureHelper.polygon(new Feature(polygonGeom), format);
+        //  const rad = circle.getRadius();
+        //  const degrees = 180 / Math.PI; // radians to degrees
+        //  const radians = Math.PI / 180; // degrees to radians
+        //  const rlat = rad * degrees * 1000;
+        //  const rlng = rad * radians;
+        //  return StringifyFeatureHelper.polygon(new Feature<Geometry>(circular(circle.getCenter(),circle.getRadius() * METERS_PER_UNIT)), format);
+    }
+    static drawCircle(point, radius) {
+        const tetetemp = transform(point, 'EPSG:4326', 'EPSG:3857');
+        // const tetetemp = point;
+        const radians = Math.PI / 180; // degrees to radians
+        const degrees = 180 / Math.PI; // radians to degrees
+        const earthsradius = 6378137.0;
+        const rlat = (radius / earthsradius) * degrees;
+        const rlng = rlat / Math.cos(tetetemp[1] * radians);
+        const extp = [];
+        for (let i = 0; i <= 32; i++) {
+            const theta = Math.PI * (i / 16);
+            extp.push([
+                tetetemp[0] + rlng * Math.cos(theta) * METERS_PER_UNIT,
+                tetetemp[1] + rlat * Math.sin(theta) * METERS_PER_UNIT,
+            ]);
+        }
+        return [extp.map((e) => transform(e, 'EPSG:3857', 'EPSG:4326'))];
+    }
+}
+
 /*
  * Public API Surface of maps
  */
@@ -1516,5 +1783,5 @@ class TextStyleHelper {
  * Generated bundle index. Do not edit.
  */
 
-export { CancelDrawingCommand, CloseTooltipCommand, ClusterLayerComponent, ClusterLayerSettings, DrawingType, FeatureLayerComponent, FeatureLayerSettings, FeatureOutputFormat, MapClickEvent, MapLyrs, MapLyrsLabel, MapModule, MapMoveEndEvent, MapPlateComponent, MapPostboyService, MapRenderedEvent, MapSettings, MarkerModel, MarkerStyleHelper, MarkersComponent, MessageRegistratorService, OsmTileLayerComponent, PolygonModel, PolygonStyleHelper, PolygonsComponent, StartDrawingCommand, TextStyleHelper, TileLayerComponent, TileLayerSettings, TooltipComponent, TooltipSettings };
+export { CancelDrawingCommand, CloseTooltipCommand, ClusterLayerComponent, ClusterLayerSettings, Dictionary, DrawSelectionAreaCommand, DrawingType, FeatureLayerComponent, FeatureLayerSettings, FeatureOutputFormat, MapClickEvent, MapLyrs, MapLyrsLabel, MapModule, MapMoveEndEvent, MapPlateComponent, MapPostboyService, MapRenderedEvent, MapSettings, MarkerModel, MarkerStyleHelper, MarkersComponent, MessageRegistratorService, OsmTileLayerComponent, PolygonModel, PolygonStyleHelper, PolygonsComponent, StartDrawingCommand, StringifyFeatureHelper, TextStyleHelper, TileLayerComponent, TileLayerSettings, TooltipComponent, TooltipSettings };
 //# sourceMappingURL=maps-components.mjs.map