@geospatial-sdk/openlayers 0.0.3-alpha.6 → 0.0.5-alpha.2

package/dist/index.d.ts

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

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../lib/index.ts"],"names":[],"mappings":"AACA,cAAc,OAAO,CAAC"}

package/dist/index.js

@@ -0,0 +1,2 @@
+// PUBLIC API
+export * from "./map";

package/dist/map/apply-context-diff.d.ts

@@ -0,0 +1,9 @@
+import Map from "ol/Map";
+import { MapContextDiff } from "@geospatial-sdk/core";
+/**
+ * Apply a context diff to an OpenLayers map
+ * @param map
+ * @param contextDiff
+ */
+export declare function applyContextDiffToMap(map: Map, contextDiff: MapContextDiff): Map;
+//# sourceMappingURL=apply-context-diff.d.ts.map

package/dist/map/apply-context-diff.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"apply-context-diff.d.ts","sourceRoot":"","sources":["../../lib/map/apply-context-diff.ts"],"names":[],"mappings":"AAAA,OAAO,GAAG,MAAM,QAAQ,CAAC;AACzB,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAGtD;;;;GAIG;AACH,wBAAgB,qBAAqB,CACnC,GAAG,EAAE,GAAG,EACR,WAAW,EAAE,cAAc,GAC1B,GAAG,CA6CL"}

package/dist/map/apply-context-diff.js

@@ -0,0 +1,43 @@
+import { createLayer } from "./create-map";
+/**
+ * Apply a context diff to an OpenLayers map
+ * @param map
+ * @param contextDiff
+ */
+export function applyContextDiffToMap(map, contextDiff) {
+    const layers = map.getLayers();
+    // removed layers (sorted by descending position)
+    if (contextDiff.layersRemoved.length > 0) {
+        const removed = contextDiff.layersRemoved.sort((a, b) => b.position - a.position);
+        for (const layerRemoved of removed) {
+            layers.item(layerRemoved.position).dispose();
+            layers.removeAt(layerRemoved.position);
+        }
+    }
+    // insert added layers
+    for (const layerAdded of contextDiff.layersAdded) {
+        const layer = createLayer(layerAdded.layer);
+        if (layerAdded.position >= layers.getLength()) {
+            layers.push(layer);
+        }
+        else {
+            layers.insertAt(layerAdded.position, layer);
+        }
+    }
+    // move reordered layers (sorted by ascending new position)
+    if (contextDiff.layersReordered.length > 0) {
+        const reordered = contextDiff.layersReordered.sort((a, b) => a.newPosition - b.newPosition);
+        const olLayers = reordered.map((layer) => layers.item(layer.previousPosition));
+        const layersArray = layers.getArray();
+        for (let i = 0; i < reordered.length; i++) {
+            layersArray[reordered[i].newPosition] = olLayers[i];
+        }
+        map.setLayers([...layersArray]);
+    }
+    // recreate changed layers
+    for (const layerChanged of contextDiff.layersChanged) {
+        layers.item(layerChanged.position).dispose();
+        layers.setAt(layerChanged.position, createLayer(layerChanged.layer));
+    }
+    return map;
+}

package/dist/map/apply-context-diff.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=apply-context-diff.test.d.ts.map

package/dist/map/apply-context-diff.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"apply-context-diff.test.d.ts","sourceRoot":"","sources":["../../lib/map/apply-context-diff.test.ts"],"names":[],"mappings":""}

package/dist/map/apply-context-diff.test.js

