@masterportal/masterportalapi 2.12.0 → 2.14.0

package/src/vectorStyle/styles/styleText.js

@@ -0,0 +1,143 @@
+import StyleClass from "./style";
+import {Text, Fill, Stroke} from "ol/style.js";
+import {mapAttributes} from "../../lib/attributeMapper";
+import {prepareValue, isObjectPath} from "../../lib/attributeMapper";
+import defaultStyle from "./defaultStyles";
+
+class TextStyle extends StyleClass {
+    /**
+     * @description Class to create ol.style/Text
+     * @class TextStyle
+     * @constructor
+     * @extends StyleClass
+     * @memberof VectorStyle.Style
+     */
+    constructor () {
+        super();
+        this.attributes = {...defaultStyle.text};
+    }
+
+    /**
+    * This function initializes the styleText Object by setting or overwriting some attributes.
+    * @param {ol/feature} feature Feature to be styled.
+    * @param {object} styles styling properties to overwrite defaults
+    * @param {Boolean} isClustered Flag to show if feature is clustered.
+    * @returns {void}
+    */
+    initialize (feature, styles, isClustered) {
+        this.setFeature(feature);
+        this.setIsClustered(isClustered);
+        this.overwriteStyling(styles);
+        this.setStyle(this.getStyle());
+    }
+
+    /**
+    * This function returns a style for each feature.
+    * @returns {ol/style} - The created style.
+    */
+    getStyle () {
+        const isClustered = this.isClustered,
+            feature = this.feature,
+            labelField = this.labelField;
+
+        if (isClustered && feature.get("features")?.length > 1 && this.attributes.clusterTextType !== "none") {
+            return this.createClusteredTextStyle();
+        }
+        else if (labelField) {
+            return this.createLabeledTextStyle();
+        }
+
+        return new Text();
+    }
+
+    /**
+     * Returns the rotation value and its corresponding value according to style.json.
+     * @param {Object} rotation - The rotation object from the style.json
+     * @param {Object} featureValues - The values object from the feature
+     * @returns {number} - The rotation value in degrees or radiants.
+     */
+    getRotationValue (rotation, featureValues) {
+        if (typeof rotation === "object") {
+            const {value, isDegree} = rotation;
+
+            if (isObjectPath(value) && featureValues !== undefined) {
+                const rotationValueFromService = parseInt(prepareValue(featureValues, value), 10);
+
+                return isDegree ? rotationValueFromService * Math.PI / 180 : rotationValueFromService;
+            }
+            return isDegree ? parseInt(value, 10) * Math.PI / 180 : parseInt(value, 10);
+        }
+        return 0;
+    }
+
+    /**
+    * Creates text style for clustered features. The text attribute is set according to "clusterTextType".
+    * "clusterTextType" === "counter" sets the number of clustered features.
+    * "clusterTextType" === "text" sets the value of "clusterText" or "undefined".
+    * @returns {ol/style/Text} - The created style.
+    */
+    createClusteredTextStyle () {
+        const feature = this.feature;
+        let text;
+
+        if (this.attributes.clusterTextType === "counter") {
+            text = feature.get("features").length.toString();
+        }
+        else if (this.attributes.clusterTextType === "text" && typeof this.attributes.clusterText === "string") {
+            text = this.attributes.clusterText;
+        }
+        else {
+            text = "undefined";
+        }
+
+        return new Text({
+            text: text,
+            textAlign: this.attributes.clusterTextAlign,
+            offsetX: this.attributes.clusterTextOffsetX,
+            offsetY: this.attributes.clusterTextOffsetY,
+            font: this.attributes.clusterTextFont,
+            scale: this.attributes.clusterTextScale,
+            fill: new Fill({
+                color: this.attributes.clusterTextFillColor
+            }),
+            stroke: new Stroke({
+                color: this.attributes.clusterTextStrokeColor,
+                width: this.attributes.clusterTextStrokeWidth
+            }),
+            rotation: this.getRotationValue(this.attributes.rotation, feature.getProperties())
+        });
+    }
+
+    /**
+    * Creates text style for simple features. The text attribute is set using "labelField".
+    * @returns {ol/style/Text} - The created style.
+    */
+    createLabeledTextStyle () {
+        const feature = this.feature,
+            featureProperties = feature.getProperties(),
+            textSuffix = this.attributes.textSuffix;
+        let text = mapAttributes(featureProperties, this.attributes.labelField, false);
+
+        if (textSuffix !== "") {
+            text = text + " " + textSuffix;
+        }
+        return new Text({
+            text: text.toString(),
+            textAlign: this.attributes.textAlign,
+            offsetX: this.attributes.textOffsetX,
+            offsetY: this.attributes.textOffsetY,
+            font: this.attributes.textFont,
+            scale: this.attributes.textScale,
+            fill: new Fill({
+                color: this.attributes.textFillColor
+            }),
+            stroke: new Stroke({
+                color: this.attributes.textStrokeColor,
+                width: this.attributes.textStrokeWidth
+            }),
+            rotation: this.getRotationValue(this.attributes.rotation, featureProperties)
+        });
+    }
+}
+
+export default TextStyle;

