@panoramax/web-viewer 3.2.3-develop-1369d03e → 3.2.3-develop-387e736b

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@panoramax/web-viewer",
-  "version": "3.2.3-develop-1369d03e",
+  "version": "3.2.3-develop-387e736b",
   "description": "Panoramax web viewer for geolocated pictures",
   "main": "build/index.js",
   "author": "Panoramax team",

package/src/components/core/PhotoViewer.js

@@ -169,24 +169,7 @@ export default class PhotoViewer extends Basic {
 			});
 		}
 
-		this.onceAPIReady().then(async () => {
-			this.loader.setAttribute("value", 30);
-			this._createInitParamsHandler();
-
-			const myPostInitParams = this._initParams.getParentPostInit();
-
-			this._initPSV();
-			this._initWidgets();
-			alterPhotoViewerState(this, myPostInitParams);
-			this._handleKeyboardManagement();
-			
-			if(myPostInitParams.picture) {
-				this.psv.addEventListener("picture-loaded", () => this.loader.dismiss(), {once: true});
-			}
-			else {
-				this.loader.dismiss();
-			}
-		});
+		this.onceAPIReady().then(this._postAPIInit.bind(this));
 	}
 
 	/** @private */
@@ -262,6 +245,26 @@ export default class PhotoViewer extends Basic {
 		});
 	}
 
+	/** @private */
+	async _postAPIInit() {
+		this.loader.setAttribute("value", 30);
+		this._createInitParamsHandler();
+
+		const myPostInitParams = this._initParams.getParentPostInit();
+
+		this._initPSV();
+		this._initWidgets();
+		alterPhotoViewerState(this, myPostInitParams);
+		this._handleKeyboardManagement();
+		
+		if(myPostInitParams.picture) {
+			this.psv.addEventListener("picture-loaded", () => this.loader.dismiss(), {once: true});
+		}
+		else {
+			this.loader.dismiss();
+		}
+	}
+
 	/** @private */
 	_initPSV() {
 		try {

package/src/components/core/Viewer.js

@@ -196,38 +196,6 @@ export default class Viewer extends PhotoViewer {
 		}
 	}
 
-	/** @private */
-	connectedCallback() {
-		Basic.prototype.connectedCallback.call(this);
-
-		this.onceAPIReady().then(async () => {
-			this.loader.setAttribute("value", 30);
-			this._createInitParamsHandler();
-
-			const myPostInitParams = this._initParams.getParentPostInit();
-
-			this._initPSV();
-			await this._initMap();
-			this._initWidgets();
-
-			// Re-launch slot move (for those depending on widgets)
-			this._moveChildToGrid();
-
-			alterViewerState(this, myPostInitParams);
-			this._handleKeyboardManagement();
-			
-			if(myPostInitParams.picture) {
-				this.psv.addEventListener("picture-loaded", () => {
-					alterViewerState(this, myPostInitParams); // Do it again for forcing focus
-					this.loader.dismiss();
-				}, {once: true});
-			}
-			else {
-				this.loader.dismiss();
-			}
-		});
-	}
-
 	getClassName() {
 		return "Viewer";
 	}
@@ -331,6 +299,34 @@ export default class Viewer extends PhotoViewer {
 		linkMapAndPhoto(this);
 	}
 
+	/** @private */
+	async _postAPIInit() {
+		this.loader.setAttribute("value", 30);
+		this._createInitParamsHandler();
+
+		const myPostInitParams = this._initParams.getParentPostInit();
+
+		this._initPSV();
+		await this._initMap();
+		this._initWidgets();
+
+		// Re-launch slot move (for those depending on widgets)
+		this._moveChildToGrid();
+
+		alterViewerState(this, myPostInitParams);
+		this._handleKeyboardManagement();
+		
+		if(myPostInitParams.picture) {
+			this.psv.addEventListener("picture-loaded", () => {
+				alterViewerState(this, myPostInitParams); // Do it again for forcing focus
+				this.loader.dismiss();
+			}, {once: true});
+		}
+		else {
+			this.loader.dismiss();
+		}
+	}
+
 	/** @private */
 	_handleKeyboardManagement() {
 		// Switchers

package/src/components/menus/MapFilters.js

@@ -105,6 +105,7 @@ export default class MapFilters extends LitElement {
 		/* Checkbox looking like buttons */
 		.pnx-input-group.pnx-checkbox-btns {
 			gap: 0;
+			align-items: stretch;
 		}
 		.pnx-checkbox-btns label {
 			display: inline-block;

package/src/components/ui/Photo.js

@@ -210,15 +210,16 @@ export default class Photo extends PSViewer {
 		const sameSequence = fromNode && toNode.sequence.id === fromNode.sequence.id;
 		const fromNodeHeading = (fromNode?.properties?.["view:azimuth"] || 0) * (Math.PI / 180);
 		const toNodeHeading = (toNode?.properties?.["view:azimuth"] || 0) * (Math.PI / 180);
+		const toNodeRelHeading = getRelativeHeading(toNode) * (Math.PI / 180);
 
 		this.setOption("maxFov", Math.min(toNode.horizontalFov * 3/4, 90));
 
-		const centerNoAnim = {
+		const forwardNoAnim = {
 			showLoader: false,
 			effect: "none",
 			speed: 0,
 			rotation: false,
-			rotateTo: { pitch: 0, yaw: 0 },
+			rotateTo: { pitch: 0, yaw: -toNodeRelHeading },
 			zoomTo: PSV_DEFAULT_ZOOM
 		};
 
@@ -226,13 +227,13 @@ export default class Photo extends PSViewer {
 		if(toNode.horizontalFov == 360) {
 			// No previous sequence -> Point to center + no animation
 			if(!fromNode) {
-				nodeTransition = centerNoAnim;
+				nodeTransition = forwardNoAnim;
 			}
 			// Has a previous sequence
 			else {
 				// Far away sequences -> Point to center + no animation
 				if(getDistance(fromNode.gps, toNode.gps) >= 0.001) {
-					nodeTransition = centerNoAnim;
+					nodeTransition = forwardNoAnim;
 				}
 				// Nearby sequences -> Keep orientation
 				else {
@@ -265,7 +266,7 @@ export default class Photo extends PSViewer {
 			}
 			// Different sequence -> Point to center + no animation
 			else {
-				nodeTransition = centerNoAnim;
+				nodeTransition = forwardNoAnim;
 			}
 		}