@panoramax/web-viewer 4.0.3 → 4.1.0-develop-55fdf56c

package/tests/utils/InitParameters.test.js

@@ -66,6 +66,7 @@ describe("InitParameters", () => {
 			geocoder: true,
 			widgets: true,
 			forceFocus: true,
+			keyboardShortcuts: true,
 		});
 		expect(initParams._psvInit).toEqual({});
 		expect(initParams._psvAny).toEqual({
@@ -111,11 +112,13 @@ describe("InitParameters", () => {
 			geocoder: true,
 			widgets: true,
 			forceFocus: true,
+			keyboardShortcuts: true,
 		});
 	});
 
 	it("uses browserStorage parameters if no URL parameter is available", () => {
 		componentAttrs.map.raster = {};
+		componentAttrs.picture = undefined;
 		const initParams = new InitParameters(componentAttrs, undefined, browserStorage);
 		expect(initParams._mapAny).toEqual({
 			theme: "qualityscore",
@@ -128,6 +131,20 @@ describe("InitParameters", () => {
 		});
 	});
 
+	it("uses browserStorage parameters if no URL parameter is available, except map coords if picture is set", () => {
+		componentAttrs.map.raster = {};
+		const initParams = new InitParameters(componentAttrs, undefined, browserStorage);
+		expect(initParams._mapAny).toEqual({
+			theme: "qualityscore",
+			background: "aerial",
+			center: [0,0],
+			zoom: 19,
+			pitch: undefined,
+			bearing: undefined,
+			users: "user1,user2",
+		});
+	});
+
 	it("should sanitize objects correctly", () => {
 		const initParams = new InitParameters(componentAttrs, urlParams);
 		const obj = { a: 1, b: undefined, c: 3 };
@@ -161,6 +178,7 @@ describe("InitParameters", () => {
 			geocoder: true,
 			widgets: true,
 			forceFocus: true,
+			keyboardShortcuts: true,
 		});
 	});
 
@@ -243,6 +261,15 @@ describe("InitParameters", () => {
 		expect(initParams._mapAny.background).toBe("streets");
 		expect(console.warn).toHaveBeenCalledWith("Parameter background can't be 'aerial' as no aerial imagery is available");
 	});
+
+	it("should handle keyboardShortcuts=false", () => {
+		componentAttrs["keyboard-shortcuts"] = "false";
+		const initParams = new InitParameters(componentAttrs, urlParams);
+		expect(initParams._mapInit.keyboard).toBe(false);
+		expect(initParams._parentPostInit.keyboardShortcuts).toBe(false);
+		expect(initParams._psvInit.keyboard).toBe(false);
+		expect(initParams._psvInit.keyboardActions).toEqual({});
+	});
 });
 
 describe("getMapPositionFromString", () => {

package/tests/utils/map.test.js

@@ -11,6 +11,18 @@ describe("getThumbGif", () => {
 	});
 });
 
