@panoramax/web-viewer 5.0.0-develop-d7206514 → 5.0.0-develop-d26305dd

package/build/utils/i18n.js

@@ -0,0 +1,128 @@
+import T_be from "../translations/be.json" with { type: "json" };
+import T_da from "../translations/da.json" with { type: "json" };
+import T_de from "../translations/de.json" with { type: "json" };
+import T_en from "../translations/en.json" with { type: "json" };
+import T_eo from "../translations/eo.json" with { type: "json" };
+import T_es from "../translations/es.json" with { type: "json" };
+import T_fr from "../translations/fr.json" with { type: "json" };
+import T_hr from "../translations/hr.json" with { type: "json" };
+import T_hu from "../translations/hu.json" with { type: "json" };
+import T_it from "../translations/it.json" with { type: "json" };
+import T_ja from "../translations/ja.json" with { type: "json" };
+import T_nl from "../translations/nl.json" with { type: "json" };
+import T_pl from "../translations/pl.json" with { type: "json" };
+import T_pt from "../translations/pt.json" with { type: "json" };
+import T_pt_BR from "../translations/pt_BR.json" with { type: "json" };
+import T_sv from "../translations/sv.json" with { type: "json" };
+import T_tr from "../translations/tr.json" with { type: "json" };
+import T_uk from "../translations/uk.json" with { type: "json" };
+import T_zh_Hant from "../translations/zh_Hant.json" with { type: "json" };
+
+const FALLBACK_LOCALE = "en";
+const TRANSLATIONS = {
+	"be": T_be, "da": T_da, "de": T_de, "eo": T_eo, "en": T_en, "es": T_es, "fr": T_fr,
+	"hr": T_hr, "hu": T_hu, "it": T_it, "ja": T_ja, "nl": T_nl, "pl": T_pl, "pt": T_pt, "pt-br": T_pt_BR,
+	"sv": T_sv, "tr": T_tr, "uk": T_uk, "zh-hant": T_zh_Hant, "zh": T_zh_Hant,
+};
+
+/**
+ * Find best matching language regarding of list of supported languages and browser accepted languages
+ * @param {str[]} supportedTranslations List of supported languages
+ * @param {str} fallback The fallback language
+ * @returns The best matching language (in lowercase)
+ * @private
+ */
+export function autoDetectLocale(supportedTranslations, fallback) {
+	supportedTranslations = supportedTranslations.map(k => k.toLowerCase());
+
+	for (const navigatorLang of window.navigator.languages) {
+		let language = navigatorLang.toLowerCase();
+		// Convert browser code to weblate code
+		switch (language) {
+		case "zh-tw":
+		case "zh-hk":
+		case "zh-mo":
+			language = "zh-hant";
+			break;
+		case "zh-cn":
+		case "zh-sg":
+			language = "zh-hans";
+			break;
+		default:
+			if (language.length > 2 && !supportedTranslations.includes(language)) {
+				language = navigatorLang.substring(0, 2);
+			}
+			break;
+		}
+		const pair = supportedTranslations.find((pair) => pair === language);
+		if (pair) {
+			return pair;
+		}
+	}
+	return fallback;
+}
+
+/**
+ * Get text labels translations in given language
+ *
+ * @param {string} [lang] The language code (fr, en) (defaults to browser preferences)
+ * @returns {object} Translations in given language, with fallback to english
+ * @private
+ */
+export function getTranslations(lang = "") {
+	const myTr = JSON.parse(JSON.stringify(T_en));
+	let preferedTr;
+
+	// No specific lang set -> use browser lang
+	if(!lang) {
+		lang = autoDetectLocale(Object.keys(TRANSLATIONS), FALLBACK_LOCALE);
+	}
+
+	// Lang exists -> send it
+	if(TRANSLATIONS[lang] && lang !== "en") {
+		preferedTr = TRANSLATIONS[lang];
+	}
+
+	// Look for primary lang
+	if(lang.length > 2) {
+		const primaryLang = lang.substring(0, 2);
+		if(TRANSLATIONS[primaryLang]) { preferedTr = TRANSLATIONS[primaryLang]; }
+	}
+
+	// Merge labels to avoid missing ones
+	if(preferedTr) {
+		Object.entries(preferedTr).forEach(([k1, k2]) => {
+			Object.entries(k2).forEach(([k2, k3]) => {
+				// eslint-disable-next-line eqeqeq
+				if(Array.isArray(k3)) { k3 = k3.filter(v => v != null); }
+				myTr[k1][k2] = k3;
+			});
+		});
+	}
+
+	myTr.PREF_LANG = lang;
+
+	return myTr;
+}
+
+
+/**
+ * Get best matching label based on user language
+ * @param {object} labels The key->value list of labels
+ * @param {string} [lang] The language code (fr, en) (defaults to browser preferences)
+ * @returns {string} The best matching label
+ */
+export function getBestLabel(labels, lang) {
+	// All to lowercase to avoid matching issues
+	lang = lang ? lang.toLowerCase() : null;
+	labels = Object.fromEntries(Object.entries(labels).map(([k,v]) => [k.toLowerCase(), v]));
+
+	// No specific lang set -> use browser lang
+	if(!lang) {
+		lang = autoDetectLocale(Object.keys(labels), FALLBACK_LOCALE);
+	}
+
+	if(labels[lang]) { return labels[lang]; }
+	else if(lang.length > 2 && labels[lang.substring(0,2)]) { return labels[lang.substring(0,2)]; }
+	else { return labels[FALLBACK_LOCALE] || ""; }
+}

