refactor: smooth camera transitoin

src/blueprints/experiences/scene-component.blueprint.ts

@@ -18,6 +18,7 @@ import type {
 	Materials,
 	ModelChildrenMaterials,
 } from "~/common/experiences/experience-world.model";
+import type { NavigationView } from "~/common/experiences/navigation.model";
 
 // TODO: Link with the names of assets in the `app.loader` assets names
 export interface SceneBlueprintProps {
@@ -44,6 +45,11 @@ export abstract class SceneComponentBlueprint extends ExperienceBasedBlueprint {
 	protected _modelScene?: Group;
 	protected _availableMaterials: Materials = {};
 
+	public abstract readonly navigationLimits?: {
+		spherical: Exclude<NavigationView["spherical"], undefined>["limits"];
+		target: Exclude<NavigationView["target"], undefined>["limits"];
+	};
+
 	constructor(_: SceneBlueprintProps) {
 		super();
 

src/common/experiences/navigation.model.ts

@@ -0,0 +1,49 @@
+import type { Spherical, Vector3 } from "three";
+
+export interface NavigationView {
+	enabled?: boolean;
+	center?: Vector3;
+	spherical?: {
+		smoothed: Spherical;
+		smoothing: number;
+		limits: {
+			radius: { min: number; max: number };
+			phi: { min: number; max: number };
+			theta: { min: number; max: number };
+			enabled: boolean;
+			enabledPhi: boolean;
+			enabledTheta: boolean;
+		};
+		value: Spherical;
+	};
+	target?: {
+		value: Vector3;
+		smoothed: Vector3;
+		smoothing: number;
+		limits: {
+			x: { min: number; max: number };
+			y: { min: number; max: number };
+			z: { min: number; max: number };
+			enabled: boolean;
+		};
+	};
+	drag?: {
+		delta: { x: number; y: number };
+		previous: { x: number; y: number };
+		sensitivity: number;
+		alternative: boolean;
+	};
+	zoom?: { sensitivity: number; delta: number };
+	down?: (x: number, y: number) => unknown;
+	move?: (x: number, y: number) => unknown;
+	up?: () => unknown;
+	zooming?: (delta: number) => unknown;
+	onMouseDown?: (event: MouseEvent) => unknown;
+	onMouseUp?: (this: Window, ev: MouseEvent) => unknown;
+	onMouseMove?: (this: Window, ev: MouseEvent) => unknown;
+	onTouchStart?: (event: TouchEvent) => unknown;
+	onTouchEnd?: (event: TouchEvent) => unknown;
+	onTouchMove?: (event: TouchEvent) => unknown;
+	onContextMenu?: (event: MouseEvent) => unknown;
+	onWheel?: (event: Event) => unknown;
+}

src/experiences/home/camera.ts

@@ -71,6 +71,10 @@ export class Camera extends ExperienceBasedBlueprint {
 		return this._timeline;
 	}
 
+	public get currentCamera() {
+		return this.cameras[this.currentCameraIndex];
+	}
+
 	public construct() {
 		if (!Config.DEBUG && this._appDebug?.cameraHelper) {
 			this._experience.app.scene.remove(this._appDebug?.cameraHelper);
@@ -144,6 +148,8 @@ export class Camera extends ExperienceBasedBlueprint {
 		currentCamera.near = nextCamera.near;
 		currentCamera.far = nextCamera.far;
 
+		this.currentCamera.userData.lookAt = this._lookAtPosition;
+
 		this._appCameraInstance.copy(nextCamera);
 
 		this._appCameraInstance.fov = this._prevCameraProps.fov;
@@ -178,7 +184,13 @@ export class Camera extends ExperienceBasedBlueprint {
 	 */
 	public setCameraLookAt(v3 = new Vector3()) {
 		const V3 = v3.clone();
-		this._appCameraInstance?.lookAt(V3);
+
+		if (this._appCameraInstance) {
+			this._appCameraInstance.lookAt(V3);
+			this._appCameraInstance.userData.lookAt = V3;
+		}
+
+		this.currentCamera.userData.lookAt = V3;
 
 		return (this._lookAtPosition = V3);
 	}

src/experiences/home/index.ts

@@ -25,15 +25,15 @@ import { ErrorFactory } from "~/errors";
 import type { ExperienceConstructorProps } from "~/common/experiences/experience.model";
 
 export class HomeExperience extends ExperienceBlueprint {
-	ui?: UI;
-	router?: Router;
-	loader?: Loader;
-	renderer?: Renderer;
-	composer?: Composer;
-	camera?: Camera;
-	world?: World;
-	navigation?: Navigation;
-	debug?: Debug;
+	public ui?: UI;
+	public router?: Router;
+	public loader?: Loader;
+	public renderer?: Renderer;
+	public composer?: Composer;
+	public camera?: Camera;
+	public world?: World;
+	public navigation?: Navigation;
+	public debug?: Debug;
 
 	constructor(_?: Omit<ExperienceConstructorProps, "debug">) {
 		try {