@masterportal/masterportalapi 2.12.0 → 2.14.0

package/.eslintrc

@@ -3,7 +3,8 @@
         // browser global variables
         "browser": true,
         "node": true,
-        "es6": true
+        "es6": true,
+        "jest": true
     },
     "globals": {
         "Cesium": true

package/CHANGELOG.md

@@ -3,8 +3,26 @@
 
  The [Semantic Versioning](https://semver.org/spec/v2.0.0.html) is used.
 
+## 2.14.0 - 2023-02-22
+### Added
+- VectorStyle is now part of the masterportalApi.
+- The following packages have been installed:
+    - use-resize-observer: 9.1.0
+
+### Changed
+- The following packages have been updated:
+    - dependencies:
+        - ol: 7.1.0 to 7.2.2
+
+---
+
+## 2.13.0 - 2023-02-16
+### Changed
+- GeoJSON now also register a featuresloadend function if the source is a cluster.
+
+---
 
-## 2.12.0 - 2022-01-24
+## 2.12.0 - 2023-01-24
 ### Added
 - Added support for Node LTS version 18.
 - Add possibility to specify additional layerparams for a wmts layer, like opacity for example.

package/example/config/portal.json

@@ -29,7 +29,14 @@
   "layers": [
     {
       "id": "1001"
+    },
+    {
+      "id": "8712",
+      "name": "Schulinfosystem",
+      "styleId": "8712",
+      "typ": "WFS"
     }
   ],
-  "cesiumLib":"https://geoportal-hamburg.de/mastercode/cesium/1_99/Cesium.js"
+  "cesiumLib":"https://geoportal-hamburg.de/mastercode/cesium/1_99/Cesium.js",
+  "wfsImgPath": "https://geodienste.hamburg.de/lgv-config/img/"
 }

package/example/config/services.json

@@ -113,6 +113,16 @@
       "anzahl_schueler": ">1000"
     }
   },
+  {
+    "id": "8712",
+    "name": "de.hh.up:staatliche schulen",
+    "url": "https://geodienste.hamburg.de/HH_WFS_Schulen",
+    "typ": "WFS",
+    "featureType": "staatliche_schulen",
+    "outputFormat": "XML",
+    "version": "1.1.0",
+    "featureNS": "https://registry.gdi-de.org/id/de.hh.up"
+  },
   {
     "id": "6001",
     "name": "ADV (EPSG:25832)",

package/example/index.js

@@ -5,6 +5,8 @@ import {Style, Stroke, Fill, Icon} from "ol/style.js";
 import * as mpapi from "../src";
 import mapsAPI from "../src/maps/api.js";
 import rawLayerList from "../src/rawLayerList";
+import styleList from "../src/vectorStyle/styleList";
+import createStyle from "../src/vectorStyle/createStyle";
 
 import services from "./config/services.json";
 import portalConfig from "./config/portal.json";
@@ -31,7 +33,25 @@ const hamburgServicesUrl = "https://geodienste.hamburg.de/services-internet.json
     },
     config = {
         ...portalConfig,
-        layerConf: services
+        layerConf: services,
+        styleConf: "https://geodienste.hamburg.de/lgv-config/style_v3.json"
+    },
+    // eslint-disable-next-line func-style
+    getWfsStyleFunction = function () {
+        const styleId = "8712",
+            olLayer = window.mpapi.map.getLayers().getArray().find((element) => element.get("id") === "8712"),
+            source = olLayer.getSource(),
+            styleObject = styleList.returnStyleObject(styleId);
+        let isClusterFeature = false;
+
+        if (styleObject !== undefined) {
+            source.on("featuresloadend", event => {
+                event.features.forEach(element => {
+                    isClusterFeature = false;
+                    element.setStyle(createStyle.createStyle(styleObject, element, isClusterFeature, config.wfsImgPath));
+                });
+            });
+        }
     };
 let map2D = null;
 