@@ -0,0 +1,251 @@
+import { SAMPLE_CONTEXT, SAMPLE_LAYER1, SAMPLE_LAYER2, SAMPLE_LAYER3, SAMPLE_LAYER4, SAMPLE_LAYER5, } from "@geospatial-sdk/core/fixtures/map-context.fixtures";
+import { createLayer, createMapFromContext } from "./create-map";
+import { applyContextDiffToMap } from "./apply-context-diff";
+import { beforeEach } from "vitest";
+function assertEqualsToModel(layer, layerModel) {
+    var _a;
+    const reference = createLayer(layerModel);
+    expect(reference).toBeInstanceOf(layer.constructor);
+    const refSource = reference.getSource();
+    const layerSource = layer.getSource();
+    expect(reference.getSource()).toBeInstanceOf((_a = layer.getSource()) === null || _a === void 0 ? void 0 : _a.constructor);
+    if (typeof (refSource === null || refSource === void 0 ? void 0 : refSource.getUrl) === "function") {
+        expect(layerSource === null || layerSource === void 0 ? void 0 : layerSource.getUrl).toBeTypeOf("function");
+    }
+    else if (typeof (refSource === null || refSource === void 0 ? void 0 : refSource.getUrls) !== "undefined") {
+        expect(refSource === null || refSource === void 0 ? void 0 : refSource.getUrls()).toEqual(layerSource === null || layerSource === void 0 ? void 0 : layerSource.getUrls());
+    }
+    else if (typeof (refSource === null || refSource === void 0 ? void 0 : refSource.getUrl) !== "undefined") {
+        expect(refSource === null || refSource === void 0 ? void 0 : refSource.getUrl()).toEqual(layerSource === null || layerSource === void 0 ? void 0 : layerSource.getUrl());
+    }
+}
+describe("applyContextDiffToMap", () => {
+    let context;
+    let diff;
+    let map;
+    let layersArray;
+    beforeEach(() => {
+        context = Object.assign(Object.assign({}, SAMPLE_CONTEXT), { layers: [SAMPLE_LAYER2, SAMPLE_LAYER1] });
+        map = createMapFromContext(context);
+    });
+    describe("no change", () => {
+        beforeEach(() => {
+            diff = {
+                layersAdded: [],
+                layersChanged: [],
+                layersRemoved: [],
+                layersReordered: [],
+                viewChanges: {},
+            };
+            applyContextDiffToMap(map, diff);
+            layersArray = map.getLayers().getArray();
+        });
+        it("does not affect the map", () => {
+            expect(layersArray.length).toEqual(2);
+            assertEqualsToModel(layersArray[0], SAMPLE_LAYER2);
+            assertEqualsToModel(layersArray[1], SAMPLE_LAYER1);
+        });
+    });
+    describe("layers added", () => {
+        beforeEach(() => {
+            diff = {
+                layersAdded: [
+                    {
+                        layer: SAMPLE_LAYER3,
+                        position: 0,
+                    },
+                    {
+                        layer: SAMPLE_LAYER4,
+                        position: 2,
+                    },
+                ],
+                layersChanged: [],
+                layersRemoved: [],
+                layersReordered: [],
+                viewChanges: {},
+            };
+            applyContextDiffToMap(map, diff);
+            layersArray = map.getLayers().getArray();
+        });
+        it("adds the layers to the map", () => {
+            expect(layersArray.length).toEqual(4);
+            assertEqualsToModel(layersArray[0], SAMPLE_LAYER3);
+            assertEqualsToModel(layersArray[1], SAMPLE_LAYER2);
+            assertEqualsToModel(layersArray[2], SAMPLE_LAYER4);
+            assertEqualsToModel(layersArray[3], SAMPLE_LAYER1);
+        });
+    });
+    describe("layers removed", () => {
+        beforeEach(() => {
+            diff = {
+                layersAdded: [],
+                layersChanged: [],
+                layersRemoved: [
+                    {
+                        layer: SAMPLE_LAYER2,
+                        position: 0,
+                    },
+                    {
+                        layer: SAMPLE_LAYER1,
+                        position: 1,
+                    },
+                ],
+                layersReordered: [],
+                viewChanges: {},
+            };
+            applyContextDiffToMap(map, diff);
+        });
+        it("deletes the layers", () => {
+            expect(map.getLayers().getLength()).toEqual(0);
+        });
+    });
+    describe("layers changed", () => {
+        beforeEach(() => {
+            diff = {
+                layersAdded: [],
+                layersChanged: [
+                    {
+                        layer: Object.assign(Object.assign({}, SAMPLE_LAYER2), { url: "http://changed/" }),
+                        position: 0,
+                    },
+                    {
+                        layer: Object.assign(Object.assign({}, SAMPLE_LAYER1), { url: "http://changed/", extras: {
+                                changed: true,
+                            } }),
+                        position: 1,
+                    },
+                ],
+                layersRemoved: [],
+                layersReordered: [],
+                viewChanges: {},
+            };
+            applyContextDiffToMap(map, diff);
+            layersArray = map.getLayers().getArray();
+        });
+        it("modifies the layers accordingly", () => {
+            expect(layersArray.length).toEqual(2);
+            assertEqualsToModel(layersArray[0], diff.layersChanged[0].layer);
+            assertEqualsToModel(layersArray[1], diff.layersChanged[1].layer);
+        });
+    });
+    describe("reordering", () => {
+        describe("three layers reordered", () => {
+            beforeEach(() => {
+                context = Object.assign(Object.assign({}, SAMPLE_CONTEXT), { layers: [SAMPLE_LAYER1, SAMPLE_LAYER2, SAMPLE_LAYER3] });
+                map = createMapFromContext(context);
+                diff = {
+                    layersAdded: [],
+                    layersChanged: [],
+                    layersRemoved: [],
+                    layersReordered: [
+                        {
+                            layer: SAMPLE_LAYER2,
+                            newPosition: 0,
+                            previousPosition: 1,
+                        },
+                        {
+                            layer: SAMPLE_LAYER1,
+                            newPosition: 1,
+                            previousPosition: 0,
+                        },
+                    ],
+                    viewChanges: {},
+                };
+                applyContextDiffToMap(map, diff);
+                layersArray = map.getLayers().getArray();
+            });
+            it("moves the layers accordingly", () => {
+                expect(layersArray.length).toEqual(3);
+                assertEqualsToModel(layersArray[0], SAMPLE_LAYER2);
+                assertEqualsToModel(layersArray[1], SAMPLE_LAYER1);
+                assertEqualsToModel(layersArray[2], SAMPLE_LAYER3);
+            });
+        });
+        describe("four layers reordered", () => {
+            beforeEach(() => {
+                context = Object.assign(Object.assign({}, SAMPLE_CONTEXT), { layers: [SAMPLE_LAYER1, SAMPLE_LAYER3, SAMPLE_LAYER4, SAMPLE_LAYER2] });
+                map = createMapFromContext(context);
+                diff = {
+                    layersAdded: [],
+                    layersChanged: [],
+                    layersRemoved: [],
+                    layersReordered: [
+                        {
+                            layer: SAMPLE_LAYER4,
+                            newPosition: 0,
+                            previousPosition: 2,
+                        },
+                        {
+                            layer: SAMPLE_LAYER1,
+                            newPosition: 2,
+                            previousPosition: 0,
+                        },
+                    ],
+                    viewChanges: {},
+                };
+                applyContextDiffToMap(map, diff);
+                layersArray = map.getLayers().getArray();
+            });
+            it("moves the layers accordingly", () => {
+                expect(layersArray.length).toEqual(4);
+                assertEqualsToModel(layersArray[0], SAMPLE_LAYER4);
+                assertEqualsToModel(layersArray[1], SAMPLE_LAYER3);
+                assertEqualsToModel(layersArray[2], SAMPLE_LAYER1);
+                assertEqualsToModel(layersArray[3], SAMPLE_LAYER2);
+            });
+        });
+    });
+    describe("combined changes", () => {
+        let changedLayer;
+        beforeEach(() => {
+            changedLayer = Object.assign(Object.assign({}, SAMPLE_LAYER3), { extras: { prop: true } });
+            context = Object.assign(Object.assign({}, context), { layers: [SAMPLE_LAYER1, SAMPLE_LAYER5, SAMPLE_LAYER3, SAMPLE_LAYER4] });
+            map = createMapFromContext(context);
+            diff = {
+                layersAdded: [
+                    {
+                        layer: SAMPLE_LAYER2,
+                        position: 0,
+                    },
+                ],
+                layersChanged: [
+                    {
+                        layer: changedLayer,
+                        position: 1,
+                    },
+                ],
+                layersRemoved: [
+                    {
+                        layer: SAMPLE_LAYER1,
+                        position: 0,
+                    },
+                    {
+                        layer: SAMPLE_LAYER4,
+                        position: 3,
+                    },
+                ],
+                layersReordered: [
+                    {
+                        layer: changedLayer,
+                        newPosition: 1,
+                        previousPosition: 2,
+                    },
+                    {
+                        layer: SAMPLE_LAYER5,
+                        newPosition: 2,
+                        previousPosition: 1,
+                    },
+                ],
+                viewChanges: {},
+            };
+            applyContextDiffToMap(map, diff);
+            layersArray = map.getLayers().getArray();
+        });
+        it("applies all changes", () => {
+            expect(layersArray.length).toEqual(3);
+            assertEqualsToModel(layersArray[0], SAMPLE_LAYER2);
+            assertEqualsToModel(layersArray[1], changedLayer);
+            assertEqualsToModel(layersArray[2], SAMPLE_LAYER5);
+        });
+    });
+});