package/build/utils/index.js

@@ -0,0 +1,17 @@
+import * as geocoder from "./geocoder.js";
+import * as i18n from "./i18n.js";
+import * as indoor from "./indoor.js";
+import * as map from "./map.js";
+import * as picture from "./picture.js";
+import * as semantics from "./semantics.js";
+import * as services from "./services.js";
+import * as utils from "./utils.js";
+import * as widgets from "./widgets.js";
+
+export { geocoder, i18n, indoor, map, picture, semantics, services, utils, widgets };
+export {default as API} from "./API.js";
+export {default as InitParameters} from "./InitParameters.js";
+export {default as MapStyleComposer} from "./MapStyleComposer.js";
+export {default as PhotoAdapter} from "./PhotoAdapter.js";
+export {default as PresetsManager} from "./PresetsManager.js";
+export {default as URLHandler} from "./URLHandler.js";

package/build/utils/index_photoviewer.js

@@ -0,0 +1,14 @@
+// Lightweight export for PhotoViewer
+import * as i18n from "./i18n.js";
+import * as picture from "./picture.js";
+import * as semantics from "./semantics.js";
+import * as services from "./services.js";
+import * as utils from "./utils.js";
+import * as widgets from "./widgets.js";
+
+export { i18n, picture, semantics, services, utils, widgets };
+export {default as API} from "./API.js";
+export {default as InitParameters} from "./InitParameters.js";
+export {default as PhotoAdapter} from "./PhotoAdapter.js";
+export {default as PresetsManager} from "./PresetsManager.js";
+export {default as URLHandler} from "./URLHandler.js";

package/build/utils/indoor.js