package/test/lib/attributeMapper.test.js

@@ -0,0 +1,290 @@
+import {mapAttributes, isObjectPath} from "../../src/lib/attributeMapper";
+
+const props = {
+    random_text: "foobar",
+    random_boolean: true,
+    random_int: 12345,
+    random_float: 1.23,
+    random_date: "2021-11-17 13:02:00 UTC",
+    random_datastreams: [
+        {
+            Observations: [
+                {
+                    result: 123
+                }
+            ]
+        },
+        {
+            Observations: [
+                {
+                    result: 456
+                }
+            ]
+        }
+    ]
+};
+
+describe("src/utils/attributeMapper.js", () => {
+    describe("mapAttributes", () => {
+        it("should map object with single attribute", () => {
+            const mappingObj = {
+                random_text: "text"
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                text: "foobar"
+            });
+        });
+        it("should map object with single attribute and objectpath", () => {
+            const mappingObj = {
+                "@random_text": "text"
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                text: "foobar"
+            });
+        });
+        it("should map object with single attribute and nested objectpath", () => {
+            const mappingObj = {
+                "@random_datastreams.0.Observations.0.result": "result"
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                result: 123
+            });
+        });
+        it("should map object with multiple attributes", () => {
+            const mappingObj = {
+                random_text: "text",
+                random_boolean: "boolean"
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                text: "foobar",
+                boolean: true
+            });
+        });
+        it("should map object with multiple attributes with nested objectpath", () => {
+            const mappingObj = {
+                random_text: "text",
+                random_boolean: "boolean",
+                "@random_datastreams.0.Observations.0.result": "result"
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                text: "foobar",
+                boolean: true,
+                result: 123
+            });
+        });
+        it("should map object with mapping object and condition:endsWith", () => {
+            const mappingObj = {
+                random_text: {
+                    name: "text",
+                    condition: "endsWith"
+                }
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                text: "foobar"
+            });
+        });
+        it("should map object with mapping object and condition:startsWith", () => {
+            const mappingObj = {
+                random_text: {
+                    name: "text",
+                    condition: "startsWith"
+                }
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                text: "foobar"
+            });
+        });
+        it("should map object with mapping object and condition:contains", () => {
+            const mappingObj = {
+                random_text: {
+                    name: "text",
+                    condition: "contains"
+                }
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                text: "foobar"
+            });
+        });
+        it("should map object with mapping object and suffix", () => {
+            const mappingObj = {
+                random_text: {
+                    name: "text",
+                    condition: "contains",
+                    suffix: "barfoo"
+                }
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                text: "foobar barfoo"
+            });
+        });
+        it("should map object with mapping object and prefix", () => {
+            const mappingObj = {
+                random_text: {
+                    name: "text",
+                    condition: "contains",
+                    prefix: "barfoo"
+                }
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                text: "barfoofoobar"
+            });
+        });
+        it("should map object with mapping object and type:date", () => {
+            const mappingObj = {
+                random_date: {
+                    name: "date",
+                    condition: "contains",
+                    type: "date"
+                }
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                date: "2021-11-17T13:02:00.000+01:00"
+            });
+        });
+        it("should map object with mapping object and type:date and format:YYYY-MM-DD", () => {
+            const mappingObj = {
+                random_date: {
+                    name: "date",
+                    condition: "contains",
+                    type: "date",
+                    format: "YYYY-MM-DD"
+                }
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                date: "2021-11-17"
+            });
+        });
+        it("should map object with mapping object and type:date and format:DD-MM-YYYYf", () => {
+            const mappingObj = {
+                random_date: {
+                    name: "date",
+                    condition: "contains",
+                    type: "date",
+                    format: "DD-MM-YYYY"
+                }
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                date: "17-11-2021"
+            });
+        });
+        it("should map object with mapping object (random_int) and type:number", () => {
+            const mappingObj = {
+                random_int: {
+                    name: "integer",
+                    condition: "contains",
+                    type: "number"
+                }
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                integer: "12.345"
+            });
+        });
+        it("should map object with mapping object (random_float) and type:number", () => {
+            const mappingObj = {
+                random_float: {
+                    name: "float",
+                    condition: "contains",
+                    type: "number"
+                }
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                float: "1,23"
+            });
+        });
+        it("should map object with mapping object and type:boolean", () => {
+            const mappingObj = {
+                random_boolean: {
+                    name: "boolean",
+                    condition: "contains",
+                    type: "boolean"
+                }
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                boolean: "true"
+            });
+        });
+        it("should map object with mapping object and type:boolean and format", () => {
+            const mappingObj = {
+                random_boolean: {
+                    name: "boolean",
+                    condition: "contains",
+                    type: "boolean",
+                    format: {
+                        true: "Ja",
+                        false: "Nein"
+                    }
+                }
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                boolean: "Ja"
+            });
+        });
+        it("should map object with mapping object and type:boolean and format with i18next", () => {
+            const mappingObj = {
+                random_boolean: {
+                    name: "boolean",
+                    condition: "contains",
+                    type: "boolean",
+                    format: {
+                        true: "common:modules.tools.gfi.boolean.yes",
+                        false: "common:modules.tools.gfi.boolean.no"
+                    }
+                }
+            };
+
+            // i18next only returns the path.
+            // Propably mocking of language-file would get the right translated value?
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                boolean: "common:modules.tools.gfi.boolean.yes"
+            });
+        });
+        it("should map object with mapping object and no type (defaults to string)", () => {
+            const mappingObj = {
+                random_boolean: {
+                    name: "boolean",
+                    condition: "contains"
+                },
+                random_int: {
+                    name: "int",
+                    condition: "contains"
+                }
+            };
+
+            expect(mapAttributes(props, mappingObj)).toEqual({
+                boolean: "true",
+                int: "12345"
+            });
+        });
+    });
+    describe("isObjectPath", () => {
+        it("should return true for \"@foobar\"", () => {
+            expect(isObjectPath("@foobar")).toBe(true);
+        });
+        it("should return false for \"foobar\"", () => {
+            expect(isObjectPath("foobar")).toBe(false);
+        });
+        it("should return false for 1", () => {
+            expect(isObjectPath(1)).toBe(false);
+        });
+        it("should return false for true", () => {
+            expect(isObjectPath(true)).toBe(false);
+        });
+    });
+});

