@panoramax/web-viewer 3.2.3 → 4.0.0-develop-39167b4d

package/tests/components/{Photo.test.js → ui/Photo.test.js}

@@ -1,62 +1,14 @@
-import Photo from "../../src/components/Photo";
+import Photo from "../../../src/components/ui/Photo";
 import fs from "fs";
 import path from "path";
 
-jest.mock("@photo-sphere-viewer/core", () => ({
-	Viewer: class {
-		constructor(opts) {
-			this._psvOpts = opts;
-			this.loader = {
-				canvas: { setAttribute: jest.fn() },
-				__updateContent: jest.fn(),
-				show: jest.fn(),
-			};
-			this.renderer = {
-				renderer: {
-					toneMapping: null,
-					toneMappingExposure: null,
-				}
-			};
-		}
-		addEventListener() {;}
-		getPlugin() {
-			return {
-				addEventListener: jest.fn(),
-				datasource: {
-					nodeResolver: jest.fn(),
-				},
-				arrowsRenderer: {
-					clear: jest.fn(),
-				},
-				state: {
-					currentNode: null,
-					datasource: { nodes: {} },
-				},
-				config: {
-					transitionOptions: jest.fn(),
-				},
-				__onEnterObject: jest.fn(),
-				__onLeaveObject: jest.fn(),
-			};
-		}
-	}
-}));
-
-jest.mock("@photo-sphere-viewer/equirectangular-tiles-adapter", () => ({
-	EquirectangularTilesAdapter: jest.fn(),
-}));
-
-jest.mock("@photo-sphere-viewer/virtual-tour-plugin", () => ({
-	VirtualTourPlugin: jest.fn(),
-}));
-
 const createParent = () => ({
 	addEventListener: jest.fn(),
 	dispatchEvent: jest.fn(),
 	isWidthSmall: jest.fn(),
 	select: jest.fn(),
-	_t: { gvs: {} },
-	_api: {
+	_t: { pnx: {} },
+	api: {
 		_getFetchOptions: jest.fn(),
 		getPictureMetadataUrl: (picId, seqId) => `https://geovisio.fr/api/collections/${seqId}/items/${picId}`
 	},
@@ -68,7 +20,7 @@ describe("constructor", () => {
 		const p = createParent();
 		const c = document.createElement("div");
 		const ph = new Photo(p, c);
-		expect(c.className).toBe("gvs-psv");
+		expect(c.className).toBe("pnx-psv");
 	});
 });
 
@@ -84,7 +36,7 @@ describe("_getNodeFromAPI", () => {
 		global.fetch = jest.fn(() =>
 			Promise.resolve({
 				ok: true,
-				json: () => Promise.resolve(JSON.parse(fs.readFileSync(path.join(__dirname, "..", "data", "Viewer_pictures_1.json")))),
+				json: () => Promise.resolve(JSON.parse(fs.readFileSync(path.join(__dirname, "..", "..", "data", "Viewer_pictures_1.json")))),
 			})
 		);
 		global.Date = jest.fn(() => ({ toLocaleDateString: () => "June 3 2022" }));
@@ -100,7 +52,7 @@ describe("_getNodeFromAPI", () => {
 		global.fetch = jest.fn(() =>
 			Promise.resolve({
 				ok: true,
-				json: () => Promise.resolve(JSON.parse(fs.readFileSync(path.join(__dirname, "..", "data", "Viewer_pictures_1.json")))),
+				json: () => Promise.resolve(JSON.parse(fs.readFileSync(path.join(__dirname, "..", "..", "data", "Viewer_pictures_1.json")))),
 			})
 		);
 		global.Date = jest.fn(() => ({ toLocaleDateString: () => "June 3 2022" }));
@@ -114,8 +66,8 @@ describe("getPictureMetadata", () => {
 		const p = createParent();
 		const c = document.createElement("div");
 		const ph = new Photo(p, c);
-		ph._myVTour.state.currentNode = { bla: "bla" };
-		expect(ph.getPictureMetadata()).toStrictEqual({ bla: "bla" });
+		ph._myVTour.state.currentNode = { id: "1234", bla: "bla" };
+		expect(ph.getPictureMetadata()).toStrictEqual({ id: "1234", bla: "bla" });
 	});
 
 	it("nulls when no pic is selected", () => {
@@ -159,7 +111,7 @@ describe("goToNextPicture", () => {
 		const p = createParent();
 		const c = document.createElement("div");
 		const ph = new Photo(p, c);
-		ph._myVTour = { state: { currentNode: { sequence: { id: "seq", nextPic: "idnext" } } } };
+		ph._myVTour = { state: { currentNode: { id: "bla", sequence: { id: "seq", nextPic: "idnext" } } } };
 		ph.goToNextPicture();
 		expect(p.select.mock.calls).toEqual([["seq", "idnext"]]);
 	});
@@ -168,7 +120,7 @@ describe("goToNextPicture", () => {
 		const p = createParent();
 		const c = document.createElement("div");
 		const ph = new Photo(p, c);
-		ph._myVTour = { state: { currentNode: { sequence: {} } } };
+		ph._myVTour = { state: { currentNode: { id: "bla", sequence: {} } } };
 		expect(() => ph.goToNextPicture()).toThrow(new Error("No next picture available"));
 	});
 });
@@ -186,7 +138,7 @@ describe("goToPrevPicture", () => {
 		const p = createParent();
 		const c = document.createElement("div");
 		const ph = new Photo(p, c);
-		ph._myVTour = { state: { currentNode: { sequence: { id: "seq", prevPic: "idprev" } } } };
+		ph._myVTour = { state: { currentNode: { id: "bla", sequence: { id: "seq", prevPic: "idprev" } } } };
 		ph.goToPrevPicture();
 		expect(p.select.mock.calls).toEqual([["seq", "idprev"]]);
 	});
@@ -195,7 +147,7 @@ describe("goToPrevPicture", () => {
 		const p = createParent();
 		const c = document.createElement("div");
 		const ph = new Photo(p, c);
-		ph._myVTour = { state: { currentNode: { sequence: {} } } };
+		ph._myVTour = { state: { currentNode: { id: "bla", sequence: {} } } };
 		expect(() => ph.goToPrevPicture()).toThrow(new Error("No previous picture available"));
 	});
 });
@@ -205,8 +157,8 @@ describe("goToPosition", () => {
 		const p = createParent();
 		const c = document.createElement("div");
 		const ph = new Photo(p, c);
-		p._api = {
-			getPicturesAroundCoordinates: () => Promise.resolve(JSON.parse(fs.readFileSync(path.join(__dirname, "..", "data", "Viewer_pictures_1.json")))),
+		p.api = {
+			getPicturesAroundCoordinates: () => Promise.resolve(JSON.parse(fs.readFileSync(path.join(__dirname, "..", "..", "data", "Viewer_pictures_1.json")))),
 			_getFetchOptions: jest.fn()
 		};
 
@@ -220,7 +172,7 @@ describe("goToPosition", () => {
 		const p = createParent();
 		const c = document.createElement("div");
 		const ph = new Photo(p, c);
-		p._api = {
+		p.api = {
 			getPicturesAroundCoordinates: () => Promise.resolve({ "features": [] }),
 			_getFetchOptions: jest.fn()
 		};
@@ -333,3 +285,85 @@ describe("setTransitionDuration", () => {
 		expect(() => ph.setTransitionDuration(3001)).toThrowError("Invalid transition duration (should be between 100 and 3000)");
 	});
 });
+
+describe("playSequence", () => {
+	it("sends event", () => {
+		const p = createParent();
+		const c = document.createElement("div");
+		const ph = new Photo(p, c);
+		return new Promise(resolve => {
+			ph.addEventListener("sequence-playing", resolve);
+			ph.playSequence();
+		});
+	});
+});
+
+describe("stopSequence", () => {
+	it("sends event", async () => {
+		const p = createParent();
+		const c = document.createElement("div");
+		const ph = new Photo(p, c);
+		return new Promise(resolve => {
+			ph.addEventListener("sequence-stopped", resolve);
+			ph.stopSequence();
+		});
+	});
+});
+
+describe("isSequencePlaying", () => {
+	it("is true when sequence is playing", () => {
+		const p = createParent();
+		const c = document.createElement("div");
+		const ph = new Photo(p, c);
+		ph.goToNextPicture = jest.fn();
+		ph.playSequence();
+		expect(ph.isSequencePlaying()).toBe(true);
+	});
+
+	it("is false when sequence never played", () => {
+		const p = createParent();
+		const c = document.createElement("div");
+		const ph = new Photo(p, c);
+		expect(ph.isSequencePlaying()).toBe(false);
+	});
+
+	it("is false when sequence stopped", () => {
+		const p = createParent();
+		const c = document.createElement("div");
+		const ph = new Photo(p, c);
+		ph.playSequence();
+		ph.stopSequence();
+		expect(ph.isSequencePlaying()).toBe(false);
+	});
+});
+
+describe("getPicturesNavigation", () => {
+	it("works", () => {
+		const p = createParent();
+		const c = document.createElement("div");
+		const ph = new Photo(p, c, {picturesNavigation: "pic"});
+		expect(ph.getPicturesNavigation()).toBe("pic");
+		ph._picturesNavigation = "seq";
+		expect(ph.getPicturesNavigation()).toBe("seq");
+	});
+});
+
+describe("setPicturesNavigation", () => {
+	it("works", () => {
+		const p = createParent();
+		const c = document.createElement("div");
+		const ph = new Photo(p, c);
+		const eventWatcher = jest.fn();
+		ph.addEventListener("pictures-navigation-changed", eventWatcher);
+		expect(ph.getPicturesNavigation()).toBe("any");
+		ph.setPicturesNavigation("pic");
+		expect(ph.getPicturesNavigation()).toBe("pic");
+		ph.setPicturesNavigation("seq");
+		expect(ph.getPicturesNavigation()).toBe("seq");
+		ph.setPicturesNavigation("any");
+		expect(ph.getPicturesNavigation()).toBe("any");
+		ph.setPicturesNavigation("none");
+		expect(ph.getPicturesNavigation()).toBe("pic");
+		expect(eventWatcher.mock.calls).toMatchSnapshot();
+	});
+});

package/tests/components/ui/Popup.test.js

@@ -0,0 +1,26 @@
+import Popup from "../../../src/components/ui/Popup";
+
+describe("constructor", () => {
+	it("works", () => {
+		document.addEventListener = jest.fn();
+		const p = new Popup();
+		p.addEventListener = jest.fn();
+		expect(p.visible).toBe(false);
+
+		p.connectedCallback();
+		expect(p.addEventListener.mock.calls).toMatchSnapshot();
+		expect(document.addEventListener.mock.calls).toMatchSnapshot();
+	});
+});
+
+describe("close", () => {
+	it("works", () => {
+		const p = new Popup();
+		p.dispatchEvent = jest.fn();
+		p.visible = true;
+		p.close();
+
+		expect(p.visible).toBe(false);
+		expect(p.dispatchEvent.mock.calls).toMatchSnapshot();
+	});
+});

package/tests/components/ui/QualityScore.test.js

@@ -0,0 +1,18 @@
+import QualityScore from "../../../src/components/ui/QualityScore";
+
+describe("_onInput", () => {
+	it("works", () => {
+		const qs = new QualityScore();
+		qs.dispatchEvent = jest.fn();
+		qs.renderRoot.querySelectorAll.mockReturnValueOnce([
+			{ value: 5, checked: false },
+			{ value: 4, checked: true },
+			{ value: 3, checked: false },
+			{ value: 2, checked: true },
+			{ value: 1, checked: false },
+		])
+		qs._onInput();
+		expect(qs.grade).toEqual("4,2");
+		expect(qs.dispatchEvent.mock.calls).toMatchSnapshot();
+	});
+});

package/tests/components/ui/SearchBar.test.js

@@ -0,0 +1,110 @@
+import SearchBar from "../../../src/components/ui/SearchBar";
+
+describe("_onIconClick", () => {
+	it("resets on error", () => {
+		const sb = new SearchBar();
+		sb.reset = jest.fn();
+		sb._icon = "warn";
+		sb._onIconClick();
+		expect(sb.reset.mock.calls).toMatchSnapshot();
+	});
+
+	it("resets on clear", () => {
+		const sb = new SearchBar();
+		sb.reset = jest.fn();
+		sb._icon = "empty";
+		sb._onIconClick();
+		expect(sb.reset.mock.calls).toMatchSnapshot();
+	});
+
+	it("reduces if reduceable & extended", () => {
+		const sb = new SearchBar();
+		sb.reduceable = true;
+		sb.reduced = false;
+		sb._onIconClick();
+		expect(sb.reduced).toBe(true);
+	});
+
+	it("expands if reduceable & reduced", () => {
+		const sb = new SearchBar();
+		sb.reduceable = true;
+		sb.reduced = true;
+		sb._onIconClick();
+		expect(sb.reduced).toBe(false);
+	});
+});
+
+describe("_onResultClick", () => {
+	it("works on classic", () => {
+		const sb = new SearchBar();
+		sb.dispatchEvent = jest.fn();
+		sb._onResultClick({title: "res1", subtitle: "sub1", data: "coucou"});
+		expect(sb.dispatchEvent.mock.calls).toMatchSnapshot();
+		expect(sb.value).toEqual("res1");
+		expect(sb._icon).toEqual("empty");
+		expect(sb._results).toBe(null);
+	});
+
+	it("works on reduced", () => {
+		const sb = new SearchBar();
+		sb.dispatchEvent = jest.fn();
+		sb.reduceable = true;
+		sb._onResultClick({title: "res1", subtitle: "sub1", data: "coucou"});
+		expect(sb.dispatchEvent.mock.calls).toMatchSnapshot();
+		expect(sb.value).toEqual("");
+		expect(sb._icon).toEqual("search");
+		expect(sb._results).toBe(null);
+		expect(sb.reduced).toBe(true);
+	});
+
+	it("resets on null value", () => {
+		const sb = new SearchBar();
+		sb.dispatchEvent = jest.fn();
+		sb._onResultClick(null);
+		expect(sb.dispatchEvent.mock.calls).toMatchSnapshot();
+		expect(sb.value).toEqual("");
+		expect(sb._icon).toEqual("search");
+		expect(sb._results).toBe(null);
+	});
+});
+
+describe("_search", () => {
+	it("skips if value is empty", () => {
+		const sb = new SearchBar();
+		sb.reset = jest.fn();
+		sb._search();
+		expect(sb.reset.mock.calls).toMatchSnapshot();
+	});
+
+	it("skips if no searcher fct", () => {
+		global.console = { warn: jest.fn() };
+
+		const sb = new SearchBar();
+		sb.value = "test";
+		sb._search();
+		expect(global.console.warn.mock.calls).toMatchSnapshot();
+	});
+
+	it("works with actual data", () => {
+		const sb = new SearchBar();
+		return new Promise(resolve => {
+			sb.searcher = value => {
+				expect(value).toEqual("my search");
+				expect(sb._icon).toEqual("loading");
+				expect(sb._results).toBe(null);
+				resolve();
+			};
+			sb.value = "my search";
+			sb._search();
+		});
+	});
+});
+
+describe("reset", () => {
+	it("works", () => {
+		const sb = new SearchBar();
+		sb._onResultClick = jest.fn();
+		sb.reset();
+		expect(sb._onResultClick.mock.calls).toMatchSnapshot();
+	});
+});

package/tests/components/ui/__snapshots__/CopyButton.test.js.snap

@@ -0,0 +1,33 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`_onClick works with input 1`] = `
+Array [
+  Array [
+    "copy me from input",
+  ],
+]
+`;
+
+exports[`_onClick works with text 1`] = `
+Array [
+  Array [
+    "I am a copy text",
+  ],
+]
+`;
+
+exports[`_onClick works with textarea 1`] = `
+Array [
+  Array [
+    "copy me from textarea",
+  ],
+]
+`;
+
+exports[`constructor listens to click 1`] = `
+Object {
+  "click": Array [
+    [Function],
+  ],
+}
+`;

package/tests/components/ui/__snapshots__/Loader.test.js.snap

@@ -0,0 +1,56 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`dismiss works on success + next fct 1`] = `
+Array [
+  Array [
+    CustomEvent {
+      "isTrusted": false,
+    },
+  ],
+]
+`;
+
+exports[`dismiss works on success + next fct 2`] = `
+Array [
+  Array [],
+]
+`;
+
+exports[`dismiss works on success 1`] = `
+Array [
+  Array [
+    CustomEvent {
+      "isTrusted": false,
+    },
+  ],
+]
+`;
+
+exports[`dismiss works with error + next fct 1`] = `
+Array [
+  Array [
+    CustomEvent {
+      "isTrusted": false,
+    },
+  ],
+]
+`;
+
+exports[`dismiss works with error + next fct 2`] = `
+Array [
+  Array [
+    "click",
+    [MockFunction],
+  ],
+]
+`;
+
+exports[`dismiss works with error 1`] = `
+Array [
+  Array [
+    CustomEvent {
+      "isTrusted": false,
+    },
+  ],
+]
+`;

package/tests/components/{__snapshots__ → ui/__snapshots__}/Map.test.js.snap

@@ -99,8 +99,8 @@ Array [
         ],
         "equirectangular",
       ],
-      "gvs-arrow-360",
-      "gvs-arrow-flat",
+      "pnx-arrow-360",
+      "pnx-arrow-flat",
     ],
   ],
   Array [
@@ -142,8 +142,8 @@ Array [
         ],
         "equirectangular",
       ],
-      "gvs-arrow-360",
-      "gvs-arrow-flat",
+      "pnx-arrow-360",
+      "pnx-arrow-flat",
     ],
   ],
   Array [
@@ -507,45 +507,18 @@ Array [
 exports[`setBackground works if raster is enabled 1`] = `
 Array [
   Array [
-    "gvs-aerial",
+    "pnx-aerial",
     "visibility",
     "visible",
   ],
 ]
 `;
 
-exports[`setBackground works if raster is enabled 2`] = `
-Array [
-  Array [
-    CustomEvent {
-      "isTrusted": false,
-    },
-  ],
-]
-`;
-
 exports[`setVisibleUsers works when no users exists 1`] = `Array []`;
 
-exports[`setVisibleUsers works when no users exists 2`] = `
-Array [
-  Array [
-    CustomEvent {
-      "isTrusted": false,
-    },
-  ],
-]
-`;
+exports[`setVisibleUsers works when no users exists 2`] = `Array []`;
 
-exports[`setVisibleUsers works when user already exist but is hidden 1`] = `
-Array [
-  CustomEvent {
-    "isTrusted": false,
-  },
-  CustomEvent {
-    "isTrusted": false,
-  },
-]
-`;
+exports[`setVisibleUsers works when user already exist but is hidden 1`] = `Array []`;
 
 exports[`setVisibleUsers works when user already exist but is hidden 2`] = `
 Array [
@@ -605,8 +578,8 @@ Array [
         ],
         "equirectangular",
       ],
-      "gvs-arrow-360",
-      "gvs-arrow-flat",
+      "pnx-arrow-360",
+      "pnx-arrow-flat",
     ],
   ],
   Array [
@@ -648,8 +621,8 @@ Array [
         ],
         "equirectangular",
       ],
-      "gvs-arrow-360",
-      "gvs-arrow-flat",
+      "pnx-arrow-360",
+      "pnx-arrow-flat",
     ],
   ],
   Array [

package/tests/components/{__snapshots__ → ui/__snapshots__}/Photo.test.js.snap

@@ -7,7 +7,9 @@ Object {
       "toLocaleDateString": [Function],
     },
     "license": "proprietary",
-    "producer": "User",
+    "producer": Array [
+      "User",
+    ],
   },
   "gps": Array [
     2.1822941,
@@ -57,6 +59,7 @@ Object {
       "nodeId": "127d9282-d082-46ca-bc09-4b0d8569dd2c",
     },
   ],
+  "origInstance": undefined,
   "panorama": Object {
     "basePanoData": [Function],
     "baseUrl": "https://geovisio.fr/api/pictures/0005086d-65eb-4a90-9764-86b3661aaa77/sd.webp",
@@ -117,7 +120,9 @@ Object {
       "toLocaleDateString": [Function],
     },
     "license": "proprietary",
-    "producer": "User",
+    "producer": Array [
+      "User",
+    ],
   },
   "gps": Array [
     2.1822941,
@@ -125,7 +130,49 @@ Object {
   ],
   "horizontalFov": 360,
   "id": "0005086d-65eb-4a90-9764-86b3661aaa77",
-  "links": Array [],
+  "links": Array [
+    Object {
+      "arrowStyle": Object {
+        "element": <img
+          alt=""
+          src="arrow_triangle.svg"
+        />,
+        "size": Object {
+          "height": 75,
+          "width": 75,
+        },
+      },
+      "gps": Array [
+        2.1822633,
+        48.9811134,
+      ],
+      "linkOffset": Object {
+        "yaw": -0,
+      },
+      "nodeId": "ccf5f468-38b8-4b42-8d79-b97f5391e0a3",
+    },
+    Object {
+      "arrowStyle": Object {
+        "element": <img
+          alt=""
+          src="arrow_triangle.svg"
+        />,
+        "size": Object {
+          "height": 75,
+          "width": 75,
+        },
+      },
+      "gps": Array [
+        2.1823272,
+        48.9810024,
+      ],
+      "linkOffset": Object {
+        "yaw": -0,
+      },
+      "nodeId": "127d9282-d082-46ca-bc09-4b0d8569dd2c",
+    },
+  ],
+  "origInstance": undefined,
   "panorama": Object {
     "basePanoData": [Function],
     "baseUrl": "https://geovisio.fr/api/pictures/0005086d-65eb-4a90-9764-86b3661aaa77/sd.webp",
@@ -188,12 +235,29 @@ Array [
 ]
 `;
 
-exports[`setTransitionDuration works 1`] = `
+exports[`setPicturesNavigation works 1`] = `
 Array [
   Array [
-    CustomEvent {
-      "isTrusted": false,
+    Object {
+      "value": "pic",
+    },
+  ],
+  Array [
+    Object {
+      "value": "seq",
+    },
+  ],
+  Array [
+    Object {
+      "value": "any",
+    },
+  ],
+  Array [
+    Object {
+      "value": "pic",
     },
   ],
 ]
 `;
+
+exports[`setTransitionDuration works 1`] = `Array []`;