@@ -0,0 +1,200 @@
+import { IndoorEqualSpritesURL } from "./services.js";
+import { createWebComp } from "./widgets.js";
+
+export const DISABLED_LEVEL = "-1000";
+const LEVEL_SEM_LAYER = "levels";
+
+
+export function isIndoorEqualAvailable() {
+	try {
+		// eslint-disable-next-line no-undef
+		IndoorEqual;
+		return true;
+	}
+	catch(e) {
+		return false;
+	}
+}
+
+/**
+ * Enables indoor= plugin on MapLibre
+ * @param {Map} map The MapLibre map
+ * @param {boolean} [forceSwitchOn=false] Set to true to skip init options check for default visibility
+ */
+export function initIndoorEqualOnMap(map, forceSwitchOn = false) {
+	if(map._options.indoor) {
+		if(isIndoorEqualAvailable()) {
+			if(!forceSwitchOn && map._options.indoor.visible === false) {
+				return;
+			}
+
+			// eslint-disable-next-line no-undef
+			map.indoorEqual = new IndoorEqual(map, map._options.indoor);
+			map.addControl(map.indoorEqual);
+			map.indoorEqual.loadSprite(IndoorEqualSpritesURL());
+
+			// Override level refresh to keep "disabled" state after map move
+			map.indoorEqual._refreshAfterLevelsUpdate = function() {
+				// eslint-disable-next-line eqeqeq
+				if (!this.levels.includes(this.level) && this.level != DISABLED_LEVEL) {
+					this.setLevel("0");
+				}
+			};
+
+			// Override updateLevels to take into account pictures levels
+			const SEM_SRC_ID = "sem-"+LEVEL_SEM_LAYER;
+			map.indoorEqual._updateLevels = function() {
+				if(
+					this.map.getSource(this.source.sourceId)
+					&& this.map.isSourceLoaded(this.source.sourceId)
+					&& this.map.getSource(SEM_SRC_ID)
+					&& this.map.isSourceLoaded(SEM_SRC_ID)
+				) {
+					let levels = new Set();
+
+					// Read levels from indoor= tiles
+					this.map.querySourceFeatures(this.source.sourceId, { sourceLayer: "area" })
+						.forEach(f => {
+							if(f.properties.class === "level") { return; }
+							if(f.properties.level !== undefined) {
+								levels.add(f.properties.level.toString());
+							}
+						});
+
+					// Read levels from Panoramax tiles
+					this.map.querySourceFeatures(SEM_SRC_ID, { sourceLayer: "layer" })
+						.forEach(f => {
+							if(f.properties["osm|level"] !== undefined) {
+								levels.add(f.properties["osm|level"].toString());
+							}
+						});
+
+					// If at least one level exist, add floor just to be sure it's always present
+					if(levels.size > 0) { levels.add("0"); }
+
+					if(levels.symmetricDifference(new Set(this.levels)).size !== 0) {
+						this.levels = [...levels].sort((a, b) => parseFloat(a) - parseFloat(b)).reverse();
+						this._emitLevelsChange();
+						this._refreshAfterLevelsUpdate();
+					}
+				}
+			};
+
+			// Store features IDs by level
+			map._indoorFeaturesIDs = { pictures: {}, sequences: {} };
+			map.on("sourcedata", LEVEL_SEM_LAYER, e => {
+				if(e.sourceId === SEM_SRC_ID) {
+					e.features.forEach(f => {
+						if(!map._indoorFeaturesIDs.pictures[f.properties["osm|level"]]) {
+							map._indoorFeaturesIDs.pictures[f.properties["osm|level"]] = new Set();
+						}
+						if(!map._indoorFeaturesIDs.sequences[f.properties["osm|level"]]) {
+							map._indoorFeaturesIDs.sequences[f.properties["osm|level"]] = new Set();
+						}
+						map._indoorFeaturesIDs.pictures[f.properties["osm|level"]].add(f.properties.picid);
+						map._indoorFeaturesIDs.sequences[f.properties["osm|level"]].add(f.properties.seqid);
+					});
+					updateIndoorLevelFilteringThrottled();
+				}
+			});
+
+			// Create semantic overlay layer for loading with-level pictures
+			const postMapLoad = () => {
+				map.addSemanticOverlay?.(
+					LEVEL_SEM_LAYER,
+					"\"semantics.osm|level\" IS NOT NULL",
+					{
+						type: "circle",
+						layout: { visibility: "visible" },
+						paint: { "circle-opacity": 0 }
+					}
+				);
+
+				// Load level from component/URL if any
+				if(forceSwitchOn && map._parent._initParams?.getMapPostInit()?.level === DISABLED_LEVEL) {
+					map.indoorEqual.setLevel("0");
+				}
+				else if(![null, undefined, ""].includes(map._parent._initParams?.getMapPostInit()?.level)) {
+					map.indoorEqual.setLevel(map._parent._initParams?.getMapPostInit()?.level);
+				}
+			};
+			// Wait for map load, done with loop due to an issue with styleload event not sent properly
+			if(map.isStyleLoaded()) { postMapLoad(); }
+			else {
+				const waitForStyle = setInterval(() => {
+					if(map.isStyleLoaded()) {
+						postMapLoad();
+						clearInterval(waitForStyle);
+					}
+				}, 250);
+			}
+
+			// Add map widget for level select
+			map._parent.grid.appendChild(createWebComp("pnx-level-select", {
+				slot: "bottom-right",
+				_parent: map._parent,
+				class: "pnx-only-map pnx-print-hidden",
+			}));
+
+			// Filter indoor pictures based on selected level
+			let updateIndoorLevelFilteringThrottler;
+			const updateIndoorLevelFiltering = () => {
+				// Disabled = show everything
+				if(map.indoorEqual.level === DISABLED_LEVEL) {
+					map.restrictVisibleFeatures("hide", "pictures", []);
+					map.restrictVisibleFeatures("hide", "sequences", []);
+				}
+				// Ground level = hide all other levels features
+				else if(map.indoorEqual.level === "0") {
+					// Pictures
+					const nonGroundPics = new Set();
+					Object.entries(map._indoorFeaturesIDs.pictures).forEach(([lvl, features]) => {
+						// eslint-disable-next-line eqeqeq
+						if(lvl != "0") { features.forEach(f => nonGroundPics.add(f)); }
+					});
+					map.restrictVisibleFeatures("hide", "pictures", [...nonGroundPics]);
+
+					// Sequences
+					let nonGroundSeqs = new Set();
+					Object.entries(map._indoorFeaturesIDs.sequences).forEach(([lvl, features]) => {
+						// eslint-disable-next-line eqeqeq
+						if(lvl != "0") {
+							nonGroundSeqs = nonGroundSeqs.union(features);
+						}
+					});
+					if(map._indoorFeaturesIDs.sequences["0"]) { nonGroundSeqs = nonGroundSeqs.difference(map._indoorFeaturesIDs.sequences["0"]); } // To skip multi-level sequences
+					map.restrictVisibleFeatures("hide", "sequences", [...nonGroundSeqs]);
+				}
+				// Other level = show only appropriate level features
+				else {
+					map.restrictVisibleFeatures(
+						"keep",
+						"pictures",
+						map._indoorFeaturesIDs.pictures[map.indoorEqual.level]
+							? [...map._indoorFeaturesIDs.pictures[map.indoorEqual.level]]
+							: []
+					);
+					map.restrictVisibleFeatures(
+						"keep",
+						"sequences",
+						map._indoorFeaturesIDs.sequences[map.indoorEqual.level]
+							? [...map._indoorFeaturesIDs.sequences[map.indoorEqual.level]]
+							: []
+					);
+				}
+			};
+			const updateIndoorLevelFilteringThrottled = () => {
+				if(updateIndoorLevelFilteringThrottler) {
+					clearTimeout(updateIndoorLevelFilteringThrottler);
+					updateIndoorLevelFilteringThrottler = undefined;
+				}
+				updateIndoorLevelFilteringThrottler = setTimeout(updateIndoorLevelFiltering, 250);
+			};
+
+			map.indoorEqual.on("levelchange", updateIndoorLevelFilteringThrottled);
+		}
+		else {
+			console.error("The indoor= plugin is not enabled. Please add the maplibre-gl-indoorequal before calling 'indoor' option of Panoramax Viewer.");
+		}
+	}
+}