package/test/lib/getValueFromObjectByPath.test.js

@@ -0,0 +1,61 @@
+import {getValueFromObjectByPath, getPathPartsFromPath} from "../../src/lib/getValueFromObjectByPath";
+
+describe("src/utils/getValueFromObjectByPath.js", () => {
+    describe("getPathPartsFromPath", () => {
+        it("should walk through the given string, collecting all parts seperated by a dot", () => {
+            const path = "first.second.third",
+                expected = ["first", "second", "third"];
+
+            expect(getPathPartsFromPath(path)).toEqual(expected);
+        });
+        it("should ignore escaped dots on the way, removing escape signs", () => {
+            const path = "first.sec\\.ond.third",
+                expected = ["first", "sec.ond", "third"];
+
+            expect(getPathPartsFromPath(path)).toEqual(expected);
+        });
+        it("should be able to escape escape signs", () => {
+            const path = "first.sec\\\\ond.third",
+                expected = ["first", "sec\\ond", "third"];
+
+            expect(getPathPartsFromPath(path)).toEqual(expected);
+        });
+    });
+    describe("getValueFromObjectByPath", () => {
+        it("should return undefined if anything but an object or array is given as first param", () => {
+            expect(getValueFromObjectByPath(undefined, "")).toBe(undefined);
+            expect(getValueFromObjectByPath(null, "")).toBe(undefined);
+            expect(getValueFromObjectByPath("string", "")).toBe(undefined);
+            expect(getValueFromObjectByPath(1234, "")).toBe(undefined);
+            expect(getValueFromObjectByPath(true, "")).toBe(undefined);
+            expect(getValueFromObjectByPath(false, "")).toBe(undefined);
+        });
+        it("should return undefined if anything but a string is given as second param", () => {
+            expect(getValueFromObjectByPath({}, undefined)).toBe(undefined);
+            expect(getValueFromObjectByPath({}, null)).toBe(undefined);
+            expect(getValueFromObjectByPath({}, 1234)).toBe(undefined);
+            expect(getValueFromObjectByPath({}, true)).toBe(undefined);
+            expect(getValueFromObjectByPath({}, false)).toBe(undefined);
+            expect(getValueFromObjectByPath({}, {})).toBe(undefined);
+            expect(getValueFromObjectByPath({}, [])).toBe(undefined);
+        });
+        it("should return undefined if the given depthBarrier is reached during walkthrough", () => {
+            expect(getValueFromObjectByPath({test: {test: 1}}, "@test.test", "@", ".", 1)).toBe(undefined);
+        });
+        it("should return undefined if the given path can't be followed through the given object", () => {
+            expect(getValueFromObjectByPath({}, "@test")).toBe(undefined);
+            expect(getValueFromObjectByPath({test: null}, "@test.test")).toBe(undefined);
+        });
+        it("should return the found value if the given path was successfully followed through the object", () => {
+            expect(getValueFromObjectByPath({test: 1}, "@test")).toEqual(1);
+            expect(getValueFromObjectByPath({test: {test: 1}}, "@test")).toEqual({test: 1});
+            expect(getValueFromObjectByPath({test: {test: {test: 1}}}, "@test.test")).toEqual({test: 1});
+        });
+        it("should be able to handle a path without prefix when no prefix is given", () => {
+            expect(getValueFromObjectByPath({test: 1}, "test", false)).toEqual(1);
+        });
+        it("should be able to handle a path with a complex prefix", () => {
+            expect(getValueFromObjectByPath({test: 1}, "1234test", "1234")).toEqual(1);
+        });
+    });
+});

