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

package/tests/utils/__snapshots__/picture.test.js.snap

@@ -0,0 +1,327 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`apiFeatureToPSVNode works 1`] = `
+Object {
+  "caption": Object {
+    "date": mockConstructor {},
+    "license": "<a href=\\"https://spdx.org/licenses/CC-BY-SA-4.0.html\\" title=\\"\\" target=\\"_blank\\">CC-BY-SA-4.0</a>",
+    "producer": Array [
+      "Hopen111",
+    ],
+    "tz": "+00:00",
+  },
+  "gps": Array [
+    -92.70188245,
+    41.322064692,
+  ],
+  "horizontalFov": 360,
+  "id": "00000000-76a0-4bec-b19e-a56f51ef997d",
+  "links": Array [
+    Object {
+      "arrowStyle": Object {
+        "element": <img
+          alt=""
+          src="arrow_triangle.svg"
+        />,
+        "size": Object {
+          "height": 75,
+          "width": 75,
+        },
+      },
+      "gps": Array [
+        -92.701854443,
+        41.322047796,
+      ],
+      "linkOffset": Object {
+        "yaw": -5.3930673886624785,
+      },
+      "nodeId": "66ea29cd-941c-4201-977f-efb87bd5465e",
+    },
+    Object {
+      "arrowStyle": Object {
+        "element": <img
+          alt=""
+          src="arrow_triangle.svg"
+        />,
+        "size": Object {
+          "height": 75,
+          "width": 75,
+        },
+      },
+      "gps": Array [
+        -92.701910458,
+        41.322081588,
+      ],
+      "linkOffset": Object {
+        "yaw": -5.3930673886624785,
+      },
+      "nodeId": "5fb8e767-6fe3-4bcb-b19f-7031d9a64fc8",
+    },
+  ],
+  "origInstance": undefined,
+  "panorama": Object {
+    "basePanoData": [Function],
+    "baseUrl": "https://panoramax.openstreetmap.fr/api/pictures/00000000-76a0-4bec-b19e-a56f51ef997d/sd.jpg",
+    "cols": 8,
+    "hdUrl": "https://panoramax.openstreetmap.fr/api/pictures/00000000-76a0-4bec-b19e-a56f51ef997d/hd.jpg",
+    "origBaseUrl": "https://panoramax.openstreetmap.fr/api/pictures/00000000-76a0-4bec-b19e-a56f51ef997d/sd.jpg",
+    "rows": 4,
+    "thumbUrl": "https://panoramax.openstreetmap.fr/api/pictures/00000000-76a0-4bec-b19e-a56f51ef997d/thumb.jpg",
+    "tileUrl": [Function],
+    "width": 5376,
+  },
+  "properties": Object {
+    "created": "2024-09-04T02:40:11.836165+00:00",
+    "datetime": "2024-09-01T23:35:37.797105+00:00",
+    "datetimetz": "2024-09-01T23:35:37.797105+00:00",
+    "exif": Object {
+      "Xmp.GPano.CroppedAreaImageHeightPixels": "2688",
+      "Xmp.GPano.CroppedAreaImageWidthPixels": "5376",
+      "Xmp.GPano.CroppedAreaLeftPixels": "0",
+      "Xmp.GPano.CroppedAreaTopPixels": "0",
+      "Xmp.GPano.FullPanoHeightPixels": "2688",
+      "Xmp.GPano.FullPanoWidthPixels": "5376",
+      "Xmp.GPano.ProjectionType": "equirectangular",
+      "Xmp.GPano.UsePanoramaViewer": "True",
+    },
+    "geovisio:image": "https://panoramax.openstreetmap.fr/api/pictures/00000000-76a0-4bec-b19e-a56f51ef997d/hd.jpg",
+    "geovisio:producer": "Hopen111",
+    "geovisio:thumbnail": "https://panoramax.openstreetmap.fr/api/pictures/00000000-76a0-4bec-b19e-a56f51ef997d/thumb.jpg",
+    "license": "CC-BY-SA-4.0",
+    "original_file:name": "GS010837-003545.jpg",
+    "original_file:size": 788436,
+    "panoramax:horizontal_pixel_density": 15,
+    "pers:interior_orientation": Object {
+      "field_of_view": 360,
+      "sensor_array_dimensions": Array [
+        5376,
+        2688,
+      ],
+    },
+    "tiles:tile_matrix_sets": Object {
+      "geovisio": Object {
+        "identifier": "geovisio-00000000-76a0-4bec-b19e-a56f51ef997d",
+        "tileMatrix": Array [
+          Object {
+            "identifier": "0",
+            "matrixHeight": 4,
+            "matrixWidth": 8,
+            "scaleDenominator": 1,
+            "tileHeight": 672,
+            "tileWidth": 672,
+            "topLeftCorner": Array [
+              0,
+              0,
+            ],
+            "type": "TileMatrixType",
+          },
+        ],
+        "title": "GeoVisio tile matrix for picture 00000000-76a0-4bec-b19e-a56f51ef997d",
+        "type": "TileMatrixSetType",
+      },
+    },
+    "view:azimuth": 309,
+  },
+  "sequence": Object {
+    "id": "ec31c324-b43a-425e-a24c-3de56d7914c1",
+    "nextPic": "5fb8e767-6fe3-4bcb-b19f-7031d9a64fc8",
+    "prevPic": "66ea29cd-941c-4201-977f-efb87bd5465e",
+  },
+  "sphereCorrection": Object {},
+}
+`;
+
+exports[`filterRelatedPicsLinks works 1`] = `
+Array [
+  Object {
+    "arrowStyle": Object {
+      "element": <img
+        alt=""
+        src="arrow_turn.svg"
+      />,
+      "size": Object {
+        "height": 128,
+        "width": 42.666666666666664,
+      },
+    },
+    "gps": Array [
+      4.840134667,
+      45.756240466,
+    ],
+    "linkOffset": Object {
+      "yaw": -1.8849555921538759,
+    },
+    "nodeId": "aaa1ae2f-b48a-4291-972e-030fcd44760b",
+  },
+  Object {
+    "arrowStyle": Object {
+      "element": <img
+        alt=""
+        src="arrow_triangle.svg"
+      />,
+      "size": Object {
+        "height": 75,
+        "width": 75,
+      },
+    },
+    "gps": Array [
+      4.8401792,
+      45.7562024,
+    ],
+    "linkOffset": Object {
+      "yaw": -1.8849555921538759,
+    },
+    "nodeId": "38abdc16-b878-4762-a433-33e52e62ae9b",
+  },
+  Object {
+    "arrowStyle": Object {
+      "element": <img
+        alt=""
+        src="arrow_turn.svg"
+      />,
+      "size": Object {
+        "height": 128,
+        "width": 42.666666666666664,
+      },
+    },
+    "gps": Array [
+      4.8401379,
+      45.7561616,
+    ],
+    "linkOffset": Object {
+      "yaw": -1.8849555921538759,
+    },
+    "nodeId": "5e1d8461-fe5d-4d57-9c87-f2403baff37d",
+  },
+  Object {
+    "arrowStyle": Object {
+      "element": <img
+        alt=""
+        src="arrow_turn.svg"
+      />,
+      "size": Object {
+        "height": 128,
+        "width": 42.666666666666664,
+      },
+    },
+    "gps": Array [
+      4.8400918,
+      45.7561938,
+    ],
+    "linkOffset": Object {
+      "yaw": -1.8849555921538759,
+    },
+    "nodeId": "abff42de-2862-4b15-8c2a-dca22ed2deaf",
+  },
+  Object {
+    "arrowStyle": Object {
+      "element": <img
+        alt=""
+        src="arrow_triangle.svg"
+      />,
+      "size": Object {
+        "height": 75,
+        "width": 75,
+      },
+    },
+    "gps": Array [
+      4.8400633,
+      45.7562389,
+    ],
+    "linkOffset": Object {
+      "yaw": -1.8849555921538759,
+    },
+    "nodeId": "1c5025ed-3e03-4cf0-8879-7ed9091a9e33",
+  },
+]
+`;
+
+exports[`getCroppedPanoData works with API props 1`] = `
+Object {
+  "croppedHeight": 2606,
+  "croppedWidth": 15872,
+  "croppedX": 0,
+  "croppedY": 2538,
+  "fullHeight": 7936,
+  "fullWidth": 15872,
+}
+`;
+
+exports[`getCroppedPanoData works with API props and unneeded 1`] = `Object {}`;
+
+exports[`getCroppedPanoData works with exif tags 1`] = `
+Object {
+  "croppedHeight": 2606,
+  "croppedWidth": 15872,
+  "croppedX": 0,
+  "croppedY": 2538,
+  "fullHeight": 7936,
+  "fullWidth": 15872,
+}
+`;
+
+exports[`getCroppedPanoData works with exif tags and unneeded 1`] = `Object {}`;
+
+exports[`getNodeCaption works with date + 2 producers 1`] = `
+Object {
+  "date": Object {
+    "toLocaleDateString": [Function],
+  },
+  "producer": Array [
+    "GeoVisio Corp.",
+    "PanierAvide",
+  ],
+}
+`;
+
+exports[`getNodeCaption works with date + producer 1`] = `
+Object {
+  "date": Object {
+    "toLocaleDateString": [Function],
+  },
+  "producer": Array [
+    "PanierAvide",
+  ],
+}
+`;
+
+exports[`getNodeCaption works with date 1`] = `
+Object {
+  "date": Object {
+    "toLocaleDateString": [Function],
+  },
+}
+`;
+
+exports[`getNodeCaption works with date+tz 1`] = `
+Object {
+  "date": Object {
+    "toLocaleDateString": [Function],
+  },
+  "tz": "-03:00",
+}
+`;
+
+exports[`getNodeCaption works with producer 1`] = `
+Object {
+  "producer": Array [
+    "PanierAvide",
+  ],
+}
+`;
+
+exports[`getSphereCorrection works with API props 1`] = `
+Object {
+  "pan": 0.7330382858376184,
+  "roll": 1.260127719939906,
+  "tilt": -0.5235987755982988,
+}
+`;
+
+exports[`getSphereCorrection works with exif tags 1`] = `
+Object {
+  "pan": 0.7330382858376184,
+  "roll": 1.260127719939906,
+  "tilt": -0.5235987755982988,
+}
+`;