+describe("isNullCoordinates", () =>  {
+	it.each([
+		[undefined, true],
+		[null, true],
+		[[0,0], true],
+		[[48.7, -1.5], false],
+		[[], true],
+	])("works with %s", (input, expected) => {
+		expect(map.isNullCoordinates(input)).toBe(expected);
+	});
+});
+
 describe("isLabelLayer", () => {
 	it("works with just text-field", () => {
 		const layer = { type: "symbol", layout: { "text-field": "Label" } };

package/tests/utils/semantics.test.js

@@ -1,4 +1,6 @@
-import { decodeKey, decodeBasicTag, groupByPrefix } from "../../src/utils/semantics";
+import {
+	decodeKey, decodeBasicTag, computeDiffTags, groupByPrefix
+} from "../../src/utils/semantics";
 
 describe("decodeBasicTag", () => {
 	test("should return null if no equal sign is present", () => {
@@ -7,14 +9,14 @@ describe("decodeBasicTag", () => {
 
 	test("should correctly decode a tag with an equal sign", () => {
 		expect(decodeBasicTag("key=value")).toEqual({
-			key: { prefix: "", subkey: "key", qualifies: null },
+			key: { key: "key", prefix: "", subkey: "key", qualifies: null },
 			value: "value"
 		});
 	});
 
 	test("should correctly decode a tag with a prefix", () => {
 		expect(decodeBasicTag("osm|key=value")).toEqual({
-			key: { prefix: "osm", subkey: "key", qualifies: null },
+			key: { key: "osm|key", prefix: "osm", subkey: "key", qualifies: null },
 			value: "value"
 		});
 	});
@@ -23,6 +25,7 @@ describe("decodeBasicTag", () => {
 describe("decodeKey", () => {
 	test("should return default structure if key does not match regex", () => {
 		expect(decodeKey("panoKey")).toEqual({
+			key: "panoKey",
 			prefix: "",
 			subkey: "panoKey",
 			qualifies: null
@@ -31,6 +34,7 @@ describe("decodeKey", () => {
 
 	test("should correctly decode a key with a prefix", () => {
 		expect(decodeKey("osm|traffic_sign")).toEqual({
+			key: "osm|traffic_sign",
 			prefix: "osm",
 			subkey: "traffic_sign",
 			qualifies: null
@@ -39,21 +43,46 @@ describe("decodeKey", () => {
 
 	test("should correctly decode a key with qualifiers", () => {
 		expect(decodeKey("detection_model[camera_mount=pole]")).toEqual({
+			key: "detection_model[camera_mount=pole]",
 			prefix: "",
 			subkey: "detection_model",
-			qualifies: { key: { prefix: "", subkey: "camera_mount", qualifies: null }, value: "pole" }
+			qualifies: { key: { key: "camera_mount", prefix: "", subkey: "camera_mount", qualifies: null }, value: "pole" }
 		});
 	});
 
 	test("should correctly decode a key with a prefix and qualifiers", () => {
 		expect(decodeKey("osm|source[osm|traffic_sign=stop]")).toEqual({
+			key: "osm|source[osm|traffic_sign=stop]",
 			prefix: "osm",
 			subkey: "source",
-			qualifies: { key: { prefix: "osm", subkey: "traffic_sign", qualifies: null }, value: "stop" }
+			qualifies: { key: { key: "osm|traffic_sign", prefix: "osm", subkey: "traffic_sign", qualifies: null }, value: "stop" }
 		});
 	});
 });
 
+describe("computeDiffTags", () => {
+	it("should return new set of tags when no tag is missing in next", () => {
+		const prev = [{key: "tag1", value: "value1"}, {key: "tag2", value: "value2"}];
+		const next = [{key: "tag1", value: "value1"}, {key: "tag2", value: "value2"}, {key: "tag3", value: "value3"}];
+		
+		expect(computeDiffTags(prev, next)).toEqual([{key: "tag3", value: "value3", action: "add"}]);
+	});
+	
+	it("should return new set of tags with missing tags marked as delete when some tag is missing in next", () => {
+		const prev = [{key: "tag1", value: "value1"}, {key: "tag2", value: "value2"}];
+		const next = [{key: "tag1", value: "value1"}];
+		
+		expect(computeDiffTags(prev, next)).toEqual([{key: "tag2", value: "value2", action: "delete"}]);
+	});
+	
+	it("should return new set of tags with all tags marked as delete when all tags are missing in next", () => {
+		const prev = [{key: "tag1", value: "value1"}, {key: "tag2", value: "value2"}];
+		const next = [];
+		
+		expect(computeDiffTags(prev, next)).toEqual([{key: "tag1", value: "value1", action: "delete"}, {key: "tag2", value: "value2", action: "delete"}]);
+	});
+});
+
 describe("groupByPrefix", () => {
 	test("should group tags by prefix", () => {
 		const tags = [

package/docs/reference/components/ui/HashTags.md

@@ -1,15 +0,0 @@
-<a name="Panoramax.components.ui.HashTags"></a>
-
-## Panoramax.components.ui.HashTags ⇐ <code>[lit.LitElement](https://lit.dev/docs/api/LitElement/)</code>
-**Kind**: static class of <code>Panoramax.components.ui</code>  
-**Extends**: <code>[lit.LitElement](https://lit.dev/docs/api/LitElement/)</code>  
-**Element**: pnx-hashtags  
-<a name="new_Panoramax.components.ui.HashTags_new"></a>
-
-### new HashTags()
-HashTags component shows the list of hashtags associated to a picture.
-
-**Example**  
-```html
-<pnx-hashtags ._parent=${viewer} />
-```

package/src/components/ui/HashTags.js

@@ -1,98 +0,0 @@
-import { LitElement, html, css, nothing } from "lit";
-import { getHashTags, hasAnnotations } from "../../utils/picture";
-import { fa } from "../../utils/widgets";
-import { faDrawPolygon } from "@fortawesome/free-solid-svg-icons/faDrawPolygon";
-
-/**
- * HashTags component shows the list of hashtags associated to a picture.
- * @class Panoramax.components.ui.HashTags
- * @element pnx-hashtags
- * @extends [lit.LitElement](https://lit.dev/docs/api/LitElement/)
- * @example
- * ```html
- * <pnx-hashtags ._parent=${viewer} />
- * ```
- */
-export default class HashTags extends LitElement {
-	/** @private */
-	static styles = css`
-		div {
-			background: linear-gradient(to bottom left, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.2));
-			margin-top: -10px;
-			margin-right: -10px;
-			padding: 5px 10px;
-			border-bottom-left-radius: 10px;
-			font-family: var(--font-family);
-			color: white;
-			font-size: 0.8em;
-		}
-	`;
-
-	/** @private */
-	static properties = {
-		_tags: {state: true},
-		_visible: {state: true},
-		_annotationsToggled: {state: true},
-	};
-
-	constructor() {
-		super();
-		this._tags = [];
-		this._visible = false;
-		this._annotationsToggled = false;
-	}
-
-	/** @private */
-	connectedCallback() {
-		super.connectedCallback();
-
-		this._parent.onceReady().then(() => {
-			this._tags = getHashTags(this._parent?.psv?.getPictureMetadata?.());
-
-			// Component visibility : only if seen at least one pic with semantics
-			if(
-				!this._visible && (
-					this._tags.length > 0
-					|| hasAnnotations(this._parent?.psv?.getPictureMetadata?.())
-				)
-			) {
-				this._visible = true;
-				this._parent.psv.toggleAllAnnotations(true);
-			}
-
-			this._parent.psv.addEventListener("picture-loaded", () => {
-				this._tags = getHashTags(this._parent.psv.getPictureMetadata());
-				if(
-					!this._visible && (
-						this._tags.length > 0 ||
-						hasAnnotations(this._parent.psv.getPictureMetadata())
-					)
-				) {
-					this._visible = true;
-					this._parent.psv.toggleAllAnnotations(true);
-				}
-			});
-
-			this._annotationsToggled = this._parent.psv.areAnnotationsVisible() || false;
-			this._parent.psv.addEventListener("annotations-toggled", e => {
-				this._annotationsToggled = e.detail.visible;
-			});
-		});
-	}
-
-	/** @private */
-	render() {
-		return this._visible ? html`<div>
-			${this._tags.join(" ")}
-			<pnx-button
-				kind="outline"
-				style="vertical-align: middle"
-				title=${this._annotationsToggled ? this._parent._t?.pnx.semantics_hide_annotations : this._parent._t?.pnx.semantics_show_annotations}
-				active=${this._annotationsToggled ? "" : nothing}
-				@click=${() => this._parent.psv.toggleAllAnnotations(!this._annotationsToggled)}
-			>${fa(faDrawPolygon)}</pnx-button>
-		</div>` : nothing;
-	}
-}
-
-customElements.define("pnx-hashtags", HashTags);