package/test/lib/thousandsSeparator.test.js

@@ -0,0 +1,58 @@
+import thousandsSeparator from "../../src/lib/thousandsSeparator";
+
+describe("src/utils/thousandsSeparator.js", () => {
+    it("should return an empty string if the given param is not a number nor a string", () => {
+        expect(typeof thousandsSeparator(undefined)).toBe("string");
+        expect(thousandsSeparator(undefined)).toEqual("");
+        expect(typeof thousandsSeparator(null)).toBe("string");
+        expect(thousandsSeparator(null)).toEqual("");
+        expect(typeof thousandsSeparator([])).toBe("string");
+        expect(thousandsSeparator([])).toEqual("");
+        expect(typeof thousandsSeparator({})).toBe("string");
+        expect(thousandsSeparator({})).toEqual("");
+        expect(typeof thousandsSeparator(false)).toBe("string");
+        expect(thousandsSeparator(false)).toEqual("");
+        expect(typeof thousandsSeparator(true)).toBe("string");
+        expect(thousandsSeparator(true)).toEqual("");
+    });
+    it("should convert a number into a string", () => {
+        expect(typeof thousandsSeparator(1)).toBe("string");
+    });
+    it("should convert a negative number into a string", () => {
+        expect(typeof thousandsSeparator(-1)).toBe("string");
+    });
+    it("should return a string if a string was given", () => {
+        expect(typeof thousandsSeparator("1")).toBe("string");
+    });
+    it("should add the given letter(s) as thousands separator", () => {
+        expect(thousandsSeparator(1000, "delimAbs")).toEqual("1delimAbs000");
+    });
+    it("should add the given letter(s) as decimal point for positive value", () => {
+        expect(thousandsSeparator(1000.1, "delimAbs", "delimDec")).toEqual("1delimAbs000delimDec1");
+    });
+    it("should create a number in german format by default for positive value", () => {
+        expect(thousandsSeparator(1000.1)).toEqual("1.000,1");
+    });
+    it("should be able to add a higher number of thousands separators", () => {
+        expect(thousandsSeparator(1123456789.123456)).toEqual("1.123.456.789,123456");
+    });
+    it("should be able to add a higher number of thousands separators if a string was given", () => {
+        expect(thousandsSeparator("1123456789.123456")).toEqual("1.123.456.789,123456");
+    });
+    it("should add the given letter(s) as thousands seperator", () => {
+        expect(thousandsSeparator(-1000, "delimAbs")).toEqual("-1delimAbs000");
+    });
+    it("should add the given letter(s) as decimal point for negative value", () => {
+        expect(thousandsSeparator(-1000.1, "delimAbs", "delimDec")).toEqual("-1delimAbs000delimDec1");
+    });
+    it("should create a number in german format by default for negative value", () => {
+        expect(thousandsSeparator(-1000.1)).toEqual("-1.000,1");
+    });
+    it("should be able to add a higher number of thousands seperators", () => {
+        expect(thousandsSeparator(-1123456789.123456)).toEqual("-1.123.456.789,123456");
+    });
+    it("should be able to add a higher number of thousands seperators if a string was given", () => {
+        expect(thousandsSeparator("-1123456789.123456")).toEqual("-1.123.456.789,123456");
+    });
+});
+