package/tests/utils/__snapshots__/widgets.test.js.snap

@@ -0,0 +1,19 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`fa works 1`] = `
+<svg
+  aria-hidden="true"
+  class="svg-inline--fa fa-chevron-down"
+  data-icon="chevron-down"
+  data-prefix="fas"
+  focusable="false"
+  role="img"
+  viewBox="0 0 512 512"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <path
+    d="M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z"
+    fill="currentColor"
+  />
+</svg>
+`;

package/tests/utils/geocoder.test.js

@@ -0,0 +1,37 @@
+import * as geocoder from "../../src/utils/geocoder";
+import GEOCODER_NOMINATIM from "../data/Map_geocoder_nominatim.json";
+import GEOCODER_BAN from "../data/Map_geocoder_ban.json";
+
+describe("forwardGeocodingNominatim", () => {
+	it("works", () => {
+		// Mock API search
+		global.fetch = jest.fn(() => Promise.resolve({
+			json: () => GEOCODER_NOMINATIM
+		}));
+
+		// Search config
+		const cfg = { query: "bla", limit: 5, bbox: "17.7,-45.2,17.8,-45.1" };
+
+		return geocoder.forwardGeocodingNominatim(cfg).then(res => {
+			expect(global.fetch.mock.calls).toEqual([["https://nominatim.openstreetmap.org/search?q=bla&limit=5&viewbox=17.7%2C-45.2%2C17.8%2C-45.1&format=geojson&polygon_geojson=1&addressdetails=1"]]);
+			expect(res).toMatchSnapshot();
+		});
+	});
+});
+
+describe("forwardGeocodingBAN", () => {
+	it("works", () => {
+		// Mock API search
+		global.fetch = jest.fn(() => Promise.resolve({
+			json: () => GEOCODER_BAN
+		}));
+
+		// Search config
+		const cfg = { query: "bla", limit: 5, proximity: "17.7,-45.2" };
+
+		return geocoder.forwardGeocodingBAN(cfg).then(res => {
+			expect(global.fetch.mock.calls).toEqual([["https://api-adresse.data.gouv.fr/search/?q=bla&limit=5&lat=17.7&lon=-45.2"]]);
+			expect(res).toMatchSnapshot();
+		});
+	});
+});