@@ -237,4 +257,16 @@ map2D.getLayers().forEach(layer => {
 window.mpapi.map.addLayer("7001");
 window.mpapi.map.addLayer("7002");
 window.mpapi.map.addLayer("7003");
-// */
+*/
+
+/* VectorStyle example */
+// Example for using the vectorStyle that is now implemented in the masterportalAPI.
+// Hardcoded to show the school layer "8712" as a wfs.
+// For better visibility adding of the other layers, especially "5001", should be commented out.
+styleList.initializeStyleList({}, config, config.layers, undefined, (initializedStyleList, error) => {
+    if (error) {
+        console.error("Die Datei " + config.styleConf + " konnte nicht geladen werden!");
+    }
+    return initializedStyleList;
+});
+getWfsStyleFunction();

package/jest.config.js

@@ -3,7 +3,7 @@ module.exports = {
     /** ol prints errors without HTMLCanvasElement being available in test environment */
     "setupFiles": ["jest-canvas-mock"],
     /** node_modules are usually ignored by babel-jest, but ol is published in ES6 */
-    "transformIgnorePatterns": ["/node_modules/(?!(ol|olcs|ol-mapbox-style|geotiff)/).*/"],
+    "transformIgnorePatterns": ["/node_modules/(?!(ol|olcs|ol-mapbox-style|geotiff|quick-lru)/).*/"],
     /** only consider files in src/ for coverage */
     "collectCoverageFrom": ["src/**/*.js"],
     /** coverage reporters */

package/jest.setup.js

@@ -2,4 +2,12 @@ import "regenerator-runtime/runtime";
 
 window.URL.createObjectURL = function () {
     // empty
-};
+};
+
+window.ResizeObserver =
+    window.ResizeObserver ||
+    jest.fn().mockImplementation(() => ({
+        disconnect: jest.fn(),
+        observe: jest.fn(),
+        unobserve: jest.fn()
+    }));

package/package.json

@@ -1,63 +1,63 @@
-{
-  "name": "@masterportal/masterportalapi",
-  "author": "Implementierungspartnerschaft Masterportal <info@masterportal.org> (https://www.masterportal.org)",
-  "version": "2.12.0",
-  "license": "MIT",
-  "description": "Basic functions of the Masterportal as api",
-  "repository": {
-    "type": "git",
-    "url": "git+https://bitbucket.org/geowerkstatt-hamburg/masterportalapi.git"
-  },
-  "main": "src/index.js",
-  "scripts": {
-    "test": "jest .test.js --config ./jest.config.js --collectCoverage",
-    "test:trace": "node --trace-warnings node_modules/jest/bin/jest.js ./test/layer/wfs.test.js --config ./jest.config.js",
-    "test:watch": "jest .test.js --config ./jest.config.js --watch",
-    "example": "parcel example/index.html",
-    "generate-jsdoc": "jsdoc ./src -r -d ./docs/ -R ./README.md -c jsdoc.json",
-    "prePushHook": "eslint --max-warnings 0 \"./**/*.js\" && npm run test",
-    "prepare": "husky install"
-  },
-  "dependencies": {
-    "core-js": "^3.27.1",
-    "ol": "7.1.0",
-    "olcs": "^2.13.1",
-    "proj4": "^2.8.1",
-    "xml2js": "^0.4.23"
-  },
-  "devDependencies": {
-    "@babel/core": "^7.20.12",
-    "@babel/plugin-transform-modules-commonjs": "^7.20.11",
-    "@parcel/transformer-sass": "^2.6.0",
-    "buffer": "^6.0.3",
-    "canvas": "^2.11.0",
-    "eslint": "^8.31.0",
-    "events": "^3.3.0",
-    "husky": "^8.0.3",
-    "jest": "^29.3.1",
-    "jest-canvas-mock": "^2.4.0",
-    "jest-environment-jsdom": "^29.3.1",
-    "jsdoc": "^4.0.0",
-    "parcel": "^2.6.0",
-    "process": "^0.11.10",
-    "sass": "^1.57.1",
-    "stream-browserify": "^3.0.0",
-    "timers-browserify": "^2.0.12"
-  },
-  "peerDependencies": {
-    "cesium": "^1.95.0"
-  },
-  "engines": {
-    "node": "^16.13.2 || ^18.12.0",
-    "npm": "^8.1.2"
-  },
-  "homepage": "https://bitbucket.org/geowerkstatt-hamburg/masterportalapi#readme",
-  "directories": {
-    "doc": "docs",
-    "example": "example",
-    "test": "test"
-  },
-  "bugs": {
-    "url": "https://bitbucket.org/geowerkstatt-hamburg/masterportalapi/issues"
-  }
-}
+{
+  "name": "@masterportal/masterportalapi",
+  "author": "Implementierungspartnerschaft Masterportal <info@masterportal.org> (https://www.masterportal.org)",
+  "version": "2.14.0",
+  "license": "MIT",
+  "description": "Basic functions of the Masterportal as api",
+  "repository": {
+    "type": "git",
+    "url": "git+https://bitbucket.org/geowerkstatt-hamburg/masterportalapi.git"
+  },
+  "main": "src/index.js",
+  "scripts": {
+    "test": "jest .test.js --config ./jest.config.js --collectCoverage",
+    "test:trace": "node --trace-warnings node_modules/jest/bin/jest.js ./test/layer/wfs.test.js --config ./jest.config.js",
+    "test:watch": "jest .test.js --config ./jest.config.js --watch",
+    "example": "parcel example/index.html",
+    "generate-jsdoc": "jsdoc ./src -r -d ./docs/ -R ./README.md -c jsdoc.json",
+    "prePushHook": "eslint --max-warnings 0 \"./**/*.js\" && npm run test",
+    "prepare": "husky install"
+  },
+  "dependencies": {
+    "core-js": "^3.27.1",
+    "ol": "7.2.2",
+    "olcs": "^2.13.1",
+    "proj4": "^2.8.1",
+    "xml2js": "^0.4.23"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.20.12",
+    "@babel/plugin-transform-modules-commonjs": "^7.20.11",
+    "@parcel/transformer-sass": "^2.6.0",
+    "buffer": "^6.0.3",
+    "canvas": "^2.11.0",
+    "eslint": "^8.31.0",
+    "events": "^3.3.0",
+    "husky": "^8.0.3",
+    "jest": "^29.3.1",
+    "jest-canvas-mock": "^2.4.0",
+    "jest-environment-jsdom": "^29.3.1",
+    "jsdoc": "^4.0.0",
+    "parcel": "^2.6.0",
+    "process": "^0.11.10",
+    "sass": "^1.57.1",
+    "stream-browserify": "^3.0.0",
+    "timers-browserify": "^2.0.12",
+    "use-resize-observer": "^9.1.0"
+  },
+  "peerDependencies": {
+    "cesium": "^1.95.0"
+  },
+  "engines": {
+    "node": "^16.13.2 || ^18.12.0",
+    "npm": "^8.1.2"
+  },
+  "homepage": "https://bitbucket.org/geowerkstatt-hamburg/masterportalapi#readme",
+  "directories": {
+    "example": "example",
+    "test": "test"
+  },
+  "bugs": {
+    "url": "https://bitbucket.org/geowerkstatt-hamburg/masterportalapi/issues"
+  }
+}

package/src/layer/geojson/index.js

@@ -22,11 +22,11 @@ export function createLayerSource ({url, features, clusterDistance}, options) {
 
     source = createVectorSource(url || features, options.loadingStrategy, format);
 
-    if (clusterDistance) {
-        return createClusterVectorSource(source, clusterDistance, options.clusterGeometryFunction);
+    if (typeof clusterDistance === "number") {
+        source = createClusterVectorSource(source, clusterDistance, options.clusterGeometryFunction);
     }
 
-    source.once("featuresloadend", event => {
+    (typeof clusterDistance === "number" ? source.getSource() : source).once("featuresloadend", event => {
         if (typeof options.afterLoading === "function") {
             options.afterLoading(event?.features);
         }

package/src/lib/attributeMapper.js

@@ -0,0 +1,231 @@
+import {getValueFromObjectByPath} from "./getValueFromObjectByPath.js";
+import thousandsSeparator from "./thousandsSeparator";
+/**
+ * checks if value starts with special prefix to determine if value is a object path
+ * @param   {string} value string to check
+ * @returns {Boolean} true is value is an object path
+ */
+function isObjectPath (value) {
+    return typeof value === "string" && value.startsWith("@");
+}
+/**
+ * Returns the value of the given key. Also considers, that the key may be an object path.
+ * @param {Object} properties properties.
+ * @param {String} key Key to derive value from.
+ * @returns {*} - Value from key.
+ */
+function prepareValue (properties, key) {
+    const isPath = isObjectPath(key);
+    let value = properties[Object.keys(properties).find(propertiesKey => propertiesKey.toLowerCase() === key.toLowerCase())];
+
+    if (isPath) {
+        value = getValueFromObjectByPath(properties, key);
+    }
+    return value;
+}
+
+/**
+ * Parsing the boolean value
+ * @param {String} value default value
+ * @param {String|Object} format the format of boolean value
+* @returns {String} - original value or parsed value
+ */
+function getBooleanValue (value, format) {
+    let parsedValue = String(value);
+
+    if (Object.prototype.hasOwnProperty.call(format, value)) {
+        // TODO: check if true -> translation is dismissed because i18next does not exist in masterportalApi
+        parsedValue = format[value];
+
+    }
+    return parsedValue;
+}
+
+/**
+ * Appends a suffix if available.
+ * @param {*} value Value to append suffix.
+ * @param {String} suffix Suffix
+ * @returns {String} - Value with suffix.
+ */
+function appendSuffix (value, suffix) {
+    let valueWithSuffix = value;
+
+    if (suffix) {
+        valueWithSuffix = String(valueWithSuffix) + " " + suffix;
+    }
+    return valueWithSuffix;
+}
+
+/**
+ * Prepend a prefix if available.
+ * @param {*} value Value to prepend prefix.
+ * @param {String} prefix Prefix
+ * @returns {String} - Value with prefix.
+ */
+function prependPrefix (value, prefix) {
+    let valueWithPrefix = value;
+
+    if (prefix) {
+        valueWithPrefix = prefix + String(valueWithPrefix);
+    }
+    return valueWithPrefix;
+}
+
+/**
+ * Derives the value from the given condition.
+ * @param {String} key Key.
+ * @param {String} condition Condition to filter.
+ * @param {Object} properties Properties.
+ * @returns {*} - Value that matches the given condition.
+ */
+function getValueFromCondition (key, condition, properties) {
+    let valueFromCondition,
+        match;
+
+    if (condition === "contains") {
+        match = Object.keys(properties).filter(key2 => {
+            return key2.includes(key);
+        })[0];
+        valueFromCondition = properties[match];
+    }
+    else if (condition === "startsWith") {
+        match = Object.keys(properties).filter(key2 => {
+            return key2.startsWith(key);
+        })[0];
+        valueFromCondition = properties[match];
+    }
+    else if (condition === "endsWith") {
+        match = Object.keys(properties).filter(key2 => {
+            return key2.endsWith(key);
+        })[0];
+        valueFromCondition = properties[match];
+    }
+    else {
+        valueFromCondition = properties[key];
+    }
+
+    return valueFromCondition;
+
+}
+
+/**
+ * Derives the gfi value if the value is an object.
+ * @param {*} key Key of Attribute.
+ * @param {Object} mappingObj Value of attribute.
+ * @param {Object} properties object.
+ * @returns {*} - Prepared Value
+ */
+function prepareValueFromObject (key, mappingObj, properties) {
+    const type = mappingObj?.type ? mappingObj.type : "string",
+        condition = mappingObj?.condition ? mappingObj.condition : null;
+    let preparedValue = prepareValue(properties, key),
+        format = mappingObj?.format ? mappingObj.format : "YYYY-MM-DDTHH:mm:ss.SSSZ",
+        date;
+
+    if (condition) {
+        preparedValue = getValueFromCondition(key, condition, properties);
+    }
+    switch (type) {
+        case "date": {
+            date = new Date(String(preparedValue));
+            if (!isNaN(date.getTime())) {
+                const year = date.getFullYear(),
+                    month = ("0" + (date.getMonth() + 1)).slice(-2),
+                    day = ("0" + date.getDate()).slice(-2);
+
+                if (format === "YYYY-MM-DDTHH:mm:ss.SSSZ") {
+                    const offset = date.getTimezoneOffset();
+
+                    let offsetHours = (offset / 60) % 24,
+                        offsetMinutes = offset % 60;
+
+                    offsetHours = offsetHours < 0 ? "+" + ("0" + Math.abs(offsetHours)).slice(-2) : "-" + ("0" + Math.abs(offsetHours)).slice(-2);
+                    offsetMinutes = offsetMinutes < 0 ? ":" + ("0" + Math.abs(offsetMinutes)).slice(-2) : ":" + ("0" + offsetMinutes).slice(-2);
+                    preparedValue = date.toISOString().slice(0, -1) + offsetHours + offsetMinutes;
+                }
+                else if (format === "YYYY-MM-DD") {
+                    preparedValue = year + "-" + month + "-" + day;
+                }
+                else if (format === "DD-MM-YYYY") {
+                    preparedValue = day + "-" + month + "-" + year;
+                }
+                else {
+                    console.error("The format must be 'YYYY-MM-DD' or 'DD-MM-YYYY', if the attribute is missing, ISO 8601 is used.");
+                }
+            }
+            break;
+        }
+        case "number": {
+            preparedValue = thousandsSeparator(preparedValue);
+            break;
+        }
+        case "linechart": {
+            preparedValue = Object.assign({
+                name: key,
+                staObject: preparedValue
+            }, mappingObj);
+            break;
+        }
+        case "boolean": {
+            format = format === "DD.MM.YYYY HH:mm:ss" ? {true: "true", false: "false"} : format;
+            preparedValue = getBooleanValue(preparedValue, format);
+            break;
+        }
+        // default equals to mappingObj.type === "string"
+        default: {
+            preparedValue = String(preparedValue);
+        }
+    }
+    if (preparedValue && mappingObj.suffix && preparedValue !== "undefined") {
+        preparedValue = appendSuffix(preparedValue, mappingObj.suffix);
+    }
+    if (preparedValue && mappingObj.prefix && preparedValue !== "undefined") {
+        preparedValue = prependPrefix(preparedValue, mappingObj.prefix);
+    }
+    return preparedValue;
+}
+
+/**
+ * Maps the feature properties by the given object.
+ * @param {Object} properties The feature properties.
+ * @param {Object} mappingObject Object to me mapped.
+ * @param {Boolean} [isNested=true] Flag if Object is nested, like "gfiAttributes".
+ * @returns {Object} The mapped properties.
+ */
+function mapAttributes (properties, mappingObject, isNested = true) {
+    let mappedProperties;
+
+    if (!mappingObject) {
+        return false;
+    }
+    if (!isNested) {
+        if (typeof mappingObject === "string") {
+            mappedProperties = prepareValue(properties, mappingObject);
+        }
+        else {
+            mappedProperties = prepareValueFromObject(mappingObject.name, mappingObject, properties);
+        }
+    }
+    else {
+        mappedProperties = {};
+        Object.keys(mappingObject).forEach(key => {
+            let newKey = mappingObject[key],
+                value = prepareValue(properties, key);
+
+            if (typeof newKey === "object") {
+                value = prepareValueFromObject(key, newKey, properties);
+                newKey = newKey.name;
+            }
+            if (value && value !== "undefined") {
+                mappedProperties[newKey] = value;
+            }
+        });
+    }
+    return mappedProperties;
+}
+
+export {
+    mapAttributes,
+    isObjectPath,
+    prepareValue
+};

package/src/lib/getValueFromObjectByPath.js

@@ -0,0 +1,73 @@
+/**
+ * gets the parts of the given path splitted by ".", ignoring escaped "."
+ * @param {String} path the path to split
+ * @param {String} [delimitor="."] the delimitor to use
+ * @returns {String[]} the resulting parts of the path
+ */
+function getPathPartsFromPath (path, delimitor = ".") {
+    const len = path.length,
+        result = [];
+    let letter = "",
+        word = "";
+
+    for (let i = 0; i < len; i++) {
+        letter = path[i];
+
+        if (letter === "\\") {
+            i++;
+            letter = path[i];
+        }
+        else if (letter === delimitor) {
+            result.push(word);
+            word = "";
+            continue;
+        }
+        word += letter;
+    }
+
+    if (word) {
+        result.push(word);
+    }
+    return result;
+}
+/**
+ * uses the given path to go into the given object and returns the value found at the end
+ * @info arrays can be accessed by using a number as index (e.g. "@Test.0.test")
+ * @param {Object} obj an object or array to search through
+ * @param {String} path the path to follow through the given object
+ * @param {String} [prefix="@"] the prefix to use to recognize the string as path to follow
+ * @param {String} [delimitor="."] the delimitor to use
+ * @param {Number} [depthBarrier=20] the depth barrier to avoid infinit recurtions
+ * @returns {*} any value found at the end or undefined if nothing was found
+ */
+function getValueFromObjectByPath (obj, path, prefix = "@", delimitor = ".", depthBarrier = 20) {
+    if (
+        typeof obj !== "object"
+        || obj === null
+        || typeof path !== "string"
+        || (
+            typeof prefix === "string"
+            && path.substr(0, prefix.length) !== prefix
+        )
+    ) {
+        return undefined;
+    }
+    const pathParts = getPathPartsFromPath(typeof prefix === "string" ? path.substring(prefix.length) : path, delimitor),
+        len = pathParts.length;
+    let value = obj,
+        depth = 0;
+
+    for (let i = 0; i < len; i++) {
+        if (typeof value !== "object" || value === null) {
+            return undefined;
+        }
+        value = value[pathParts[i]];
+        depth++;
+        if (typeof value === "undefined" || depth > depthBarrier) {
+            return undefined;
+        }
+    }
+    return value;
+}
+
+export {getValueFromObjectByPath, getPathPartsFromPath};

package/src/lib/thousandsSeparator.js

@@ -0,0 +1,23 @@
+
+/**
+ * adds thousands seperators into a number and changes the decimal point
+ * @param {(Number|String)} num the number as number or string
+ * @param {String} [delimAbs="."] the letter(s) to use as thousand point
+ * @param {String} [delimDec=","] the letter(s) to use as decimal point
+ * @returns {String}  the given number with thousands seperators or an empty string if any invalid num was given
+ */
+function thousandsSeparator (num, delimAbs = ".", delimDec = ",") {
+    if (typeof num !== "number" && typeof num !== "string") {
+        return "";
+    }
+
+    const value = typeof num !== "string" ? num.toString() : num,
+        decPointPos = value.indexOf("."),
+        abs = decPointPos > -1 ? value.substring(0, decPointPos) : value,
+        result = abs.replace(/\B(?=(\d{3})+(?!\d),?.*)/g, delimAbs),
+        dec = decPointPos > -1 ? value.substring(decPointPos + 1) : false;
+
+    return dec ? result + delimDec + dec : result;
+}
+
+export default thousandsSeparator;

package/src/maps/olcs/3dUtils/wmsRasterSynchronizer.js

@@ -118,6 +118,9 @@ class WMSRasterSynchronizer extends olcsAbstractSynchronizer {
             provider = this.createProviderForStaticImageSource(source);
         }
         else if (source instanceof WMTS) {
+            if (typeof source.getUrls !== "function" || !Array.isArray(source.getUrls())) {
+                return null;
+            }
             provider = new Cesium.WebMapTileServiceImageryProvider({
                 url: source.getUrls()[0],
                 format: source.getFormat(),