package/dist/map/create-map.d.ts

@@ -0,0 +1,19 @@
+import { MapContext, MapContextLayer, MapContextView } from "@geospatial-sdk/core";
+import Map from "ol/Map";
+import View from "ol/View";
+import Layer from "ol/layer/Layer";
+export declare function createLayer(layerModel: MapContextLayer): Layer;
+export declare function createView(viewModel: MapContextView, map: Map): View;
+/**
+ * Create an OpenLayers map from a context; optionally specify a target (root element) for the map
+ * @param context
+ * @param target
+ */
+export declare function createMapFromContext(context: MapContext, target?: string | HTMLElement): Map;
+/**
+ * Resets an OpenLayers map from a context; existing content will be cleared
+ * @param map
+ * @param context
+ */
+export declare function resetMapFromContext(map: Map, context: MapContext): Map;
+//# sourceMappingURL=create-map.d.ts.map

package/dist/map/create-map.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"create-map.d.ts","sourceRoot":"","sources":["../../lib/map/create-map.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EACV,eAAe,EACf,cAAc,EACf,MAAM,sBAAsB,CAAC;AAC9B,OAAO,GAAG,MAAM,QAAQ,CAAC;AACzB,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,KAAK,MAAM,gBAAgB,CAAC;AAgBnC,wBAAgB,WAAW,CAAC,UAAU,EAAE,eAAe,GAAG,KAAK,CAkF9D;AAED,wBAAgB,UAAU,CAAC,SAAS,EAAE,cAAc,EAAE,GAAG,EAAE,GAAG,GAAG,IAAI,CAmBpE;AAED;;;;GAIG;AACH,wBAAgB,oBAAoB,CAClC,OAAO,EAAE,UAAU,EACnB,MAAM,CAAC,EAAE,MAAM,GAAG,WAAW,GAC5B,GAAG,CAKL;AAED;;;;GAIG;AACH,wBAAgB,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE,OAAO,EAAE,UAAU,GAAG,GAAG,CAKtE"}