package/tests/utils/{I18n.test.js → i18n.test.js}

@@ -1,4 +1,4 @@
-import { autoDetectLocale, getTranslations } from "../../src/utils/I18n";
+import { autoDetectLocale, getTranslations } from "../../src/utils/i18n";
 
 describe("autoDetectLocale", () => {
     // Mock the window.navigator.languages
@@ -32,24 +32,24 @@ describe("autoDetectLocale", () => {
         expect(autoDetectLocale(supportedTranslations, fallback)).toBe("en");
     });
 
-    it("returns zh_Hant for Chinese Traditional locales", () => {
+    it("returns zh-Hant for Chinese Traditional locales", () => {
         Object.defineProperty(window.navigator, "languages", {
             value: ["zh-TW"],
             configurable: true
         });
-        const supportedTranslations = ["zh_Hant", "zh_Hans", "en"];
+        const supportedTranslations = ["zh-Hant", "zh-Hans", "en"];
         const fallback = "en";
-        expect(autoDetectLocale(supportedTranslations, fallback)).toBe("zh_Hant");
+        expect(autoDetectLocale(supportedTranslations, fallback)).toBe("zh-Hant");
     });
 
-    it("returns zh_Hans for Chinese Simplified locales", () => {
+    it("returns zh-Hans for Chinese Simplified locales", () => {
         Object.defineProperty(window.navigator, "languages", {
             value: ["zh-CN"],
             configurable: true
         });
-        const supportedTranslations = ["zh_Hant", "zh_Hans", "en"];
+        const supportedTranslations = ["zh-Hant", "zh-Hans", "en"];
         const fallback = "en";
-        expect(autoDetectLocale(supportedTranslations, fallback)).toBe("zh_Hans");
+        expect(autoDetectLocale(supportedTranslations, fallback)).toBe("zh-Hans");
     });
 
     it("returns first matched language even when navigator language has region", () => {
@@ -105,7 +105,7 @@ describe("getTranslations", () => {
 	});
 
 	it("works when primary lang code exists", () => {
-		const res = getTranslations("fr_FR");
+		const res = getTranslations("fr-FR");
 		expect(res.map.loading).toBe("Chargement…");
 	});
 });

package/tests/utils/map.test.js

@@ -0,0 +1,126 @@
+import * as map from "../../src/utils/map";
+
+describe("getThumbGif", () => {
+	it("works", () => {
+		const lang = { loading: "Loading..." };
+		const res = map.getThumbGif(lang);
+		expect(res).toBeDefined();
+		expect(res.tagName).toBe("IMG");
+		expect(res.alt).toBe(lang.loading);
+		expect(res.title).toBe(lang.loading);
+	});
+});
+
+describe("isLabelLayer", () => {
+	it("works with just text-field", () => {
+		const layer = { type: "symbol", layout: { "text-field": "Label" } };
+		expect(map.isLabelLayer(layer)).toBe(true);
+	});
+
+	it("works with text-field + minzoom < 15", () => {
+		const layer = { type: "symbol", layout: { "text-field": "Label" }, minzoom: 10 };
+		expect(map.isLabelLayer(layer)).toBe(true);
+	});
+
+	it("works with text-field + minzoom >= 15", () => {
+		const layer = { type: "symbol", layout: { "text-field": "Label" }, minzoom: 15 };
+		expect(map.isLabelLayer(layer)).toBe(false);
+	});
+
+	it("works with non-symbol layer", () => {
+		const layer = { type: "fill", layout: { "text-field": "Label" } };
+		expect(map.isLabelLayer(layer)).toBe(false);
+	});
+
+	it("works without text-field", () => {
+		const layer = { type: "symbol", layout: {} };
+		expect(map.isLabelLayer(layer)).toBe(false);
+	});
+});
+
+describe("getUserLayerId", () => {
+	it("works with default tiles", () => {
+		expect(map.getUserLayerId("geovisio", "pictures")).toBe("geovisio_pictures");
+	});
+
+	it("works with specific user tiles", () => {
+		expect(map.getUserLayerId("toto", "pictures")).toBe("geovisio_toto_pictures");
+	});
+});
+
+describe("getUserSourceId", () => {
+	it("works with default tiles", () => {
+		expect(map.getUserSourceId("geovisio")).toBe("geovisio");
+	});
+
+	it("works with specific user tiles", () => {
+		expect(map.getUserSourceId("toto")).toBe("geovisio_toto");
+	});
+});
+
+describe("switchCoefValue", () => {
+	it("works", () => {
+		const l = {id: "bla", paint: { "circle-radius": ["bla", ["get", "coef"]]}, layout: {"circle-sort": "coef"}};
+		const res = map.switchCoefValue(l, "coef_360");
+		expect(res).toEqual({id: "bla", paint: { "circle-radius": ["bla", ["get", "coef_360"]]}, layout: {"circle-sort": "coef_360"}})
+	});
+});
+
+
+Object.defineProperty(window, "localStorage", { value: {
+	setItem: jest.fn(),
+	getItem: jest.fn(),
+} });
+
+describe("getMapParamsFromLocalStorage", () => {
+	it("should return an empty object if no params are stored", () => {
+		localStorage.getItem.mockReturnValue(null);
+		const result = map.getMapParamsFromLocalStorage();
+		expect(result).toEqual({});
+	});
+
+	it("should return parsed params if they exist in localStorage", () => {
+		const params = { center: { lat: "48.8566000", lng: "2.3522000" }, zoom: "10.0", background: "aerial", theme: "age" };
+		localStorage.getItem.mockReturnValue(JSON.stringify(params));
+		const result = map.getMapParamsFromLocalStorage();
+		expect(localStorage.getItem.mock.calls).toMatchSnapshot();
+		expect(result).toEqual(params);
+	});
+
+	it("should return an empty object if JSON parsing fails", () => {
+		console.warn = jest.fn();
+		localStorage.getItem.mockReturnValue("invalid-json");
+		const result = map.getMapParamsFromLocalStorage();
+		expect(result).toEqual({});
+		expect(console.warn.mock.calls[0][0]).toEqual("Can't read map parameters stored in localStorage");
+	});
+});
+
+describe("saveMapParamsToLocalStorage", () => {
+	const mockMap = {
+		getCenter: jest.fn().mockReturnValue({ lat: 48.8566, lng: 2.3522 }),
+		getZoom: jest.fn().mockReturnValue(10),
+		getBackground: jest.fn().mockReturnValue("streets"),
+		_mapFilters: { theme: "qualityscore" },
+		on: jest.fn(),
+	};
+
+	beforeEach(() => {
+		jest.clearAllMocks();
+	});
+
+	it("should add event listeners to the map", () => {
+		map.saveMapParamsToLocalStorage(mockMap);
+		expect(mockMap.on).toHaveBeenCalledWith("background-changed", expect.any(Function));
+		expect(mockMap.on).toHaveBeenCalledWith("filters-changed", expect.any(Function));
+		expect(mockMap.on).toHaveBeenCalledWith("moveend", expect.any(Function));
+		expect(mockMap.on).toHaveBeenCalledWith("zoomend", expect.any(Function));
+		expect(mockMap.on).toHaveBeenCalledWith("dragend", expect.any(Function));
+		expect(mockMap.on).toHaveBeenCalledWith("boxzoomend", expect.any(Function));
+	});
+
+	it("should save map parameters to localStorage", () => {
+		map.saveMapParamsToLocalStorage(mockMap);
+		expect(localStorage.setItem.mock.calls).toMatchSnapshot();
+	});
+});