@panoramax/web-viewer 5.0.0-develop-b98e5d13 → 5.0.0-develop-f7d7cc8f

package/build/esm/components/core/Basic.js

@@ -9,7 +9,7 @@ import BasicStyles from "./Basic.css" with { type: "css" };
 document.adoptedStyleSheets.push(AtkinsonStyles);
 document.adoptedStyleSheets.push(BasicStyles);
 
-const __COMMIT_HASH__ = "b98e5d1";
+const __COMMIT_HASH__ = "f7d7cc8";
 const __PACKAGE_VERSION__ = "5.0.0";
 const __PACKAGE_ISSUES_URL__ = "https://gitlab.com/panoramax/clients/web-viewer/-/work_items";
 

package/build/esm/components/menus/SemanticsMetadata.js

@@ -6,6 +6,8 @@ import {
 import { dataBlocks, hidden } from "../styles.js";
 import { getUserAccount } from "../../utils/utils.js";
 
+const ADD_TAG_GEOM_DOING = "doing";
+
 /**
  * Semantics metadata displays detailed info about semantic attributes of a single picture.
  * @class Panoramax.components.menus.SemanticsMetadata
@@ -108,6 +110,7 @@ export default class SemanticsMetadata extends LitElement {
 	}
 
 	/** @private */
+	// eslint-disable-next-line class-methods-use-this
 	_onBrowserQuit(e) {
 		e.preventDefault();
 		e.returnValue = true;
@@ -139,7 +142,7 @@ export default class SemanticsMetadata extends LitElement {
 		this._blockPicChange(true);
 		this._addTag = true;
 		this._editTag = false;
-		this._addTagGeom = null;
+		this._addTagGeom = ADD_TAG_GEOM_DOING;
 		this._editTagSem = null;
 
 		this._addTagGeomListener = e => {
@@ -177,6 +180,10 @@ export default class SemanticsMetadata extends LitElement {
 				alert(this._parent?._t.pnx.semantics_send_fail);
 			});
 		}
+		// Create annotation but with unfinished geom
+		else if(this._addTag && this._addTagGeom === ADD_TAG_GEOM_DOING) {
+			alert(this._parent?._t.pnx.semantics_draw_unfinished_annotation);
+		}
 		// Create annotation if a geom exists
 		else if(this._addTag && this._addTagGeom) {
 			this._parent.psv.fixDrawAnnotation();

package/build/esm/components/ui/Photo.js

@@ -1370,37 +1370,33 @@ export default class Photo extends PSViewer {
 			// Send valid rectangle through event
 			if(sendRectEvent) {
 				// Get texture coordinates (corresponding to a full 360° sphere)
-				const minxy = this.dataHelper.sphericalCoordsToTextureCoords(this._drawingAnnotation[0]);
-				const maxxy = this.dataHelper.sphericalCoordsToTextureCoords(this._drawingAnnotation[1]);
-				let shape = [
-					minxy.textureX,
-					minxy.textureY,
-					maxxy.textureX,
-					maxxy.textureY
-				];
+				let shape = this._myMarkers.markers[DRAW_ANNOT_RECT].config.polygon
+					.map(c => {
+						const t = this.dataHelper.sphericalCoordsToTextureCoords(c);
+						return [t.textureX, t.textureY];
+					});
 
 				// Re-compute original texture coordinates (flat or cropped images)
 				const crop = this.getPictureMetadata()?.panorama?.cropData;
 				if(crop) {
-					shape[0] -= crop.croppedX;
-					shape[1] -= crop.croppedY;
-					shape[2] -= crop.croppedX;
-					shape[3] -= crop.croppedY;
+					shape = shape.map(([x,y]) => [x - crop.croppedX, y - crop.croppedY]);
 
 					// Check if annotations doesn't go outside of picture
-					if(shape[0] < 0 || shape[0] > crop.croppedWidth) { shape = null; }
-					else if(shape[1] < 0 || shape[1] > crop.croppedHeight) { shape = null; }
-					else if(shape[2] < 0 || shape[2] > crop.croppedWidth) { shape = null; }
-					else if(shape[3] < 0 || shape[3] > crop.croppedHeight) { shape = null; }
+					if(shape.find(([x,y]) => x < 0 || x > crop.croppedWidth || y < 0 || y > crop.croppedHeight)) {
+						shape = null;
+					}
+
+					// Alert user if shape is invalid
+					if(!shape) {
+						alert(this._parent._t.pnx.semantics_draw_invalid_annotation);
+						this.stopDrawAnnotation();
+						this.startDrawAnnotation();
+					}
 				}
 
-				// Check coordinates order
-				if(shape[0] >= shape[2] && shape[1] >= shape[3]) {
-					let maxx = shape[0];
-					let minx = shape[2];
-					let maxy = shape[1];
-					let miny = shape[3];
-					shape = [minx, miny, maxx, maxy];
+				// Add back last coordinate
+				if(shape[0][0] !== shape[shape.length-1][0] || shape[0][1] !== shape[shape.length-1][1]) {
+					shape.push(shape[0]);
 				}
 
 				/**
@@ -1408,7 +1404,7 @@ export default class Photo extends PSViewer {
 				 *
 				 * @event Panoramax.components.ui.Photo#annotation-drawn
 				 * @type {CustomEvent}
-				 * @property {string} detail.shape The annotation geometry, or null if latest draw is invalid
+				 * @property {number[][]} detail.shape The annotation geometry, or null if latest draw is invalid
 				 */
 				const event = new CustomEvent("annotation-drawn", {
 					detail: { shape }

package/build/esm/translations/en.json

@@ -222,6 +222,8 @@
         "semantics_zero_annotations": "No features drawn on this picture",
         "semantics_add_annotation": "Add a new tag",
         "semantics_draw_annotation": "You can draw the object you want to add over the picture (Optional).",
+        "semantics_draw_invalid_annotation": "The drawn area goes beyond picture limits. Please make sure to draw within visible picture.",
+        "semantics_draw_unfinished_annotation": "The drawn area is unfinished. Make sure the area is well-positioned before saving.",
         "semantics_erase_annotation": "Erase drawn feature",
         "semantics_delete_annotation": "Delete this feature",
         "semantics_delete_annotation_confirm": "Do you really want to delete this tag ?",

package/build/esm/translations/fr.json

@@ -222,6 +222,8 @@
         "semantics_zero_annotations": "Aucun objet dessiné dans cette photo",
         "semantics_add_annotation": "Ajouter un nouveau tag",
         "semantics_draw_annotation": "Vous pouvez dessiner l'emplacement de l'objet à créer sur la photo (Optionnel).",
+        "semantics_draw_invalid_annotation": "La zone dessinée dépasse de la photo. Veuillez vous assurer que la zone dessinée soit bien à l'intérieur de la photo.",
+        "semantics_draw_unfinished_annotation": "La zone dessinée n'est pas terminée. Assurez-vous qu'elle soit bien positionnée avant d'enregistrer.",
         "semantics_erase_annotation": "Effacer l'objet dessiné",
         "semantics_delete_annotation": "Supprimer cet objet",
         "semantics_delete_annotation_confirm": "Êtes-vous sûr(e) de vouloir supprimer ce tag ?",

package/build/esm/utils/API.js

@@ -741,16 +741,10 @@ export default class API extends EventTarget {
 	 */
 	createPictureAnnotation(picMeta, shape, semanticsDiff) {
 		// Fake send version
-		// Return Promise.resolve({
+		// 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]],
-		// 	]] }
+		// 	"shape": { "type": "Polygon", "coordinates": [shape] }
 		// });
 
 		if(!this.isReady()) { throw new Error("API is not ready to use"); }
@@ -767,7 +761,7 @@ export default class API extends EventTarget {
 			method: "POST",
 			body: JSON.stringify({
 				semantics: semanticsDiff,
-				shape: shape
+				shape: { type: "Polygon", coordinates: [shape] }
 			}),
 			headers: { "Content-Type": "application/json" },
 		};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@panoramax/web-viewer",
-  "version": "5.0.0-develop-b98e5d13",
+  "version": "5.0.0-develop-f7d7cc8f",
   "description": "Panoramax web viewer for geolocated pictures",
   "main": "./build/cjs/index.js",
   "module": "./build/esm/index.js",