package/dist/map/create-map.js

@@ -0,0 +1,138 @@
+import Map from "ol/Map";
+import View from "ol/View";
+import TileLayer from "ol/layer/Tile";
+import XYZ from "ol/source/XYZ";
+import TileWMS from "ol/source/TileWMS";
+import VectorLayer from "ol/layer/Vector";
+import VectorSource from "ol/source/Vector";
+import GeoJSON from "ol/format/GeoJSON";
+import { fromLonLat } from "ol/proj";
+import { bbox as bboxStrategy } from "ol/loadingstrategy";
+import { removeSearchParams } from "@geospatial-sdk/core";
+import { defaultStyle } from "./styles";
+const geosjonFormat = new GeoJSON();
+export function createLayer(layerModel) {
+    const { type } = layerModel;
+    const style = defaultStyle;
+    switch (type) {
+        case "xyz":
+            return new TileLayer({
+                source: new XYZ({
+                    url: layerModel.url,
+                }),
+            });
+        case "wms":
+            return new TileLayer({
+                source: new TileWMS({
+                    url: removeSearchParams(layerModel.url, ["request", "service"]),
+                    params: { LAYERS: layerModel.name },
+                    gutter: 20,
+                }),
+            });
+        // TODO: implement when ogc-client can handle wmts
+        // case 'wmts':
+        //   return new TileLayer({
+        //     source: new WMTS(layerModel.options),
+        //   })
+        case "wfs":
+            return new VectorLayer({
+                source: new VectorSource({
+                    format: new GeoJSON(),
+                    url: function (extent) {
+                        const urlObj = new URL(removeSearchParams(layerModel.url, [
+                            "service",
+                            "version",
+                            "request",
+                        ]));
+                        urlObj.searchParams.set("service", "WFS");
+                        urlObj.searchParams.set("version", "1.1.0");
+                        urlObj.searchParams.set("request", "GetFeature");
+                        urlObj.searchParams.set("outputFormat", "application/json");
+                        urlObj.searchParams.set("typename", layerModel.featureType);
+                        urlObj.searchParams.set("srsname", "EPSG:3857");
+                        urlObj.searchParams.set("bbox", `${extent.join(",")},EPSG:3857`);
+                        return urlObj.toString();
+                    },
+                    strategy: bboxStrategy,
+                }),
+                style,
+            });
+        case "geojson": {
+            if (layerModel.url !== undefined) {
+                return new VectorLayer({
+                    source: new VectorSource({
+                        format: new GeoJSON(),
+                        url: layerModel.url,
+                    }),
+                    style,
+                });
+            }
+            else {
+                let geojson = layerModel.data;
+                if (typeof geojson === "string") {
+                    try {
+                        geojson = JSON.parse(geojson);
+                    }
+                    catch (e) {
+                        console.warn("A layer could not be created", layerModel, e);
+                        geojson = { type: "FeatureCollection", features: [] };
+                    }
+                }
+                const features = geosjonFormat.readFeatures(geojson, {
+                    featureProjection: "EPSG:3857",
+                    dataProjection: "EPSG:4326",
+                });
+                return new VectorLayer({
+                    source: new VectorSource({
+                        features,
+                    }),
+                    style,
+                });
+            }
+        }
+        default:
+            throw new Error(`Unrecognized layer type: ${layerModel.type}`);
+    }
+}
+export function createView(viewModel, map) {
+    const { center: centerInViewProj, zoom, maxZoom, maxExtent } = viewModel;
+    const center = centerInViewProj
+        ? fromLonLat(centerInViewProj, "EPSG:3857")
+        : [0, 0];
+    const view = new View({
+        center,
+        zoom: zoom !== null && zoom !== void 0 ? zoom : 0,
+        maxZoom,
+        extent: maxExtent,
+        multiWorld: false,
+        constrainResolution: true,
+    });
+    if (viewModel.extent) {
+        view.fit(viewModel.extent, {
+            size: map.getSize(),
+        });
+    }
+    return view;
+}
+/**
+ * Create an OpenLayers map from a context; optionally specify a target (root element) for the map
+ * @param context
+ * @param target
+ */
+export function createMapFromContext(context, target) {
+    const map = new Map({
+        target,
+    });
+    return resetMapFromContext(map, context);
+}
+/**
+ * Resets an OpenLayers map from a context; existing content will be cleared
+ * @param map
+ * @param context
+ */
+export function resetMapFromContext(map, context) {
+    map.setView(createView(context.view, map));
+    map.getLayers().clear();
+    context.layers.forEach((layer) => map.addLayer(createLayer(layer)));
+    return map;
+}

package/dist/map/create-map.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=create-map.test.d.ts.map

package/dist/map/create-map.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"create-map.test.d.ts","sourceRoot":"","sources":["../../lib/map/create-map.test.ts"],"names":[],"mappings":""}