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

package/build/utils/API.js

@@ -1,928 +0,0 @@
-import { isNullId } from "./utils.js";
-
-/**
- * API contains various utility functions to communicate with Panoramax/STAC API
- *
- * @class Panoramax.utils.API
- * @typicalname api
- * @fires Panoramax.utils.API#ready
- * @fires Panoramax.utils.API#broken
- * @param {string} endpoint The endpoint. It corresponds to the <a href="https://github.com/radiantearth/stac-api-spec/blob/main/overview.md#example-landing-page">STAC landing page</a>, with all links describing the API capabilities.
- * @param {object} [options] Options
- * @param {string} [options.tiles] API route serving pictures & sequences vector tiles
- * @param {boolean} [options.skipReadLanding=false] True to not call API landing page automatically
- * @param {object} [options.fetch] Set custom options for fetch calls made against API ([same syntax as fetch options parameter](https://developer.mozilla.org/en-US/docs/Web/API/fetch#parameters))
- */
-export default class API extends EventTarget {
-	constructor(endpoint, options = {}) {
-		super();
-
-		if(endpoint === null || endpoint === undefined || typeof endpoint !== "string") {
-			const e = new Error("endpoint parameter is empty or not a valid string");
-			this.dispatchEvent(new CustomEvent("broken", {detail: {error: e}}));
-			throw e;
-		}
-
-		// Parse local endpoints
-		if(endpoint.startsWith("/")) {
-			endpoint = window.location.href.split("/").slice(0, 3).join("/") + endpoint;
-		}
-
-		// Check endpoint
-		if(!API.isValidHttpUrl(endpoint)) {
-			const e = new Error(`endpoint parameter is not a valid URL: ${endpoint}`);
-			this.dispatchEvent(new CustomEvent("broken", {detail: {error: e}}));
-			throw e;
-		}
-
-		this._endpoint = endpoint;
-		this._isReady = 0;
-		this._dataBbox = null;
-		this._fetchOpts = options?.fetch || {};
-		this._metadata = {};
-		this._configuration = null;
-
-		if(options.skipReadLanding) { return; }
-		this._readLanding = fetch(endpoint, this._getFetchOptions())
-			.then(res => res.json())
-			.then(landing => this._parseLanding(landing, options))
-			.catch(e => {
-				this._isReady = -1;
-				console.error(e);
-
-				/**
-				 * Event when API is broken.
-				 * This happens on any API loading or map styling issue.
-				 * @event Panoramax.utils.API#broken
-				 * @type {CustomEvent}
-				 * @property {Error} detail.error The original error
-				 */
-				this.dispatchEvent(new CustomEvent("broken", {detail: {error: e}}));
-
-				return Promise.reject("Viewer failed to communicate with API");
-			})
-			.then(() => {
-				this._isReady = 1;
-
-				/**
-				 * Event when API is ready to use.
-				 * This happens after initial API read and map styles load.
-				 * @event Panoramax.utils.API#ready
-				 * @type {Event}
-				 */
-				this.dispatchEvent(new Event("ready"));
-
-				return "API is ready";
-			});
-	}
-
-	/**
-	 * Resolves when the API is ready to be used.
-	 * @memberof Panoramax.utils.API#
-	 * @returns {Promise}
-	 * @fulfil {string} "API is ready" when initialization is complete.
-	 * @reject {string} Error message
-	 */
-	onceReady() {
-		if(this._isReady === -1) {
-			return Promise.reject("Viewer failed to communicate with API");
-		}
-		else if(this._isReady === 1) {
-			return Promise.resolve("API is ready");
-		}
-		else {
-			return this._readLanding;
-		}
-	}
-
-	/**
-	 * Checks if the API is ready to be used.
-	 * @memberof Panoramax.utils.API#
-	 * @returns {boolean} True if the API is ready, false otherwise.
-	 */
-	isReady() {
-		return this._isReady === 1;
-	}
-
-	/**
-	 * List of available features offered by API
-	 * @memberof Panoramax.utils.API#
-	 * @returns {string[]} Keywords of enabled features
-	 */
-	getAvailableFeatures() {
-		return Object.entries(this._endpoints).filter(e => e[1] !== null).map(e => e[0]);
-	}
-
-	/**
-	 * List of unavailable features on API
-	 * @memberof Panoramax.utils.API#
-	 * @returns {string[]} Keywords of disabled features
-	 */
-	getUnavailableFeatures() {
-		return Object.entries(this._endpoints).filter(e => e[1] === null).map(e => e[0]);
-	}
-
-	/**
-	 * Interprets JSON landing page and store important information
-	 * @memberof Panoramax.utils.API#
-	 * @private
-	 */
-	_parseLanding(landing, options) {
-		this._endpoints = {
-			"collections": null,
-			"search": null,
-			"style": null,
-			"user_style": null,
-			"tiles": options?.tiles || null,
-			"user_tiles": null,
-			"user_search": null,
-			"collection_preview": null,
-			"item_preview": null,
-			"rss": null,
-			"report": null,
-			"queryables": null,
-		};
-
-		if(!landing || !landing.links || !Array.isArray(landing.links)) {
-			throw new Error("API Landing page doesn't contain 'links' list");
-		}
-
-		if(!landing.stac_version.startsWith("1.")) {
-			throw new Error(`API is not in a supported STAC version (Panoramax viewer supports only 1.x, API is ${landing.stac_version})`);
-		}
-
-		// Read metadata
-		this._metadata.name = landing.title || "Unnamed";
-		this._metadata.stac_version = landing.stac_version;
-		this._metadata.geovisio_version = landing.geovisio_version;
-
-		// Read links
-		const supportedLinks = [
-			{
-				rel: "search",
-				type: "application/geo+json",
-				endpointId: "search",
-				mandatory: true,
-				missingIssue: "No direct access to pictures metadata."
-			},
-			{
-				rel: "data",
-				type: "application/json",
-				endpointId: "collections",
-				mandatory: true,
-				missingIssue: "No way for viewer to access sequences."
-			},
-			{
-				rel: "data",
-				type: "application/rss+xml",
-				endpointId: "rss"
-			},
-			{
-				rel: "xyz",
-				type: "application/vnd.mapbox-vector-tile",
-				endpointId: "tiles"
-			},
-			{
-				rel: "xyz-style",
-				type: "application/json",
-				endpointId: "style"
-			},
-			{
-				rel: "user-xyz-style",
-				type: "application/json",
-				endpointId: "user_style"
-			},
-			{
-				rel: "user-xyz",
-				type: "application/vnd.mapbox-vector-tile",
-				endpointId: "user_tiles"
-			},
-			{
-				rel: "user-search",
-				type: "application/json",
-				endpointId: "user_search",
-				missingIssue: "Filter map data by user name will not be available."
-			},
-			{
-				rel: "collection-preview",
-				type: "image/jpeg",
-				endpointId: "collection_preview",
-				missingIssue: "Display of thumbnail could be slower."
-			},
-			{
-				rel: "item-preview",
-				type: "image/jpeg",
-				endpointId: "item_preview",
-				missingIssue: "Display of thumbnail could be slower."
-			},
-			{
-				rel: "report",
-				type: "application/json",
-				endpointId: "report"
-			},
-			{
-				rel: "http://www.opengis.net/def/rel/ogc/1.0/queryables",
-				type: "application/schema+json",
-				endpointId: "queryables",
-				missingIssue: "Tags map overlay will not be available."
-			}
-		];
-
-		const blockingIssues = [];
-		const warningIssues = [];
-
-		supportedLinks.forEach(sl => {
-			// Find link in landing
-			const ll = landing.links.find(ll => ll.rel === sl.rel && ll.type === sl.type);
-
-			// No link found
-			if(!ll) {
-				if(!this._endpoints[sl.endpointId]) {
-					let label = `API doesn't offer a '${sl.rel}' (${sl.type}) endpoint in its links`;
-					if(sl.missingIssue) { label += `\n${sl.missingIssue}`; }
-
-					// Display issue (either blocking or not)
-					if(sl.mandatory) { blockingIssues.push(label); }
-					else if(sl.missingIssue) { warningIssues.push(label); }
-				}
-			}
-			// Link found
-			else {
-				// Invalid link
-				if(!API.isValidHttpUrl(ll.href)) {
-					throw new Error(`API endpoint '${ll.rel}' (${ll.type}) is not a valid URL: ${ll.href}`);
-				}
-
-				// Valid link -> stored in endpoints
-				if(!this._endpoints[sl.endpointId]) {
-					this._endpoints[sl.endpointId] = ll.href;
-				}
-			}
-		});
-
-		// Complex checks
-		if(!this._endpoints.style && !this._endpoints.tiles) {
-			warningIssues.push("API doesn't offer 'xyz' or 'xyz-style' endpoints in its links.\nMap widget will not be available.");
-		}
-		if(!this._endpoints.user_style && !this._endpoints.user_tiles) {
-			warningIssues.push("API doesn't offer 'user-xyz' or 'user-xyz-style' endpoints in its links.\nFilter map data by user ID will not be available.");
-		}
-
-		// Display warnings & errors
-		warningIssues.forEach(w => console.warn(w));
-		if(blockingIssues.length > 0) {
-			throw new Error(blockingIssues.join("\n"));
-		}
-
-		// Look for data BBox
-		const bbox = landing?.extent?.spatial?.bbox;
-		this._dataBbox = (
-			bbox &&
-			Array.isArray(bbox) &&
-			bbox.length > 0 &&
-			Array.isArray(bbox[0]) && bbox[0].length === 4
-		) ?
-			[[bbox[0][0], bbox[0][1]], [bbox[0][2], bbox[0][3]]]
-			: null;
-	}
-
-	/**
-	 * Get the defaults fetch options to pass during API calls
-	 * @memberof Panoramax.utils.API#
-	 * @param {boolean} [noTimeout=false] Set to true to avoid default timeout
-	 * @private
-	 * @returns {object} The fetch options
-	 */
-	_getFetchOptions(noTimeout=false) {
-		const res = Object.assign({}, this._fetchOpts);
-		if(!noTimeout) {
-			res.signal = AbortSignal.timeout(15000);
-		}
-		return res;
-	}
-
-	/**
-	 * Get the RequestTransformFunction for MapLibre to handle fetch options
-	 * @memberof Panoramax.utils.API#
-	 * @private
-	 * @returns {function} The RequestTransformFunction
-	 */
-	_getMapRequestTransform() {
-		const fetchOpts = this._getFetchOptions();
-		delete fetchOpts.signal;
-		return (url) => {
-			// As MapLibre will use this function for all its calls
-			// We must make sure fetch options are sent only for
-			// The STAC API calls, particularly the tiles endpoint
-			if(url.startsWith(this._endpoint)) {
-				if(Object.keys(fetchOpts).length > 0) {
-					return {
-						url,
-						...fetchOpts
-					};
-				}
-			}
-			// Override IGN FR High-DPI sprites
-			else if(url.includes("data.geopf.fr") && url.includes("@2x")) {
-				return {
-					url: url.replace("@2x", "")
-				};
-			}
-		};
-	}
-
-	/**
-	 * Get the withCredentials function for PhotoSphereViewer to handle fetch credentials parameter.
-	 * @memberof Panoramax.utils.API#
-	 * @private
-	 * @returns {function} The withCredentials function
-	 */
-	_getPSVWithCredentials() {
-		const fetchOpts = this._getFetchOptions();
-		if(fetchOpts.credentials === "include") {
-			return (url) => url.startsWith(this._endpoint);
-		}
-		else {
-			return undefined;
-		}
-	}
-
-	/**
-	 * Get absolute URL from a relative version
-	 * @param {string} url The relative URL
-	 * @returns {string} The absolute URL, using API endpoint
-	 */
-	cleanResourceURL(url) {
-		if(!url) { return; }
-		const endpoint = new URL(this._endpoint);
-		if(url.startsWith("/")) { return endpoint.protocol + "//" + endpoint.host + url; }
-		else if(url.startsWith("./")) { return this._endpoint + url.substring(1); }
-		else { return url; }
-	}
-
-	/**
-	 * Get sequence GeoJSON representation
-	 * @memberof Panoramax.utils.API#
-	 * @param {string} seqId The sequence ID
-	 * @param {string} [next] The next link URL (only for internals)
-	 * @param {object} [data] The previous dataset (only for internals)
-	 * @param {number} [limit] How many items to retrieve (defaults to unset). If set, pages are not looked through.
-	 * @returns {Promise}
-	 * @fulfil {object} Sequence GeoJSON
-	 * @reject {Error} If API is not ready or for any network issue
-	 */
-	async getSequenceItems(seqId, next = null, data = null, limit = null) {
-		if(!this.isReady()) { throw new Error("API is not ready to use"); }
-		try {
-			API.isIdValid(seqId);
-			return await fetch(
-				next || `${this._endpoints.collections}/${seqId}/items${limit ? "?limit="+limit : ""}`,
-				this._getFetchOptions(true)
-			)
-				.then(res => res.json())
-				.then(res => {
-					// Merge previous data with current page
-					let nextData = res;
-					if(data) { nextData.features = data.features.concat(nextData.features); }
-
-					// Handle pagination for next link
-					const nextLink = res.links.find(l => l.rel === "next");
-					if(!limit && nextLink) { return this.getSequenceItems(seqId, nextLink.href, nextData); }
-					else { return nextData; }
-				});
-		}
-		catch(e) {
-			return await Promise.reject(e);
-		}
-	}
-
-	/**
-	 * Get full URL for listing pictures around a specific location
-	 * @memberof Panoramax.utils.API#
-	 * @param {number} lat Latitude
-	 * @param {number} lon Longitude
-	 * @param {number} [factor] The radius to search around (in degrees)
-	 * @param {number} [limit] Max amount of pictures to retrieve
-	 * @param {string} [seqId] The sequence ID to filter on (by default, no filter)
-	 * @returns {string} The corresponding URL
-	 */
-	getPicturesAroundCoordinatesUrl(lat, lon, factor = 0.0005, limit = null, seqId = null) {
-		if(!this.isReady()) { throw new Error("API is not ready to use"); }
-
-		if(isNaN(parseFloat(lat)) || isNaN(parseFloat(lon))) {
-			throw new Error("lat and lon parameters should be valid numbers");
-		}
-
-		const bbox = [ lon - factor, lat - factor, lon + factor, lat + factor ].map(d => d.toFixed(7)).join(",");
-		const lim = limit ? `&limit=${limit}` : "";
-		const seq = seqId ? `&collections=${seqId}`: "";
-		return `${this._endpoints.search}?bbox=${bbox}${lim}${seq}`;
-	}
-
-	/**
-	 * Get list of pictures around a specific location
-	 * @memberof Panoramax.utils.API#
-	 * @param {number} lat Latitude
-	 * @param {number} lon Longitude
-	 * @param {number} [factor] The radius to search around (in degrees)
-	 * @param {number} [limit] Max amount of pictures to retrieve
-	 * @param {string} [seqId] The sequence ID to filter on (by default, no filter)
-	 * @returns {Promise}
-	 * @fulfil {object} The GeoJSON feature collection
-	 */
-	getPicturesAroundCoordinates(lat, lon, factor, limit, seqId) {
-		return fetch(this.getPicturesAroundCoordinatesUrl(lat, lon, factor, limit, seqId), this._getFetchOptions())
-			.then(res => res.json());
-	}
-
-	/**
-	 * Get full URL for retrieving a specific picture metadata
-	 * @memberof Panoramax.utils.API#
-	 * @param {string} picId The picture unique identifier
-	 * @param {string} [seqId] The sequence ID
-	 * @returns {string} The corresponding URL
-	 * @throws {Error} If API is not ready
-	 */
-	getPictureMetadataUrl(picId, seqId) {
-		if(!this.isReady()) { throw new Error("API is not ready to use"); }
-
-		if(API.isIdValid(picId)) {
-			if(seqId) { return `${this._endpoints.collections}/${seqId}/items/${picId}`; }
-			else { return `${this._endpoints.search}?ids=${picId}`; }
-		}
-	}
-
-	/**
-	 * Find the thumbnail URL for a given picture
-	 * @memberof Panoramax.utils.API#
-	 * @param {object} picture The picture GeoJSON feature
-	 * @returns {string} The thumbnail URL, or null if not found
-	 * @throws {Error} If API is not ready
-	 * @private
-	 */
-	findThumbnailInPictureFeature(picture) {
-		if(!this.isReady()) { throw new Error("API is not ready to use"); }
-		if(!picture || !picture.assets) { return null; }
-
-		let visualFallback = null;
-		for(let a of Object.values(picture.assets)) {
-			if(a.roles.includes("thumbnail") && a.type === "image/jpeg" && API.isValidHttpUrl(a.href)) {
-				return this.cleanResourceURL(a.href);
-			}
-			else if(a.roles.includes("visual") && a.type === "image/jpeg" && API.isValidHttpUrl(a.href)) {
-				visualFallback = this.cleanResourceURL(a.href);
-			}
-		}
-		return visualFallback;
-	}
-
-	/**
-	 * Get a picture thumbnail URL for a given sequence
-	 * @memberof Panoramax.utils.API#
-	 * @param {string} seqId The sequence ID
-	 * @param {object} [seq] The sequence metadata (with links) if already loaded
-	 * @returns {Promise}
-	 * @fulfil {string|null} Promise resolving on the picture thumbnail URL, or null if not found
-	 * @throws {Error} If API is not ready
-	 */
-	getPictureThumbnailURLForSequence(seqId, seq) {
-		if(!this.isReady()) { throw new Error("API is not ready to use"); }
-
-		// Look for a dedicated endpoint in API
-		if(this._endpoints.collection_preview) {
-			return Promise.resolve(this._endpoints.collection_preview.replace("{id}", seqId));
-		}
-
-		// Check if a preview link exists in sequence metadata
-		if(seq && Array.isArray(seq.links) && seq.links.length > 0) {
-			let preview = seq.links.find(l => l.rel === "preview" && l.type === "image/jpeg");
-			if(preview && API.isValidHttpUrl(preview.href)) {
-				return Promise.resolve(preview.href);
-			}
-		}
-
-		// Otherwise, search for a single picture in collection
-		const url = `${this._endpoints.search}?limit=1&collections=${seqId}`;
-
-		return fetch(url, this._getFetchOptions())
-			.then(res => res.json())
-			.then(res => {
-				if(!Array.isArray(res.features) || res.features.length === 0) {
-					return null;
-				}
-
-				return this.findThumbnailInPictureFeature(res.features.pop());
-			});
-	}
-
-	/**
-	 * Get thumbnail URL for a specific picture
-	 * @memberof Panoramax.utils.API#
-	 * @param {string} picId The picture unique identifier
-	 * @param {string} [seqId] The sequence ID
-	 * @returns {Promise}
-	 * @fulfil {string|null} The corresponding URL on resolve, or null if no thumbnail could be found
-	 * @throws {Error} If API is not ready
-	 */
-	getPictureThumbnailURL(picId, seqId) {
-		if(!this.isReady()) { throw new Error("API is not ready to use"); }
-
-		if(!picId) { return Promise.resolve(null); }
-
-		// Look for a dedicated endpoint in API
-		if(this._endpoints.item_preview) {
-			return Promise.resolve(this._endpoints.item_preview.replace("{id}", picId));
-		}
-
-		// Pic + sequence IDs defined -> use direct item metadata
-		if(picId && seqId) {
-			return fetch(`${this._endpoints.collections}/${seqId}/items/${picId}`, this._getFetchOptions())
-				.then(res => res.json())
-				.then(picture => {
-					return picture ? this.findThumbnailInPictureFeature(picture) : null;
-				});
-		}
-
-		// Picture ID only -> use search as fallback
-		return fetch(`${this._endpoints.search}?ids=${picId}`, this._getFetchOptions())
-			.then(res => res.json())
-			.then(res => {
-				if(!res || !Array.isArray(res.features) || res.features.length === 0) { return null; }
-				return this.findThumbnailInPictureFeature(res.features.pop());
-			});
-	}
-
-	/**
-	 * Get the RSS feed URL with map parameters (if map is enabled)
-	 * @memberof Panoramax.utils.API#
-	 * @param {LngLatBounds} [bbox] The map current bounding box, or null if not available
-	 * @returns {string|null} The URL, or null if no RSS feed is available
-	 * @throws {Error} If API is not ready
-	 */
-	getRSSURL(bbox) {
-		if(!this.isReady()) { throw new Error("API is not ready to use"); }
-
-		if(this._endpoints.rss) {
-			let url = this._endpoints.rss;
-			if(bbox) {
-				url += url.includes("?") ? "&": "?";
-				url += "bbox=" + [bbox.getWest(), bbox.getSouth(), bbox.getEast(), bbox.getNorth()].join(",");
-			}
-			return url;
-		}
-		else {
-			return null;
-		}
-	}
-
-	/**
-	 * Get full URL for retrieving a specific sequence metadata
-	 * @memberof Panoramax.utils.API#
-	 * @param {string} seqId The sequence ID
-	 * @returns {string} The corresponding URL
-	 * @throws {Error} If API is not ready
-	 */
-	getSequenceMetadataUrl(seqId) {
-		if(!this.isReady()) { throw new Error("API is not ready to use"); }
-		return `${this._endpoints.collections}/${seqId}`;
-	}
-
-	/**
-	 * Retrieve metadata for a specific sequence
-	 * @memberof Panoramax.utils.API#
-	 * @param {string} seqId The sequence ID
-	 * @returns {Promise}
-	 * @fulfil {object|null} Sequence metadata
-	 * @throws {Error} If API is not ready
-	 */
-	getSequenceMetadata(seqId) {
-		if(!this.isReady()) { throw new Error("API is not ready to use"); }
-
-		return fetch(this.getSequenceMetadataUrl(seqId), this._getFetchOptions())
-			.then(res => res.json());
-	}
-
-	/**
-	 * Get available data bounding box
-	 * @memberof Panoramax.utils.API#
-	 * @returns {LngLatBoundsLike} The bounding box or null if not available
-	 * @throws {Error} If API is not ready
-	 */
-	getDataBbox() {
-		if(!this.isReady()) { throw new Error("API is not ready to use"); }
-
-		return this._dataBbox;
-	}
-
-	/**
-	 * Look for user ID based on user name query
-	 * @memberof Panoramax.utils.API#
-	 * @param {string} query The user name to look for
-	 * @returns {Promise}
-	 * @fulfil {object|null} List of potential users
-	 * @throws {Error} If API is not ready or user search not available
-	 */
-	searchUsers(query) {
-		if(!this.isReady()) { throw new Error("API is not ready to use"); }
-		if(!this._endpoints.user_search) { throw new Error("User search is not available"); }
-
-		return fetch(`${this._endpoints.user_search}?q=${query}`, this._getFetchOptions())
-			.then(res => res.json())
-			.then(res => {
-				return res?.features || null;
-			});
-	}
-
-	/**
-	 * Get user name based on its ID
-	 * @memberof Panoramax.utils.API#
-	 * @param {string} userId The user UUID
-	 * @returns {Promise}
-	 * @throws {Error} If API is not ready
-	 * @fulfil {string|null} The user name (or null if not found)
-	 */
-	getUserName(userId) {
-		if(!this.isReady()) { throw new Error("API is not ready to use"); }
-		if(!this._endpoints.user_search) { throw new Error("User search is not available"); }
-
-		return fetch(this._endpoints.user_search.replace(/\/search$/, `/${userId}`), this._getFetchOptions())
-			.then(res => res.json())
-			.then(res => {
-				return res?.label || res?.name || null;
-			});
-	}
-
-	/**
-	 * Send a report to API
-	 * @memberof Panoramax.utils.API#
-	 * @param {object} data The input form data
-	 * @returns {Promise}
-	 * @fulfil {object} The JSON API response
-	 */
-	sendReport(data) {
-		if(!this.isReady()) { throw new Error("API is not ready to use"); }
-		if(!this._endpoints.report) { throw new Error("Report sending is not available"); }
-
-		const opts = {
-			...this._getFetchOptions(),
-			method: "POST",
-			body: JSON.stringify(data),
-			headers: { "Content-Type": "application/json" },
-		};
-		return fetch(this._endpoints.report, opts)
-			.then(async res => {
-				if(res.status >= 400) {
-					let txt = await res.text();
-					try {
-						txt = JSON.parse(txt)["message"];
-					}
-					catch(e) {}
-					return Promise.reject(txt);
-				}
-				return res.json();
-			});
-	}
-
-	/**
-	 * Send picture semantics change to origin API.
-	 * @memberof Panoramax.utils.API#
-	 * @param {object} picMeta The picture metadata
-	 * @param {object} semanticsDiff The difference in semantics compared to original data
-	 * @returns {Promise}
-	 * @fulfil {object} The JSON API response
-	 */
-	sendPictureSemantics(picMeta, semanticsDiff) {
-		// Fake send version
-		// Const newMeta = Object.assign({}, picMeta);
-		// NewMeta.properties.semantics = newMeta.properties.semantics.concat(semanticsDiff).filter(t => (
-		// 	T.action != "delete"
-		// 	&& !semanticsDiff.find(t2 => t.key == t2.key && t.value == t2.value && t2.action == "delete")
-		// ));
-		// Return Promise.resolve(newMeta);
-
-		if(!this.isReady()) { throw new Error("API is not ready to use"); }
-		if(!picMeta?.sequence?.id || !picMeta?.id) { throw new Error("Missing IDs from picture"); }
-
-		// Check if it's from metacatalog
-		let picLink = this.getPictureMetadataUrl(picMeta.id, picMeta.sequence.id);
-		if(picMeta?.origInstance) {
-			picLink = `${picMeta.origInstance.href}/api/collections/${picMeta.sequence.id}/items/${picMeta.id}`;
-		}
-
-		const opts = {
-			...this._getFetchOptions(),
-			method: "PATCH",
-			body: JSON.stringify({ semantics: semanticsDiff }),
-			headers: { "Content-Type": "application/json" },
-		};
-
-		return fetch(picLink, opts)
-			.then(async res => {
-				if(res.status >= 400) {
-					let txt = await res.text();
-					try {
-						txt = JSON.parse(txt)["message"];
-					}
-					catch(e) {}  
-					return Promise.reject(txt);
-				}
-				return res.json();
-			});
-	}
-
-	/**
-	 * Create new annotation for a given picture on its origin API.
-	 * @memberof Panoramax.utils.API#
-	 * @param {object} picMeta The picture metadata
-	 * @param {object} shape The annotation shape
-	 * @param {object} semanticsDiff The difference in semantics compared to original data
-	 * @returns {Promise}
-	 * @fulfil {object} The JSON API response
-	 */
-	createPictureAnnotation(picMeta, shape, semanticsDiff) {
-		// Fake send version
-		// Return Promise.resolve({
-		// 	"id": "fe298d59-a9c6-4680-8e76-6efe82d97f48",
-		// 	"semantics": semanticsDiff,
-		// 	"shape": { "type": "Polygon", "coordinates": [[
-		// 		[shape[0], shape[1]],
-		// 		[shape[0], shape[3]],
-		// 		[shape[2], shape[3]],
-		// 		[shape[2], shape[1]],
-		// 		[shape[0], shape[1]],
-		// 	]] }
-		// });
-
-		if(!this.isReady()) { throw new Error("API is not ready to use"); }
-		if(!picMeta?.sequence?.id || !picMeta?.id) { throw new Error("Missing IDs from picture"); }
-
-		// Check if it's from metacatalog
-		let picLink = this.getPictureMetadataUrl(picMeta.id, picMeta.sequence.id)+"/annotations";
-		if(picMeta?.origInstance) {
-			picLink = `${picMeta.origInstance.href}/api/collections/${picMeta.sequence.id}/items/${picMeta.id}/annotations`;
-		}
-
-		const opts = {
-			...this._getFetchOptions(),
-			method: "POST",
-			body: JSON.stringify({
-				semantics: semanticsDiff,
-				shape: shape
-			}),
-			headers: { "Content-Type": "application/json" },
-		};
-
-		return fetch(picLink, opts)
-			.then(async res => {
-				if(res.status >= 400) {
-					let txt = await res.text();
-					try {
-						txt = JSON.parse(txt)["message"];
-					}
-					catch(e) {}  
-					return Promise.reject(txt);
-				}
-				return res.json();
-			});
-	}
-
-	/**
-	 * Edit semantics of an existing annotation on its origin API.
-	 * @memberof Panoramax.utils.API#
-	 * @param {string} annotationId The annotation UUID
-	 * @param {object} semanticsDiff The difference in semantics compared to original data
-	 * @returns {Promise}
-	 * @fulfil {object} The JSON API response
-	 */
-	editPictureAnnotation(annotationId, semanticsDiff) {
-		// Fake send version
-		// Return Promise.resolve({
-		// 	"id": annotationId,
-		// 	"semantics": semanticsDiff,
-		// 	"shape": {
-		// 		"coordinates": [[[2296,946],[2336,946],[2336,978],[2296,978],[2296,946]]],
-		// 		"type": "Polygon"
-		// 	}
-		// });
-
-		if(!this.isReady()) { throw new Error("API is not ready to use"); }
-		let annotLink = `${this._endpoint}/annotations/${annotationId}`;
-
-		const opts = {
-			...this._getFetchOptions(),
-			method: "PATCH",
-			body: JSON.stringify({ semantics: semanticsDiff }),
-			headers: { "Content-Type": "application/json" },
-		};
-
-		return fetch(annotLink, opts)
-			.then(async res => {
-				if(res.status >= 400) {
-					let txt = await res.text();
-					try {
-						txt = JSON.parse(txt)["message"];
-					}
-					catch(e) {}  
-					return Promise.reject(txt);
-				}
-				return res.json();
-			});
-	}
-
-	/**
-	 * Delete a single annotation on its origin API.
-	 * @memberof Panoramax.utils.API#
-	 * @param {string} annotationId The annotation UUID
-	 * @returns {Promise}
-	 * @fulfil {object} The JSON API response
-	 */
-	deletePictureAnnotation(annotationId) {
-		// Fake send version
-		// Console.log("Delete", annotationId);
-		// Return Promise.resolve(true);
-
-		if(!this.isReady()) { throw new Error("API is not ready to use"); }
-		let annotLink = `${this._endpoint}/annotations/${annotationId}`;
-
-		const opts = {
-			...this._getFetchOptions(),
-			method: "DELETE",
-		};
-
-		return fetch(annotLink, opts)
-			.then(async res => {
-				if(res.status >= 400) {
-					let txt = await res.text();
-					try {
-						txt = JSON.parse(txt)["message"];
-					}
-					catch(e) {}  
-					return Promise.reject(txt);
-				}
-				return true;
-			});
-	}
-
-	/**
-	 * Get the URL for user to log-in.
-	 * @memberof Panoramax.utils.API#
-	 * @returns {Promise}
-	 * @fulfil {string|boolean} The log-in URL, or false if no login is available
-	 */
-	getAuthURL() {
-		if(this._configuration) {
-			return Promise.resolve(
-				this._configuration?.auth?.enabled
-					? `${this._endpoint}/auth/login?next_url=<CBURL>`
-					: false
-			);
-		}
-		else if(this._configuration === null) {
-			return fetch(this._endpoint+"/configuration", this._getFetchOptions())
-				.then(res => res.json())
-				.then(res => {
-					this._configuration = res;
-					return this.getAuthURL();
-				})
-				.catch(() => {
-					this._configuration = false;
-					return false;
-				});
-		}
-		else {
-			return Promise.resolve(false);
-		}
-	}
-
-	/**
-	 * Checks URL string validity
-	 * @memberof Panoramax.utils.API
-	 * @param {string} str The URL to check
-	 * @returns {boolean} True if valid
-	 */
-	static isValidHttpUrl(str) {
-		let url;
-
-		try {
-			url = new URL(str);
-		} catch (_) {
-			return false;
-		}
-
-		return url.protocol === "http:" || url.protocol === "https:";
-	}
-
-	/**
-	 * Checks picture or sequence ID validity
-	 * @memberof Panoramax.utils.API
-	 * @param {string} id The ID to check
-	 * @returns {boolean} True if valid
-	 * @throws {Error} If not valid
-	 */
-	static isIdValid(id) {
-		if(isNullId(id)) {
-			throw new Error("id should be a valid picture unique identifier");
-		}
-		return true;
-	}
-}