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

package/build/utils/URLHandler.js

@@ -1,426 +0,0 @@
-import {
-	MAP_FILTERS_JS2URL, alterMapState, alterPSVState, alterPhotoViewerState, alterViewerState
-} from "./InitParameters.js";
-import { BASEMAPS_DEFAULT_IDS } from "./MapStyleComposer.js";
-
-// List of supported parameters
-const MANAGED_PARAMETERS = [
-	"speed", "nav", "focus", "pic", "xyz", "map",
-	"background", "users", "s", "xywh",
-	"annot", "seq", "overlay", "level",
-].concat(Object.values(MAP_FILTERS_JS2URL));
-
-// Events to listen on parent and PSV
-const UPDATE_PARENT_EVENTS = ["focus-changed", "pictures-navigation-changed"];
-const UPDATE_PSV_EVENTS = ["position-updated", "zoom-updated", "view-rotated", "picture-loaded", "transition-duration-changed", "annotation-focused", "annotations-unfocused"];
-const UPDATE_MAP_EVENTS = ["moveend", "zoomend", "boxzoomend", "styledata"];
-const UPDATE_MSC_EVENTS = ["filters-changed", "theme-changed", "panoramax-changed", "basemap-changed"];
-
-
-/**
- * Updates the URL query part with various parent component information.
- *
- * Note that you may call `listenToChanges()` for this class to be effective once parent is ready-enough.
- *
- * @class Panoramax.utils.URLHandler
- * @typicalname urlHandler
- * @param {Panoramax.components.core.Basic} parent The parent component
- * @fires Panoramax.utils.URLHandler#url-changed
- */
-export default class URLHandler extends EventTarget {
-	constructor(parent) {
-		super();
-		this._parent = parent;
-		this._delay = null;
-	}
-
-	/**
-	 * Start listening to URL & parent changes through events.
-	 * This leads to parent & URL updates.
-	 * @memberof Panoramax.utils.URLHandler#
-	 */
-	listenToChanges() {
-		window.addEventListener("popstate", this._onURLChange.bind(this), false);
-		UPDATE_PARENT_EVENTS.forEach(e => this._parent.addEventListener(e, this._onParentChange.bind(this)));
-		UPDATE_PSV_EVENTS.forEach(e => this._parent.psv.addEventListener(e, this._onParentChange.bind(this)));
-		if(this._parent.map) {
-			UPDATE_MAP_EVENTS.forEach(e => this._parent.map.on(e, this._onParentChange.bind(this)));
-			UPDATE_MSC_EVENTS.forEach(e => this._parent.mapStyleComposer.addEventListener(e, this._onParentChange.bind(this)));
-			this._parent.map.indoorEqual?.on("levelchange", this._onParentChange.bind(this));
-		}
-	}
-
-	/**
-	 * Call this function to stop listening to global events.
-	 * @memberof Panoramax.utils.URLHandler#
-	 */
-	destroy() {
-		window.removeEventListener("popstate", this._onURLChange);
-	}
-
-	/**
-	 * Compute next values to insert in URL
-	 * @returns {object} Query parameters
-	 * @memberof Panoramax.utils.URLHandler#
-	 */
-	nextURLParams() {
-		let hashParts = {};
-
-		if(typeof this._parent.psv.getTransitionDuration() === "number") {
-			hashParts.speed = this._parent.psv.getTransitionDuration();
-		}
-
-		if(![null, "any"].includes(this._parent.psv.getPicturesNavigation())) {
-			hashParts.nav = this._parent.psv.getPicturesNavigation();
-		}
-
-		if(this._parent.psv.getPictureId()) {
-			hashParts.pic = this._parent.psv.getPictureId();
-		}
-		const picMeta = this._parent.psv.getPictureMetadata();
-		if (picMeta) {
-			hashParts.xyz = this.currentPSVString();
-			if(picMeta.sequence?.id) { hashParts.seq = picMeta.sequence.id; }
-		}
-
-		const annots = this._parent.psv.getSelectedAnnotations();
-		if(annots?.length > 0) {
-			hashParts.annot = annots[0];
-		}
-
-		if(this._parent.map?.loaded) { // Use this test to avoid empty object checking in
-			hashParts.map = this.currentMapString();
-			hashParts.focus = "pic";
-			if(this._parent.isMapWide()) { hashParts.focus = "map"; }
-			if(this._parent.mapStyleComposer?.hasManyBasemaps?.() && this._parent.mapStyleComposer?.basemap) {
-				hashParts.background = this._parent.mapStyleComposer.basemap;
-			}
-
-			if(this._parent.mapStyleComposer?.panoramax) {
-				hashParts.users = this._parent.mapStyleComposer.panoramax;
-			}
-
-			if(this._parent.mapStyleComposer.panoramaxFilters) {
-				for(let k in MAP_FILTERS_JS2URL) {
-					if(this._parent.mapStyleComposer.panoramaxFilters[k]) {
-						hashParts[MAP_FILTERS_JS2URL[k]] = this._parent.mapStyleComposer.panoramaxFilters[k];
-					}
-				}
-				if(hashParts.pic_score) {
-					if(!Array.isArray(hashParts.pic_score)) { hashParts.pic_score = hashParts.pic_score.split(","); }
-					if(hashParts.pic_score.length === 5) {
-						delete hashParts.pic_score;
-					}
-					else {
-						const mapping = [null, "E", "D", "C", "B", "A"];
-						hashParts.pic_score = hashParts.pic_score.map(v => mapping[v]).join("");
-					}
-				}
-				if(Array.isArray(hashParts.gps) && hashParts.gps.length === 5) {
-					delete hashParts.gps;
-				}
-			}
-
-			if(this._parent.map?.getSemanticOverlays) {
-				const visibleSem = this._parent.map.getSemanticOverlays()
-					.filter(l => this._parent.mapStyleComposer.dataOverlays.has(l.source))
-					.map(l => l.id);
-				if(visibleSem.length > 0) {
-					hashParts.overlay = visibleSem.join(",");
-				}
-			}
-
-			if(this._parent.map?.indoorEqual) {
-				hashParts.level = this._parent.map.indoorEqual.level;
-			}
-		}
-		return hashParts;
-	}
-
-	/**
-	 * Compute next URL query string (based on `nextURLParams()`)
-	 * @memberof Panoramax.utils.URLHandler#
-	 * @return {string} The query string
-	 */
-	nextURLString() {
-		let hash = "";
-
-		Object.entries(this.nextURLParams())
-			.sort((a,b) => a[0].localeCompare(b[0]))
-			.forEach(entry => {
-				let [ hashName, value ] = entry;
-				let found = false;
-				const parts = hash.split("&").map(part => {
-					const key = part.split("=")[0];
-					if (key === hashName) {
-						found = true;
-						return `${key}=${value}`;
-					}
-					return part;
-				}).filter(a => a);
-				if (!found) {
-					parts.push(`${hashName}=${value}`);
-				}
-				hash = `${parts.join("&")}`;
-			});
-
-		return `?${hash}`.replace(/^\?+/, "?");
-	}
-
-	/**
-	 * Transforms current URL query string into key->value object
-	 * @param {boolean} [readFromHash=false] Switch to reading from hash URL part (for retro-compatibility)
-	 * @return {object} Key-value read from current URL query
-	 * @memberof Panoramax.utils.URLHandler#
-	 */
-	currentURLParams(readFromHash = false) {
-		// Get the current hash from location, stripped from its number sign
-		const hash = (readFromHash ? window.location.hash : window.location.search)
-			.replace(/^[?#]/, "")
-			.replace(/&/g, "&");
-		
-		// Split the parameter-styled hash into parts and find the value we need
-		let keyvals = {};
-		hash.split("&").map(
-			part => part.split("=")
-		)
-			.filter(part => part[0] !== undefined && part[0].length > 0 && MANAGED_PARAMETERS.includes(part[0]))
-			.forEach(part => {
-				keyvals[part[0]] = part[1];
-			});
-
-		// If hash is compressed
-		if(keyvals.s) {
-			const shortVals = Object.fromEntries(
-				decodeURIComponent(keyvals.s)
-					.split(";")
-					.map(kv => [kv[0], kv.substring(1)])
-			);
-
-			keyvals = {};
-
-			// Used letters: a b c d e f g k m n o p q l s t u v
-			// NOTE: seq=* isn't used in shortlinks
-			// Focus
-			if(shortVals.f === "m") { keyvals.focus = "map"; }
-			else if(shortVals.f === "p") { keyvals.focus = "pic"; }
-			else if(shortVals.f === "t") { keyvals.focus = "meta"; }
-
-			// Speed
-			if(shortVals.s !== "") { keyvals.speed = parseFloat(shortVals.s) * 100; }
-
-			// Nav
-			if(shortVals.n === "a") { keyvals.nav = "any"; }
-			else if(shortVals.n === "s") { keyvals.nav = "seq"; }
-			if(["n", "p"].includes(shortVals.n)) { keyvals.nav = "pic"; }
-
-			// Pic
-			if(shortVals.p !== "") { keyvals.pic = shortVals.p; }
-
-			// Annotation
-			if(shortVals.a !== "") { keyvals.annot = shortVals.a; }
-
-			// XYZ
-			if(shortVals.c !== "") { keyvals.xyz = shortVals.c; }
-
-			// Map
-			if(shortVals.m !== "") { keyvals.map = shortVals.m; }
-
-			// Date
-			if(shortVals.d !== "") { keyvals.date_from = shortVals.d; }
-			if(shortVals.e !== "") { keyvals.date_to = shortVals.e; }
-
-			// Pic type
-			if(shortVals.t === "f") { keyvals.pic_type = "flat"; }
-			else if(shortVals.t === "e") { keyvals.pic_type = "equirectangular"; }
-
-			// Camera
-			if(shortVals.k !== "") { keyvals.camera = shortVals.k; }
-
-			// Theme
-			if(shortVals.v === "d") { keyvals.theme = "default"; }
-			else if(shortVals.v === "a") { keyvals.theme = "age"; }
-			else if(shortVals.v === "t") { keyvals.theme = "type"; }
-			else if(shortVals.v === "s") { keyvals.theme = "score"; }
-			else if(shortVals.v === "g") { keyvals.theme = "gps"; }
-
-			// Background
-			if(shortVals.b === "s") { keyvals.background = "streets"; }
-			else if(shortVals.b === "a") { keyvals.background = "aerial"; }
-
-			// Users
-			if(shortVals.u !== "") { keyvals.users = shortVals.u; }
-
-			// Photoscore
-			if(shortVals.q !== "") { keyvals.pic_score = shortVals.q; }
-
-			// GPS precision
-			if(shortVals.g !== "") { keyvals.gps = shortVals.g; }
-
-			// Overlays
-			if(shortVals.o !== "") { keyvals.overlay = shortVals.o; }
-
-			// Level
-			if(shortVals.l !== "") { keyvals.level = shortVals.l; }
-		}
-
-		return keyvals;
-	}
-
-	/**
-	 * Get string representation of map position
-	 * @returns {string} zoom/lat/lon or zoom/lat/lon/bearing/pitch
-	 * @memberof Panoramax.utils.URLHandler#
-	 */
-	currentMapString() {
-		if(!this._parent.map?.loaded) { return ""; }
-
-		const center = this._parent.map.getCenter(),
-			zoom = Math.round(this._parent.map.getZoom() * 100) / 100,
-			// Derived from equation: 512px * 2^z / 360 / 10^d < 0.5px
-			precision = Math.ceil((zoom * Math.LN2 + Math.log(512 / 360 / 0.5)) / Math.LN10),
-			m = Math.pow(10, precision),
-			lng = Math.round(center.lng * m) / m,
-			lat = Math.round(center.lat * m) / m,
-			bearing = this._parent.map.getBearing(),
-			pitch = this._parent.map.getPitch();
-		let hash = `${zoom}/${lat}/${lng}`;
-
-		if (bearing || pitch) {hash += (`/${Math.round(bearing * 10) / 10}`);}
-		if (pitch) {hash += (`/${Math.round(pitch)}`);}
-
-		return hash;
-	}
-
-	/**
-	 * Get PSV view position as string
-	 * @returns {string} x/y/z
-	 * @memberof Panoramax.utils.URLHandler#
-	 */
-	currentPSVString() {
-		const xyz = this._parent.psv.getXYZ();
-		const x = xyz.x.toFixed(2),
-			y = xyz.y.toFixed(2),
-			z = Math.round(xyz.z || 0);
-		return `${x}/${y}/${z}`;
-	}
-
-	/**
-	 * Updates map and PSV according to current hash values
-	 * @private
-	 * @memberof Panoramax.utils.URLHandler#
-	 */
-	_onURLChange() {
-		let vals = this.currentURLParams();
-
-		if(this._parent.getClassName() === "Viewer") { alterViewerState(this._parent, vals); }
-		else { alterPhotoViewerState(this._parent, vals); }
-
-		alterPSVState(this._parent.psv, vals);
-		if(this._parent.map) { alterMapState(this._parent.map, vals); }
-	}
-
-	/**
-	 * Get short link URL (query replaced by Base64)
-	 * @returns {str} The short link URL
-	 * @memberof Panoramax.utils.URLHandler#
-	 */
-	nextShortLink(baseUrl) {
-		const url = new URL(baseUrl);
-		const hashParts = this.nextURLParams();
-		const shortVals = {
-			f: (hashParts.focus || "").substring(0, 1),
-			s: !isNaN(parseInt(hashParts.speed)) ? Math.floor(parseInt(hashParts.speed)/100) : undefined,
-			n: (hashParts.nav || "").substring(0, 1),
-			p: hashParts.pic,
-			c: hashParts.xyz,
-			m: hashParts.map,
-			d: hashParts.date_from,
-			e: hashParts.date_to,
-			t: (hashParts.pic_type || "").substring(0, 1),
-			k: hashParts.camera,
-			v: (hashParts.theme || "").substring(0, 1),
-			b: BASEMAPS_DEFAULT_IDS.includes(hashParts.background) ? (hashParts.background || "").substring(0, 1) : (hashParts.background || ""),
-			u: hashParts.users,
-			q: hashParts.pic_score,
-			a: hashParts.annot,
-			g: hashParts.gps,
-			o: hashParts.overlay,
-			l: hashParts.level,
-		};
-		const short = Object.entries(shortVals)
-			// eslint-disable-next-line eqeqeq
-			.filter(([,v]) => v != undefined && v != "")
-			.map(([k,v]) => `${k}${v}`)
-			.join(";");
-		url.search = `s=${short}`;
-		return url;
-	}
-
-	/**
-	 * Returns a string containing only parameters out of URLHandler scope
-	 * @param {URL} prevUrl The previously set URL
-	 * @memberof Panoramax.utils.URLHandler#
-	 */
-	getUnmanagedParameters(prevUrl) {
-		return new URLSearchParams(
-			Array.from(prevUrl.searchParams)
-				.filter(([k]) => !MANAGED_PARAMETERS.includes(k))
-		).toString();
-	}
-
-	/**
-	 * Changes the URL hash using current viewer parameters
-	 * @private
-	 * @memberof Panoramax.utils.URLHandler#
-	 */
-	_onParentChange() {
-		if(this._delay) {
-			clearTimeout(this._delay);
-			this._delay = null;
-		}
-
-		this._delay = setTimeout(() => {
-			const prevUrl = new URL(window.location.href);
-			const nextUrl = new URL(window.location.href);
-			const unmanaged = this.getUnmanagedParameters(prevUrl);
-			nextUrl.search = this._parent ? this.nextURLString() + (unmanaged.length > 0 ? "&"+unmanaged : ""): "";
-
-			// Clear out hash if older parameters appear
-			if(Object.keys(this.currentURLParams(true)).length > 0) { nextUrl.hash = ""; }
-
-			// Skip hash update if no changes
-			if(prevUrl.search === nextUrl.search) { return; }
-
-			const prevPic = this.currentURLParams().pic || "";
-			const nextPic = this._parent?.psv?.getPictureId?.() || "";
-
-			try {
-				// If different pic, add entry in browser history
-				// eslint-disable-next-line eqeqeq
-				if(prevPic != nextPic) {
-					window.history.pushState(window.history.state, null, nextUrl.href);
-				}
-				// If same pic, just update viewer params
-				else {
-					window.history.replaceState(window.history.state, null, nextUrl.href);
-				}
-
-				if(this._parent) {
-					/**
-					 * URL changed event
-					 * @event Panoramax.utils.URLHandler#url-changed
-					 * @type {CustomEvent}
-					 * @property {string} detail.url The new used URL
-					 */
-					const event = new CustomEvent("url-changed", { detail: {url: nextUrl.href}});
-					this.dispatchEvent(event);
-				}
-			} catch (SecurityError) {
-				// IE11 does not allow this if the page is within an iframe created
-				// With iframe.contentWindow.document.write(...).
-				// https://github.com/mapbox/mapbox-gl-js/issues/7410
-			}
-		}, 500);
-	}
-}

package/build/utils/geocoder.js

@@ -1,203 +0,0 @@
-import { AdresseDataGouvBaseURL, NominatimBaseUrl } from "./services.js";
-
-const PLACETYPE_ZOOM =  {
-	"house": 20,
-	"housenumber": 20,
-	"street": 18,
-	"locality": 15,
-	"district": 13,
-	"municipality": 12,
-	"city": 12,
-	"county": 8,
-	"region": 7,
-	"state": 7,
-	"country": 5
-};
-
-/**
- * Transforms a set of parameters into an URL-ready string
- * It also removes null/undefined values
- *
- * @param {object} params The parameters object
- * @return {string} The URL query part
- * @private
- */
-function geocoderParamsToURLString(params) {
-	let p = {};
-	Object.entries(params)
-		.filter(e => e[1] !== undefined && e[1] !== null)
-		.forEach(e => p[e[0]] = e[1]);
-
-	return new URLSearchParams(p).toString();
-}
-
-/**
- * Nominatim (OSM) geocoder, ready to use for our Map
- * @private
- */
-export function forwardGeocodingNominatim(config) {
-	// Transform parameters into Nominatim format
-	const params = {
-		q: config.query,
-		countrycodes: config.countries,
-		limit: config.limit,
-		viewbox: config.bbox,
-	};
-
-	return fetch(`${NominatimBaseUrl()}/search?${geocoderParamsToURLString(params)}&format=geocodejson&addressdetails=1`)
-		.then(res => res.json())
-		.then(res => {
-			const finalRes = { features: [] };
-			const listedNames = [];
-			(res.features || []).forEach(f => {
-				const plname = geocodeJsonToPlaceName(f.properties?.geocoding) || f.properties?.geocoding?.label;
-				if(!listedNames.includes(plname)) {
-					finalRes.features.push({
-						place_type: ["place"],
-						place_name: plname,
-						center: f.geometry.coordinates,
-						zoom: PLACETYPE_ZOOM[f.properties?.geocoding?.type],
-					});
-					listedNames.push(plname);
-				}
-			});
-			return finalRes;
-		});
-}
-
-export function reverseGeocodingNominatim(lat, lon) {
-	return fetch(`${NominatimBaseUrl()}/reverse?lat=${lat}&lon=${lon}&zoom=18&format=geocodejson`)
-		.then(res => res.json())
-		.then(res => geocodeJsonToPlaceName(res?.features?.shift()?.properties?.geocoding));
-}
-
-/**
- * Base adresse nationale (FR) geocoder, ready to use for our Map
- * @param {object} config Configuration sent by MapLibre GL Geocoder, following the geocoderApi format ( https://maplibre.org/maplibre-gl-geocoder/types/MaplibreGeocoderApiConfig.html )
- * @returns {object} GeoJSON Feature collection in Carmen GeoJSON format ( https://maplibre.org/maplibre-gl-geocoder/types/CarmenGeojsonFeature.html )
- * @private
- */
-export function forwardGeocodingBAN(config) {
-	return forwardGeocodingStandard(config, AdresseDataGouvBaseURL());
-}
-
-/**
- * Transforms GeocodeJSON search result into a nice-to-display address.
- * @param {object} props The GecodeJSON API feature properties
- * @returns {string} The clean-up string for display
- * @private
- */
-function geocodeJsonToPlaceName(props) {
-	// API format @ https://github.com/geocoders/geocodejson-spec/blob/master/draft/README.md
-	if(!props || typeof props !== "object") { return ""; }
-
-	// P1 = main name, P2=locality-like, P3=country+high-level admin
-	let p1 = props.name;
-	let p2 = [], p3 = [];
-
-	switch(props.type) {
-	case "hamlet":
-	case "croft":
-	case "isolated_dwelling":
-	case "neighbourhood":
-	case "allotments":
-	case "quarter":
-	case "farm":
-	case "farmyard":
-	case "industrial":
-	case "commercial":
-	case "retail":
-	case "city_block":
-	case "residential":
-	case "locality":
-	case "district":
-		p3.push(props.city);
-		p3.push(props.county);
-		p3.push(props.state);
-		p3.push(props.country);
-		break;
-	case "city":
-		p3.push(props.county);
-		p3.push(props.state);
-		p3.push(props.country);
-		break;
-	case "region":
-		p3.push(props.county);
-		p3.push(props.state);
-		p3.push(props.country);
-		break;
-	case "country":
-		break;
-	case "house":
-	case "housenumber":
-		p2.push(props.housenumber);
-		p2.push(props.street);
-		p2.push(props.locality);
-		p2.push(props.district);
-		p3.push(props.city);
-		p3.push(props.county);
-		p3.push(props.state);
-		p3.push(props.country);
-		break;
-	case "street":
-	case "road":
-	default:
-		p2.push(props.street);
-		p2.push(props.locality);
-		p2.push(props.district);
-		p3.push(props.city);
-		p3.push(props.county);
-		p3.push(props.state);
-		p3.push(props.country);
-		break;
-	}
-
-	p2 = p2.filter(v => v);
-	p2 = p2.filter((v,i) => v !== p1 && (i === 0 || p2[i-1] !== v));
-	p2 = p2.length > 0 ? (props.housenumber ? p2.slice(0,2).join(" ") : p2.shift()) : null;
-	if(p2 === p1) { p2 = null; }
-
-	p3 = p3.filter(v => v);
-	p3 = p3.filter((v,i) => v !== p1 && (!p2 || !p2.includes(v)) && (i === 0 || p3[i-1] !== v));
-
-	let res = [p1, p2, p3.shift()].filter(v => v);
-
-	return res.join(", ");
-}
-
-/**
- * Standard forward geocoder
- * @param {object} config Configuration sent by MapLibre GL Geocoder, following the geocoderApi format ( https://maplibre.org/maplibre-gl-geocoder/types/MaplibreGeocoderApiConfig.html )
- * @param {string} endpoint The URL endpoint (everything before the /?q=...)
- * @returns {object} GeoJSON Feature collection in Carmen GeoJSON format ( https://maplibre.org/maplibre-gl-geocoder/types/CarmenGeojsonFeature.html )
- * @private
- */
-export function forwardGeocodingStandard(config, endpoint) {
-	// Transform parameters into BAN format
-	const params = { q: config.query, limit: config.limit };
-	if(typeof config.proximity === "string") {
-		const [lat, lon] = config.proximity.split(",").map(v => parseFloat(v.trim()));
-		params.lat = lat;
-		params.lon = lon;
-	}
-
-	return fetch(`${endpoint}/?${geocoderParamsToURLString(params)}`)
-		.then(res => res.json())
-		.then(res => {
-			const finalRes = { features: [] };
-			const listedNames = [];
-			(res.features || []).forEach(f => {
-				const plname = geocodeJsonToPlaceName(f.properties);
-				if(!listedNames.includes(plname) && f.properties.type !== "other") {
-					finalRes.features.push({
-						place_type: ["place"],
-						place_name: plname,
-						center: f.geometry.coordinates,
-						zoom: PLACETYPE_ZOOM[f.properties.type],
-					});
-					listedNames.push(plname);
-				}
-			});
-			return finalRes;
-		});
-}