Update viewer.js

viewer.js

@@ -2,27 +2,27 @@
 // ==============================
 
 async function loadImageAsTexture(url, app) {
-  return new Promise((resolve, reject) => {
-    const img = new window.Image();
-    img.crossOrigin = "anonymous";
-    img.onload = function () {
-      const tex = new pc.Texture(app.graphicsDevice, {
-        width: img.width,
-        height: img.height,
-        format: pc.PIXELFORMAT_R8_G8_B8_A8
-      });
-      tex.setSource(img);
-      resolve(tex);
-    };
-    img.onerror = reject;
-    img.src = url;
-  });
+    return new Promise((resolve, reject) => {
+        const img = new window.Image();
+        img.crossOrigin = "anonymous";
+        img.onload = function() {
+            const tex = new pc.Texture(app.graphicsDevice, {
+                width: img.width,
+                height: img.height,
+                format: pc.PIXELFORMAT_R8_G8_B8_A8,
+            });
+            tex.setSource(img);
+            resolve(tex);
+        };
+        img.onerror = reject;
+        img.src = url;
+    });
 }
 
 // --- Patch all window.Image to force crossOrigin="anonymous" ---
-(function () {
+(function() {
   const OriginalImage = window.Image;
-  window.Image = function (...args) {
+  window.Image = function(...args) {
     const img = new OriginalImage(...args);
     img.crossOrigin = "anonymous";
     return img;
@@ -36,10 +36,10 @@ function hexToRgbaArray(hex) {
     if (hex.length !== 8) return [1, 1, 1, 1];
     const num = parseInt(hex, 16);
     return [
-      ((num >> 24) & 0xff) / 255,
-      ((num >> 16) & 0xff) / 255,
-      ((num >> 8) & 0xff) / 255,
-      (num & 0xff) / 255
+      ((num >> 24) & 0xFF) / 255,
+      ((num >> 16) & 0xFF) / 255,
+      ((num >> 8)  & 0xFF) / 255,
+      (num & 0xFF) / 255
     ];
   } catch (e) {
     alert("hexToRgbaArray error: " + e);
@@ -49,709 +49,12 @@ function hexToRgbaArray(hex) {
 
 // ----- Utility: Recursive scene traversal -----
 function traverse(entity, callback) {
-  callback(entity);
-  if (entity.children) {
-    entity.children.forEach((child) => traverse(child, callback));
-  }
-}
-
-// ---------- Enregistre les scripts d’orbite sous des NOMS UNIQUES ----------
-function registerOrbitScriptsForInstance(suffix) {
-  const ORBIT = "orbitCamera_" + suffix;
-  const MOUSE = "orbitCameraInputMouse_" + suffix;
-  const TOUCH = "orbitCameraInputTouch_" + suffix;
-  const KEYBD = "orbitCameraInputKeyboard_" + suffix;
-
-  // ---------------- OrbitCamera ----------------
-  var OrbitCamera = pc.createScript(ORBIT);
-
-  OrbitCamera.attributes.add('distanceMax', { type: 'number', default: 20, title: 'Distance Max' });
-  OrbitCamera.attributes.add('distanceMin', { type: 'number', default: 1, title: 'Distance Min' });
-  OrbitCamera.attributes.add('pitchAngleMax', { type: 'number', default: 90, title: 'Pitch Angle Max (degrees)' });
-  OrbitCamera.attributes.add('pitchAngleMin', { type: 'number', default: 0, title: 'Pitch Angle Min (degrees)' });
-  OrbitCamera.attributes.add('yawAngleMax', { type: 'number', default: 360, title: 'Yaw Angle Max (degrees)' });
-  OrbitCamera.attributes.add('yawAngleMin', { type: 'number', default: -360, title: 'Yaw Angle Min (degrees)' });
-  OrbitCamera.attributes.add('minY', { type: 'number', default: 0, title: 'Minimum Y' });
-
-  OrbitCamera.attributes.add('inertiaFactor', { type: 'number', default: 0.2, title: 'Inertia Factor' });
-  OrbitCamera.attributes.add('focusEntity', { type: 'entity', title: 'Focus Entity' });
-  OrbitCamera.attributes.add('frameOnStart', { type: 'boolean', default: true, title: 'Frame on Start' });
-
-  Object.defineProperty(OrbitCamera.prototype, 'distance', {
-      get: function () { return this._targetDistance; },
-      set: function (value) { this._targetDistance = this._clampDistance(value); }
-  });
-
-  Object.defineProperty(OrbitCamera.prototype, 'orthoHeight', {
-      get: function () { return this.entity.camera.orthoHeight; },
-      set: function (value) { this.entity.camera.orthoHeight = Math.max(0, value); }
-  });
-
-  Object.defineProperty(OrbitCamera.prototype, 'pitch', {
-      get: function () { return this._targetPitch; },
-      set: function (value) { this._targetPitch = this._clampPitchAngle(value); }
-  });
-
-  Object.defineProperty(OrbitCamera.prototype, 'yaw', {
-      get: function () { return this._targetYaw; },
-      set: function (value) { this._targetYaw = this._clampYawAngle(value); }
-  });
-
-  Object.defineProperty(OrbitCamera.prototype, 'pivotPoint', {
-      get: function () { return this._pivotPoint; },
-      set: function (value) { this._pivotPoint.copy(value); }
-  });
-
-  OrbitCamera.prototype.focus = function (focusEntity) {
-      this._buildAabb(focusEntity);
-      var halfExtents = this._modelsAabb.halfExtents;
-      var radius = Math.max(halfExtents.x, Math.max(halfExtents.y, halfExtents.z));
-      this.distance = (radius * 1.5) / Math.sin(0.5 * this.entity.camera.fov * pc.math.DEG_TO_RAD);
-      this._removeInertia();
-      this._pivotPoint.copy(this._modelsAabb.center);
-  };
-
-  OrbitCamera.distanceBetween = new pc.Vec3();
-
-  OrbitCamera.prototype.resetAndLookAtPoint = function (resetPoint, lookAtPoint) {
-      this.pivotPoint.copy(lookAtPoint);
-      this.entity.setPosition(resetPoint);
-      this.entity.lookAt(lookAtPoint);
-      var distance = OrbitCamera.distanceBetween;
-      distance.sub2(lookAtPoint, resetPoint);
-      this.distance = distance.length();
-      this.pivotPoint.copy(lookAtPoint);
-      var cameraQuat = this.entity.getRotation();
-      this.yaw = this._calcYaw(cameraQuat);
-      this.pitch = this._calcPitch(cameraQuat, this.yaw);
-      this._removeInertia();
-      this._updatePosition();
-  };
-
-  OrbitCamera.prototype.resetAndLookAtEntity = function (resetPoint, entity) {
-      this._buildAabb(entity);
-      this.resetAndLookAtPoint(resetPoint, this._modelsAabb.center);
-  };
-
-  OrbitCamera.prototype.reset = function (yaw, pitch, distance) {
-      this.pitch = pitch;
-      this.yaw = yaw;
-      this.distance = distance;
-      this._removeInertia();
-  };
-
-  OrbitCamera.prototype.resetToPosition = function (position, lookAtPoint) {
-      this.entity.setPosition(position);
-      this.entity.lookAt(lookAtPoint);
-      this._pivotPoint.copy(lookAtPoint);
-      var distanceVec = new pc.Vec3();
-      distanceVec.sub2(position, lookAtPoint);
-      this._targetDistance = this._distance = distanceVec.length();
-      var cameraQuat = this.entity.getRotation();
-      this._targetYaw = this._yaw = this._calcYaw(cameraQuat);
-      this._targetPitch = this._pitch = this._calcPitch(cameraQuat, this._yaw);
-      this._removeInertia();
-      this._updatePosition();
-  };
-
-  // Helper: calc cam Y if pivot became 'pivot'
-  OrbitCamera.prototype.worldCameraYForPivot = function(pivot) {
-      var quat = new pc.Quat();
-      quat.setFromEulerAngles(this._pitch, this._yaw, 0);
-      var forward = new pc.Vec3();
-      quat.transformVector(pc.Vec3.FORWARD, forward);
-      var camPos = pivot.clone();
-      camPos.add(forward.clone().scale(-this._distance));
-      return camPos.y;
-  };
-
-  OrbitCamera.prototype.initialize = function () {
-      var self = this;
-      var onWindowResize = function () { self._checkAspectRatio(); };
-      window.addEventListener('resize', onWindowResize, false);
-      this._checkAspectRatio();
-
-      this._modelsAabb = new pc.BoundingBox();
-      this._buildAabb(this.focusEntity || this.app.root);
-
-      this.entity.lookAt(this._modelsAabb.center);
-      this._pivotPoint = new pc.Vec3();
-      this._pivotPoint.copy(this._modelsAabb.center);
-
-      var cameraQuat = this.entity.getRotation();
-      this._yaw = this._calcYaw(cameraQuat);
-      this._pitch = this._clampPitchAngle(this._calcPitch(cameraQuat, this._yaw));
-      this.entity.setLocalEulerAngles(this._pitch, this._yaw, 0);
-
-      this._distance = 0;
-      this._targetYaw = this._yaw;
-      this._targetPitch = this._pitch;
-
-      if (this.frameOnStart) {
-          this.focus(this.focusEntity || this.app.root);
-      } else {
-          var distanceBetween = new pc.Vec3();
-          distanceBetween.sub2(this.entity.getPosition(), this._pivotPoint);
-          this._distance = this._clampDistance(distanceBetween.length());
-      }
-      this._targetDistance = this._distance;
-
-      this.on('attr:distanceMin', function () { this._distance = this._clampDistance(this._distance); });
-      this.on('attr:distanceMax', function () { this._distance = this._clampDistance(this._distance); });
-      this.on('attr:pitchAngleMin', function () { this._pitch = this._clampPitchAngle(this._pitch); });
-      this.on('attr:pitchAngleMax', function () { this._pitch = this._clampPitchAngle(this._pitch); });
-
-      this.on('attr:focusEntity', function (value) {
-          if (this.frameOnStart) { this.focus(value || this.app.root); }
-          else { this.resetAndLookAtEntity(this.entity.getPosition(), value || this.app.root); }
-      });
-
-      this.on('attr:frameOnStart', function (value) {
-          if (value) { this.focus(this.focusEntity || this.app.root); }
-      });
-
-      this.on('destroy', function () { window.removeEventListener('resize', onWindowResize, false); });
-  };
-
-  OrbitCamera.prototype.update = function (dt) {
-      var t = this.inertiaFactor === 0 ? 1 : Math.min(dt / this.inertiaFactor, 1);
-      this._distance = pc.math.lerp(this._distance, this._targetDistance, t);
-      this._yaw = pc.math.lerp(this._yaw, this._targetYaw, t);
-      this._pitch = pc.math.lerp(this._pitch, this._targetPitch, t);
-      this._updatePosition();
-  };
-
-  OrbitCamera.prototype._updatePosition = function () {
-      this.entity.setLocalPosition(0, 0, 0);
-      this.entity.setLocalEulerAngles(this._pitch, this._yaw, 0);
-
-      var position = this.entity.getPosition();
-      position.copy(this.entity.forward);
-      position.mulScalar(-this._distance);
-      position.add(this.pivotPoint);
-
-      position.y = Math.max(position.y, this.minY);
-      this.entity.setPosition(position);
-  };
-
-  OrbitCamera.prototype._removeInertia = function () {
-      this._yaw = this._targetYaw;
-      this._pitch = this._targetPitch;
-      this._distance = this._targetDistance;
-  };
-
-  OrbitCamera.prototype._checkAspectRatio = function () {
-      var height = this.app.graphicsDevice.height;
-      var width = this.app.graphicsDevice.width;
-      this.entity.camera.horizontalFov = (height > width);
-  };
-
-  OrbitCamera.prototype._buildAabb = function (entity) {
-      var i, m, meshInstances = [];
-
-      var renders = entity.findComponents('render');
-      for (i = 0; i < renders.length; i++) {
-          var render = renders[i];
-          for (m = 0; m < render.meshInstances.length; m++) {
-              meshInstances.push(render.meshInstances[m]);
-          }
-      }
-
-      var models = entity.findComponents('model');
-      for (i = 0; i < models.length; i++) {
-          var model = models[i];
-          for (m = 0; m < model.meshInstances.length; m++) {
-              meshInstances.push(model.meshInstances[m]);
-          }
-      }
-
-      var gsplats = entity.findComponents('gsplat');
-      for (i = 0; i < gsplats.length; i++) {
-          var gsplat = gsplats[i];
-          var instance = gsplat.instance;
-          if (instance?.meshInstance) {
-              meshInstances.push(instance.meshInstance);
-          }
-      }
-
-      for (i = 0; i < meshInstances.length; i++) {
-          if (i === 0) {
-              this._modelsAabb.copy(meshInstances[i].aabb);
-          } else {
-              this._modelsAabb.add(meshInstances[i].aabb);
-          }
-      }
-  };
-
-  OrbitCamera.prototype._calcYaw = function (quat) {
-      var transformedForward = new pc.Vec3();
-      quat.transformVector(pc.Vec3.FORWARD, transformedForward);
-      return Math.atan2(-transformedForward.x, -transformedForward.z) * pc.math.RAD_TO_DEG;
-  };
-
-  OrbitCamera.prototype._clampDistance = function (distance) {
-      if (this.distanceMax > 0) {
-          return pc.math.clamp(distance, this.distanceMin, this.distanceMax);
-      }
-      return Math.max(distance, this.distanceMin);
-  };
-
-  OrbitCamera.prototype._clampPitchAngle = function (pitch) {
-      return pc.math.clamp(pitch, this.pitchAngleMin, this.pitchAngleMax);
-  };
-
-  OrbitCamera.prototype._clampYawAngle = function (yaw) {
-      return pc.math.clamp(yaw, -this.yawAngleMax, -this.yawAngleMin);
-  };
-
-  OrbitCamera.quatWithoutYaw = new pc.Quat();
-  OrbitCamera.yawOffset = new pc.Quat();
-
-  OrbitCamera.prototype._calcPitch = function (quat, yaw) {
-      var quatWithoutYaw = OrbitCamera.quatWithoutYaw;
-      var yawOffset = OrbitCamera.yawOffset;
-      yawOffset.setFromEulerAngles(0, -yaw, 0);
-      quatWithoutYaw.mul2(yawOffset, quat);
-      var transformedForward = new pc.Vec3();
-      quatWithoutYaw.transformVector(pc.Vec3.FORWARD, transformedForward);
-      return Math.atan2(-transformedForward.y, -transformedForward.z) * pc.math.RAD_TO_DEG;
-  };
-
-  // ---------------- Mouse ----------------
-  var OrbitCameraInputMouse = pc.createScript(MOUSE);
-  OrbitCameraInputMouse.attributes.add('orbitSensitivity', { type: 'number', default: 0.3 });
-  OrbitCameraInputMouse.attributes.add('distanceSensitivity', { type: 'number', default: 0.4 });
-
-  OrbitCameraInputMouse.prototype.initialize = function () {
-      this.orbitCamera = this.entity.script[ORBIT];
-
-      if (this.orbitCamera) {
-          var self = this;
-          var onMouseOut = function () { self.onMouseOut(); };
-
-          this.app.mouse.on(pc.EVENT_MOUSEDOWN, this.onMouseDown, this);
-          this.app.mouse.on(pc.EVENT_MOUSEUP, this.onMouseUp, this);
-          this.app.mouse.on(pc.EVENT_MOUSEMOVE, this.onMouseMove, this);
-          this.app.mouse.on(pc.EVENT_MOUSEWHEEL, this.onMouseWheel, this);
-          window.addEventListener('mouseout', onMouseOut, false);
-
-          this.on('destroy', function () {
-              this.app.mouse.off(pc.EVENT_MOUSEDOWN, this.onMouseDown, this);
-              this.app.mouse.off(pc.EVENT_MOUSEUP, this.onMouseUp, this);
-              this.app.mouse.off(pc.EVENT_MOUSEMOVE, this.onMouseMove, this);
-              this.app.mouse.off(pc.EVENT_MOUSEWHEEL, this.onMouseWheel, this);
-              window.removeEventListener('mouseout', onMouseOut, false);
-          });
-      }
-
-      this.app.mouse.disableContextMenu();
-
-      this.lookButtonDown = false;
-      this.panButtonDown = false;
-      this.lastPoint = new pc.Vec2();
-  };
-
-  OrbitCameraInputMouse.fromWorldPoint = new pc.Vec3();
-  OrbitCameraInputMouse.toWorldPoint = new pc.Vec3();
-  OrbitCameraInputMouse.worldDiff = new pc.Vec3();
-
-  OrbitCameraInputMouse.prototype.pan = function (screenPoint) {
-      var fromWorldPoint = OrbitCameraInputMouse.fromWorldPoint;
-      var toWorldPoint = OrbitCameraInputMouse.toWorldPoint;
-      var worldDiff = OrbitCameraInputMouse.worldDiff;
-
-      var camera = this.entity.camera;
-      var distance = this.orbitCamera.distance;
-
-      camera.screenToWorld(screenPoint.x, screenPoint.y, distance, fromWorldPoint);
-      camera.screenToWorld(this.lastPoint.x, this.lastPoint.y, distance, toWorldPoint);
-
-      worldDiff.sub2(toWorldPoint, fromWorldPoint);
-
-      var proposedPivot = this.orbitCamera.pivotPoint.clone().add(worldDiff);
-      var minY = this.orbitCamera.minY;
-      var resultingY = this.orbitCamera.worldCameraYForPivot(proposedPivot);
-
-      if (resultingY >= minY - 1e-4) {
-          this.orbitCamera.pivotPoint.add(worldDiff);
-      } else {
-          worldDiff.y = 0;
-          proposedPivot = this.orbitCamera.pivotPoint.clone().add(worldDiff);
-          resultingY = this.orbitCamera.worldCameraYForPivot(proposedPivot);
-          if (resultingY >= minY - 1e-4) {
-              this.orbitCamera.pivotPoint.add(worldDiff);
-          }
-      }
-  };
-
-  OrbitCameraInputMouse.prototype.onMouseDown = function (event) {
-      switch (event.button) {
-          case pc.MOUSEBUTTON_LEFT: this.panButtonDown = true; break;
-          case pc.MOUSEBUTTON_MIDDLE:
-          case pc.MOUSEBUTTON_RIGHT: this.lookButtonDown = true; break;
-      }
-  };
-
-  OrbitCameraInputMouse.prototype.onMouseUp = function (event) {
-      switch (event.button) {
-          case pc.MOUSEBUTTON_LEFT: this.panButtonDown = false; break;
-          case pc.MOUSEBUTTON_MIDDLE:
-          case pc.MOUSEBUTTON_RIGHT: this.lookButtonDown = false; break;
-      }
-  };
-
-  OrbitCameraInputMouse.prototype.onMouseMove = function (event) {
-      if (this.lookButtonDown) {
-          var sens = this.orbitSensitivity;
-
-          var deltaPitch = event.dy * sens;
-          var deltaYaw = event.dx * sens;
-
-          var currPitch = this.orbitCamera.pitch;
-          var currYaw = this.orbitCamera.yaw;
-          var currDist = this.orbitCamera.distance;
-          var currPivot = this.orbitCamera.pivotPoint.clone();
-
-          var camQuat = new pc.Quat();
-          camQuat.setFromEulerAngles(currPitch, currYaw, 0);
-          var forward = new pc.Vec3();
-          camQuat.transformVector(pc.Vec3.FORWARD, forward);
-          var preY = currPivot.y + (-forward.y) * currDist;
-
-          var proposedPitch = currPitch - deltaPitch;
-          var testQuat = new pc.Quat();
-          testQuat.setFromEulerAngles(proposedPitch, currYaw, 0);
-          var testForward = new pc.Vec3();
-          testQuat.transformVector(pc.Vec3.FORWARD, testForward);
-          var proposedY = currPivot.y + (-testForward.y) * currDist;
-
-          var minY = this.orbitCamera.minY;
-          var wouldGoBelow = proposedY < minY - 1e-4;
-
-          if (wouldGoBelow && (proposedY < preY)) {
-              this.orbitCamera.yaw = currYaw - deltaYaw;
-          } else {
-              this.orbitCamera.pitch = proposedPitch;
-              this.orbitCamera.yaw = currYaw - deltaYaw;
-          }
-      } else if (this.panButtonDown) {
-          this.pan(new pc.Vec2(event.x, event.y));
-      }
-
-      this.lastPoint.set(event.x, event.y);
-  };
-
-  OrbitCameraInputMouse.prototype.onMouseWheel = function (event) {
-      if (this.entity.camera.projection === pc.PROJECTION_PERSPECTIVE) {
-          this.orbitCamera.distance -= event.wheelDelta * this.distanceSensitivity * (this.orbitCamera.distance * 0.1);
-      } else {
-          this.orbitCamera.orthoHeight -= event.wheelDelta * this.distanceSensitivity * (this.orbitCamera.orthoHeight * 0.1);
-      }
-      event.event.preventDefault();
-  };
-
-  OrbitCameraInputMouse.prototype.onMouseOut = function () {
-      this.lookButtonDown = false;
-      this.panButtonDown = false;
-  };
-
-  // ---------------- Touch ----------------
-  var OrbitCameraInputTouch = pc.createScript(TOUCH);
-  OrbitCameraInputTouch.attributes.add('orbitSensitivity', { type: 'number', default: 0.6 });
-  OrbitCameraInputTouch.attributes.add('distanceSensitivity', { type: 'number', default: 0.5 });
-
-  OrbitCameraInputTouch.prototype.initialize = function () {
-      this.orbitCamera = this.entity.script[ORBIT];
-      this.lastTouchPoint = new pc.Vec2();
-      this.lastPinchMidPoint = new pc.Vec2();
-      this.lastPinchDistance = 0;
-
-      if (this.orbitCamera && this.app.touch) {
-          this.app.touch.on(pc.EVENT_TOUCHSTART, this.onTouchStartEndCancel, this);
-          this.app.touch.on(pc.EVENT_TOUCHEND, this.onTouchStartEndCancel, this);
-          this.app.touch.on(pc.EVENT_TOUCHCANCEL, this.onTouchStartEndCancel, this);
-          this.app.touch.on(pc.EVENT_TOUCHMOVE, this.onTouchMove, this);
-
-          this.on('destroy', function () {
-              this.app.touch.off(pc.EVENT_TOUCHSTART, this.onTouchStartEndCancel, this);
-              this.app.touch.off(pc.EVENT_TOUCHEND, this.onTouchStartEndCancel, this);
-              this.app.touch.off(pc.EVENT_TOUCHCANCEL, this.onTouchStartEndCancel, this);
-              this.app.touch.off(pc.EVENT_TOUCHMOVE, this.onTouchMove, this);
-          });
-      }
-  };
-
-  OrbitCameraInputTouch.prototype.getPinchDistance = function (pointA, pointB) {
-      var dx = pointA.x - pointB.x;
-      var dy = pointA.y - pointB.y;
-      return Math.sqrt((dx * dx) + (dy * dy));
-  };
-
-  OrbitCameraInputTouch.prototype.calcMidPoint = function (pointA, pointB, result) {
-      result.set(pointB.x - pointA.x, pointB.y - pointA.y);
-      result.mulScalar(0.5);
-      result.x += pointA.x;
-      result.y += pointA.y;
-  };
-
-  OrbitCameraInputTouch.prototype.onTouchStartEndCancel = function (event) {
-      var touches = event.touches;
-      if (touches.length === 1) {
-          this.lastTouchPoint.set(touches[0].x, touches[0].y);
-      } else if (touches.length === 2) {
-          this.lastPinchDistance = this.getPinchDistance(touches[0], touches[1]);
-          this.calcMidPoint(touches[0], touches[1], this.lastPinchMidPoint);
-      }
-  };
-
-  OrbitCameraInputTouch.fromWorldPoint = new pc.Vec3();
-  OrbitCameraInputTouch.toWorldPoint = new pc.Vec3();
-  OrbitCameraInputTouch.worldDiff = new pc.Vec3();
-
-  OrbitCameraInputTouch.prototype.pan = function (midPoint) {
-      var fromWorldPoint = OrbitCameraInputTouch.fromWorldPoint;
-      var toWorldPoint = OrbitCameraInputTouch.toWorldPoint;
-      var worldDiff = OrbitCameraInputTouch.worldDiff;
-
-      var camera = this.entity.camera;
-      var distance = this.orbitCamera.distance;
-
-      camera.screenToWorld(midPoint.x, midPoint.y, distance, fromWorldPoint);
-      camera.screenToWorld(this.lastPinchMidPoint.x, this.lastPinchMidPoint.y, distance, toWorldPoint);
-
-      worldDiff.sub2(toWorldPoint, fromWorldPoint);
-
-      var proposedPivot = this.orbitCamera.pivotPoint.clone().add(worldDiff);
-      var minY = this.orbitCamera.minY;
-      var resultingY = this.orbitCamera.worldCameraYForPivot(proposedPivot);
-
-      if (resultingY >= minY - 1e-4) {
-          this.orbitCamera.pivotPoint.add(worldDiff);
-      } else {
-          worldDiff.y = 0;
-          proposedPivot = this.orbitCamera.pivotPoint.clone().add(worldDiff);
-          resultingY = this.orbitCamera.worldCameraYForPivot(proposedPivot);
-          if (resultingY >= minY - 1e-4) {
-              this.orbitCamera.pivotPoint.add(worldDiff);
-          }
-      }
-  };
-
-  OrbitCameraInputTouch.pinchMidPoint = new pc.Vec2();
-
-  OrbitCameraInputTouch.prototype.onTouchMove = function (event) {
-      var pinchMidPoint = OrbitCameraInputTouch.pinchMidPoint;
-      var touches = event.touches;
-
-      if (touches.length === 1) {
-          var touch = touches[0];
-          var sens = this.orbitSensitivity;
-
-          var deltaPitch = (touch.y - this.lastTouchPoint.y) * sens;
-          var deltaYaw = (touch.x - this.lastTouchPoint.x) * sens;
-
-          var currPitch = this.orbitCamera.pitch;
-          var currYaw = this.orbitCamera.yaw;
-          var currDist = this.orbitCamera.distance;
-          var currPivot = this.orbitCamera.pivotPoint.clone();
-
-          var camQuat = new pc.Quat();
-          camQuat.setFromEulerAngles(currPitch, currYaw, 0);
-          var forward = new pc.Vec3();
-          camQuat.transformVector(pc.Vec3.FORWARD, forward);
-          var preY = currPivot.y + (-forward.y) * currDist;
-
-          var proposedPitch = currPitch - deltaPitch;
-          var testQuat = new pc.Quat();
-          testQuat.setFromEulerAngles(proposedPitch, currYaw, 0);
-          var testForward = new pc.Vec3();
-          testQuat.transformVector(pc.Vec3.FORWARD, testForward);
-          var proposedY = currPivot.y + (-testForward.y) * currDist;
-
-          var minY = this.orbitCamera.minY;
-          var wouldGoBelow = proposedY < minY - 1e-4;
-
-          if (wouldGoBelow && (proposedY < preY)) {
-              this.orbitCamera.yaw = currYaw - deltaYaw;
-          } else {
-              this.orbitCamera.pitch = proposedPitch;
-              this.orbitCamera.yaw = currYaw - deltaYaw;
-          }
-
-          this.lastTouchPoint.set(touch.x, touch.y);
-      } else if (touches.length === 2) {
-          var currentPinchDistance = this.getPinchDistance(touches[0], touches[1]);
-          var diffInPinchDistance = currentPinchDistance - this.lastPinchDistance;
-          this.lastPinchDistance = currentPinchDistance;
-
-          this.orbitCamera.distance -= (diffInPinchDistance * this.distanceSensitivity * 0.1) * (this.orbitCamera.distance * 0.1);
-
-          this.calcMidPoint(touches[0], touches[1], pinchMidPoint);
-          this.pan(pinchMidPoint);
-          this.lastPinchMidPoint.copy(pinchMidPoint);
-      }
-  };
-
-  // ---------------- Keyboard (par canvas) ----------------
-  var OrbitCameraInputKeyboard = pc.createScript(KEYBD);
-
-  OrbitCameraInputKeyboard.attributes.add('forwardSpeed', { type: 'number', default: 1.2 });
-  OrbitCameraInputKeyboard.attributes.add('strafeSpeed',  { type: 'number', default: 1.2 });
-  OrbitCameraInputKeyboard.attributes.add('orbitPitchSpeedDeg', { type: 'number', default: 90  });
-  OrbitCameraInputKeyboard.attributes.add('orbitYawSpeedDeg',   { type: 'number', default: 120 });
-  OrbitCameraInputKeyboard.attributes.add('zoomKeySensitivity', { type: 'number', default: 3.0 });
-
-  OrbitCameraInputKeyboard.prototype.initialize = function () {
-      this.orbitCamera = this.entity.script[ORBIT];
-
-      this._keys = Object.create(null);
-      this._active = false;
-
-      var el = this.app.graphicsDevice.canvas;
-      if (!el.hasAttribute('tabindex')) el.setAttribute('tabindex', '0');
-
-      var shouldBlock = function(ev) {
-          if (!ev) return false;
-          var k = ev.key;
-          return k === 'ArrowUp' || k === 'ArrowDown' || k === 'ArrowLeft' || k === 'ArrowRight' ||
-                 k === 'PageUp'  || k === 'PageDown' || k === 'Home'      || k === 'End' ||
-                 k === ' ' || k === 'Spacebar' || (ev.ctrlKey && (k === 'ArrowUp' || k === 'ArrowDown'));
-      };
-
-      this._onKeyDown = (ev) => {
-          if (!this._active) return;
-          this._keys[ev.key] = true;
-          if (shouldBlock(ev)) ev.preventDefault();
-      };
-
-      this._onKeyUp = (ev) => { this._keys[ev.key] = false; };
-      this._onBlur = () => { this._keys = Object.create(null); };
-
-      this._onEnter = () => {
-          this._active = true;
-          try { el.focus({ preventScroll: true }); } catch(e) { el.focus(); }
-      };
-
-      this._onLeave = () => {
-          this._active = false;
-          el.blur();
-          this._keys = Object.create(null);
-      };
-
-      el.addEventListener('keydown', this._onKeyDown);
-      el.addEventListener('keyup', this._onKeyUp);
-      el.addEventListener('blur', this._onBlur);
-      el.addEventListener('pointerenter', this._onEnter);
-      el.addEventListener('pointerleave', this._onLeave);
-
-      this.on('destroy', function () {
-          el.removeEventListener('keydown', this._onKeyDown);
-          el.removeEventListener('keyup', this._onKeyUp);
-          el.removeEventListener('blur', this._onBlur);
-          el.removeEventListener('pointerenter', this._onEnter);
-          el.removeEventListener('pointerleave', this._onLeave);
-      }, this);
-  };
-
-  OrbitCameraInputKeyboard.prototype._pressed = function(name) {
-      return !!(this._keys[name] || this._keys[name + 'Left'] || this._keys[name + 'Right']);
-  };
-
-  OrbitCameraInputKeyboard.prototype.update = function (dt) {
-      if (!this.orbitCamera) return;
-
-      var up = !!this._keys['ArrowUp'];
-      var dn = !!this._keys['ArrowDown'];
-      var lt = !!this._keys['ArrowLeft'];
-      var rt = !!this._keys['ArrowRight'];
-
-      var shift = this._pressed('Shift');
-      var ctrl  = this._pressed('Control');
-
-      if (shift && (up || dn || lt || rt)) {
-          var yawDir = (rt ? 1 : 0) - (lt ? 1 : 0);
-          if (yawDir !== 0) {
-              var dYaw = yawDir * this.orbitYawSpeedDeg * dt;
-              this.orbitCamera.yaw = this.orbitCamera.yaw + dYaw;
-          }
-
-          var pitchDir = (up ? 1 : 0) - (dn ? 1 : 0);
-          if (pitchDir !== 0) {
-              var dPitch = pitchDir * this.orbitPitchSpeedDeg * dt;
-
-              var currPitch = this.orbitCamera.pitch;
-              var currYaw   = this.orbitCamera.yaw;
-              var currDist  = this.orbitCamera.distance;
-              var currPivot = this.orbitCamera.pivotPoint.clone();
-
-              var camQuat = new pc.Quat().setFromEulerAngles(currPitch, currYaw, 0);
-              var forward = new pc.Vec3(); camQuat.transformVector(pc.Vec3.FORWARD, forward);
-              var preY = currPivot.y + (-forward.y) * currDist;
-
-              var testPitch = currPitch + dPitch;
-              var testQuat = new pc.Quat().setFromEulerAngles(testPitch, currYaw, 0);
-              var testForward = new pc.Vec3(); testQuat.transformVector(pc.Vec3.FORWARD, testForward);
-              var proposedY = currPivot.y + (-testForward.y) * currDist;
-
-              var minY = this.orbitCamera.minY;
-              var wouldGoBelow = proposedY < minY - 1e-4;
-
-              if (!(wouldGoBelow && (proposedY < preY))) {
-                  this.orbitCamera.pitch = testPitch;
-              }
-          }
-          return;
-      }
-
-      if (ctrl && (up || dn)) {
-          var zoomSign = (up ? 1 : 0) - (dn ? 1 : 0);
-          if (zoomSign !== 0) {
-              if (this.entity.camera.projection === pc.PROJECTION_PERSPECTIVE) {
-                  var dz = zoomSign * this.zoomKeySensitivity * (this.orbitCamera.distance * 0.5) * dt;
-                  this.orbitCamera.distance -= dz;
-              } else {
-                  var doh = zoomSign * this.zoomKeySensitivity * (this.orbitCamera.orthoHeight * 0.5) * dt;
-                  this.orbitCamera.orthoHeight -= doh;
-              }
-          }
-          return;
-      }
-
-      var moveVert = (up ? 1 : 0) - (dn ? 1 : 0);
-      var moveRight = (rt ? 1 : 0) - (lt ? 1 : 0);
-
-      if (moveVert === 0 && moveRight === 0) return;
-
-      var dist = Math.max(0.1, this.orbitCamera.distance);
-      var speedV = this.forwardSpeed * dist;
-      var speedR = this.strafeSpeed  * dist;
-
-      var dy = moveVert * speedV * dt;
-      if (dy !== 0) {
-          var currentCamY = this.orbitCamera.worldCameraYForPivot(this.orbitCamera.pivotPoint);
-          var minY = this.orbitCamera.minY;
-          var proposedCamY = currentCamY + dy;
-          if (proposedCamY < minY) {
-              dy = Math.max(dy, minY - currentCamY);
-          }
-          if (dy !== 0) {
-              this.orbitCamera._pivotPoint.y += dy;
-          }
-      }
-
-      var right = this.entity.right.clone(); right.y = 0; if (right.lengthSq() > 1e-8) right.normalize();
-      var dx = moveRight * speedR * dt;
-      if (dx !== 0) {
-          this.orbitCamera._pivotPoint.add(right.mulScalar(dx));
-      }
-  };
-
-  // renvoie les noms pour créer les scripts
-  return { ORBIT, MOUSE, TOUCH, KEYBD };
+    callback(entity);
+    if (entity.children) {
+        entity.children.forEach(child => traverse(child, callback));
+    }
 }
 
-// ---------------------------------------------------------------------------
-
 let pc;
 export let app = null;
 let cameraEntity = null;
@@ -775,7 +78,7 @@ export async function initializeViewer(config, instanceId) {
   const isIOS = /iPad|iPhone|iPod/.test(navigator.userAgent);
   const isMobile = isIOS || /Android/i.test(navigator.userAgent);
 
-  // Params
+  //prends les differents arguments de config.json
   sogsUrl = config.sogs_json_url;
   glbUrl = (config.glb_url !== undefined) ? config.glb_url : "https://huggingface.co/datasets/MikaFil/viewer_gs/resolve/main/ressources/espace_expo/sol_blanc_2.glb";
   presentoirUrl = (config.presentoir_url !== undefined) ? config.presentoir_url : "https://huggingface.co/datasets/MikaFil/viewer_gs/resolve/main/ressources/espace_expo/sol_blanc_2.glb";
@@ -815,47 +118,90 @@ export async function initializeViewer(config, instanceId) {
   chosenCameraY = isMobile ? cameraYPhone : cameraY;
   chosenCameraZ = isMobile ? cameraZPhone : cameraZ;
 
-  // Canvas
-  const canvasId = "canvas-" + instanceId;
-  const progressDialog = document.getElementById("progress-dialog-" + instanceId);
-  const progressIndicator = document.getElementById("progress-indicator-" + instanceId);
-  const viewerContainer = document.getElementById("viewer-container-" + instanceId);
+  //cree le nouveau canva (instanceId est une valeur aléatoire pour gérer plusieurs canvas sur la meme page)
+  const canvasId = 'canvas-' + instanceId;
+  const progressDialog = document.getElementById('progress-dialog-' + instanceId);
+  const progressIndicator = document.getElementById('progress-indicator-' + instanceId);
+  const viewerContainer = document.getElementById('viewer-container-' + instanceId);
 
   let oldCanvas = document.getElementById(canvasId);
   if (oldCanvas) oldCanvas.remove();
 
-  const canvas = document.createElement("canvas");
+  const canvas = document.createElement('canvas');
   canvas.id = canvasId;
-  canvas.className = "ply-canvas";
+  canvas.className = 'ply-canvas';
   canvas.style.width = "100%";
   canvas.style.height = "100%";
-  canvas.setAttribute("tabindex", "0");
+  canvas.setAttribute('tabindex', '0');
   viewerContainer.insertBefore(canvas, progressDialog);
 
   canvas.style.touchAction = "none";
   canvas.style.webkitTouchCallout = "none";
-  canvas.addEventListener("gesturestart", (e) => e.preventDefault());
-  canvas.addEventListener("gesturechange", (e) => e.preventDefault());
-  canvas.addEventListener("gestureend", (e) => e.preventDefault());
-  canvas.addEventListener("dblclick", (e) => e.preventDefault());
-  canvas.addEventListener("touchstart", (e) => {
-    if (e.touches.length > 1) e.preventDefault();
-  }, { passive: false });
-  canvas.addEventListener("wheel", (e) => { e.preventDefault(); }, { passive: false });
+  canvas.addEventListener('gesturestart', e => e.preventDefault());
+  canvas.addEventListener('gesturechange', e => e.preventDefault());
+  canvas.addEventListener('gestureend', e => e.preventDefault());
+  canvas.addEventListener('dblclick', e => e.preventDefault());
+  canvas.addEventListener('touchstart', e => { if (e.touches.length > 1) e.preventDefault(); }, { passive: false });
+  canvas.addEventListener('wheel', (e) => { e.preventDefault(); }, { passive: false });
+
+  // --- Clavier : bloquer le scroll seulement quand le pointeur est au-dessus du canvas ---
+  const scrollKeys = new Set([
+    'ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight',
+    'PageUp', 'PageDown', 'Home', 'End', ' ', 'Space', 'Spacebar'
+  ]);
+
+  let isPointerOverCanvas = false;
 
-  // focus / blur au survol (pour clavier local)
-  const focusCanvas = () => { try { canvas.focus({ preventScroll: true }); } catch (e) { canvas.focus(); } };
-  canvas.addEventListener('pointerenter', focusCanvas);
-  canvas.addEventListener('pointerleave', () => canvas.blur());
+  const focusCanvas = () => canvas.focus({ preventScroll: true });
+
+  const onPointerEnter = () => {
+    isPointerOverCanvas = true;
+    focusCanvas();
+  };
+
+  const onPointerLeave = () => {
+    isPointerOverCanvas = false;
+    // rendre immédiatement le scroll à la page sans recliquer
+    if (document.activeElement === canvas) {
+      canvas.blur();
+    }
+  };
+
+  // Fallback souris si pointer events indisponibles
+  canvas.addEventListener('pointerenter', onPointerEnter);
+  canvas.addEventListener('pointerleave', onPointerLeave);
+  canvas.addEventListener('mouseenter', onPointerEnter);
+  canvas.addEventListener('mouseleave', onPointerLeave);
+
+  // Forcer le focus quand on interagit
+  canvas.addEventListener('mousedown', focusCanvas);
+  canvas.addEventListener('touchstart', () => { focusCanvas(); }, { passive: false });
+
+  // Si le canvas perd le focus (Alt+Tab, click ailleurs…), on arrête de bloquer
+  const onCanvasBlur = () => { isPointerOverCanvas = false; };
+  canvas.addEventListener('blur', onCanvasBlur);
+
+  // Capture au niveau fenêtre pour bloquer le scroll, mais seulement si pointeur dessus
+  const onKeyDownCapture = (e) => {
+    if (!isPointerOverCanvas) return;
+    if (scrollKeys.has(e.key) || scrollKeys.has(e.code)) {
+      e.preventDefault(); // bloque le scroll page
+      // ne pas stopPropagation: PlayCanvas doit recevoir les touches
+    }
+  };
+  window.addEventListener('keydown', onKeyDownCapture, true);
 
-  progressDialog.style.display = "block";
+  // ⚠️ IMPORTANT : on ne bloque plus keydown/keyup sur le canvas lui-même.
+  // Ça évite de devoir “recliquer” pour retrouver le scroll.
+
+  progressDialog.style.display = 'block';
 
   if (!pc) {
     pc = await import("https://esm.run/playcanvas");
     window.pc = pc;
   }
 
-  // Create app
+  // Create app first
   const device = await pc.createGraphicsDevice(canvas, {
     deviceTypes: ["webgl2"],
     glslangUrl: "https://playcanvas.vercel.app/static/lib/glslang/glslang.js",
@@ -868,7 +214,7 @@ export async function initializeViewer(config, instanceId) {
   opts.graphicsDevice = device;
   opts.mouse = new pc.Mouse(canvas);
   opts.touch = new pc.TouchDevice(canvas);
-  // ⚠️ on ne crée PAS pc.Keyboard ici ; notre clavier est par-canvas dans le script
+  opts.keyboard = new pc.Keyboard(canvas);
   opts.componentSystems = [
     pc.RenderComponentSystem,
     pc.CameraComponentSystem,
@@ -889,41 +235,48 @@ export async function initializeViewer(config, instanceId) {
   app.setCanvasFillMode(pc.FILLMODE_NONE);
   app.setCanvasResolution(pc.RESOLUTION_AUTO);
 
-  resizeObserver = new ResizeObserver((entries) => {
-    entries.forEach((entry) => {
+  resizeObserver = new ResizeObserver(entries => {
+    entries.forEach(entry => {
       app.resizeCanvas(entry.contentRect.width, entry.contentRect.height);
     });
   });
   resizeObserver.observe(viewerContainer);
 
-  window.addEventListener("resize", () =>
-    app.resizeCanvas(viewerContainer.clientWidth, viewerContainer.clientHeight)
-  );
+  window.addEventListener('resize', () => app.resizeCanvas(viewerContainer.clientWidth, viewerContainer.clientHeight));
 
-  app.on("destroy", () => {
+  // Nettoyage complet à la destruction
+  app.on('destroy', () => {
     resizeObserver.disconnect();
-    canvas.removeEventListener('pointerenter', focusCanvas);
-    canvas.removeEventListener('pointerleave', () => canvas.blur());
+    if (opts.keyboard && opts.keyboard.detach) opts.keyboard.detach();
+
+    window.removeEventListener('keydown', onKeyDownCapture, true);
+
+    canvas.removeEventListener('pointerenter', onPointerEnter);
+    canvas.removeEventListener('pointerleave', onPointerLeave);
+    canvas.removeEventListener('mouseenter', onPointerEnter);
+    canvas.removeEventListener('mouseleave', onPointerLeave);
+    canvas.removeEventListener('mousedown', focusCanvas);
+    canvas.removeEventListener('touchstart', focusCanvas);
+    canvas.removeEventListener('blur', onCanvasBlur);
   });
 
-  // Assets (sans orbit-camera.js)
+  // Assets after app exists
   const assets = {
-    sogs: new pc.Asset("gsplat", "gsplat", { url: sogsUrl }),
-    glb: new pc.Asset("glb", "container", { url: glbUrl }),
-    presentoir: new pc.Asset("presentoir", "container", { url: presentoirUrl })
+    sogs: new pc.Asset('gsplat', 'gsplat', { url: sogsUrl }),
+    orbit: new pc.Asset('script', 'script', { url: "https://mikafil-viewer-sgos.static.hf.space/orbit-camera.js" }),
+    glb: new pc.Asset('glb', 'container', { url: glbUrl }),
+    presentoir: new pc.Asset('presentoir', 'container', { url: presentoirUrl }),
   };
+
   for (const key in assets) app.assets.add(assets[key]);
 
   const loader = new pc.AssetListLoader(Object.values(assets), app.assets);
-  loader.load(async () => {
-    // Enregistre les scripts d’orbite pour CETTE instance
-    const ScriptNames = registerOrbitScriptsForInstance(instanceId);
-
+  loader.load(() => {
     app.start();
-    progressDialog.style.display = "none";
+    progressDialog.style.display = 'none';
 
-    modelEntity = new pc.Entity("model");
-    modelEntity.addComponent("gsplat", { asset: assets.sogs });
+    modelEntity = new pc.Entity('model');
+    modelEntity.addComponent('gsplat', { asset: assets.sogs });
     modelEntity.setLocalPosition(modelX, modelY, modelZ);
     modelEntity.setLocalEulerAngles(modelRotationX, modelRotationY, modelRotationZ);
     modelEntity.setLocalScale(modelScale, modelScale, modelScale);
@@ -944,28 +297,34 @@ export async function initializeViewer(config, instanceId) {
       matSol.useLighting = false;
       matSol.update();
 
-      traverse(presentoirEntity, (node) => {
+      traverse(presentoirEntity, node => {
         if (node.render && node.render.meshInstances) {
-          for (let mi of node.render.meshInstances) mi.material = matSol;
+          for (let mi of node.render.meshInstances) {
+            mi.material = matSol;
+          }
         }
       });
-      traverse(glbEntity, (node) => {
+
+      traverse(glbEntity, node => {
         if (node.render && node.render.meshInstances) {
-          for (let mi of node.render.meshInstances) mi.material = matSol;
+          for (let mi of node.render.meshInstances) {
+            mi.material = matSol;
+          }
         }
       });
     }
 
-    cameraEntity = new pc.Entity("camera");
-    cameraEntity.addComponent("camera", {
-      clearColor: new pc.Color(color_bg),
-      nearClip: 0.001,
-      farClip: 100
-    });
+    cameraEntity = new pc.Entity('camera');
+    cameraEntity.addComponent('camera',
+      {
+        clearColor: new pc.Color(color_bg),
+        nearClip: 0.001,
+        farClip: 100
+      });
     cameraEntity.setPosition(chosenCameraX, chosenCameraY, chosenCameraZ);
     cameraEntity.lookAt(modelEntity.getPosition());
-    cameraEntity.addComponent("script");
-    cameraEntity.script.create(ScriptNames.ORBIT, {
+    cameraEntity.addComponent('script');
+    cameraEntity.script.create('orbitCamera', {
       attributes: {
         focusEntity: modelEntity,
         inertiaFactor: 0.2,
@@ -979,36 +338,36 @@ export async function initializeViewer(config, instanceId) {
         frameOnStart: false
       }
     });
-    cameraEntity.script.create(ScriptNames.MOUSE);
-    cameraEntity.script.create(ScriptNames.TOUCH);
-    cameraEntity.script.create(ScriptNames.KEYBD, {
+    cameraEntity.script.create('orbitCameraInputMouse');
+    cameraEntity.script.create('orbitCameraInputTouch');
+    cameraEntity.script.create('orbitCameraInputKeyboard', {
       attributes: {
-        forwardSpeed: 1.2,
-        strafeSpeed: 1.2
+        forwardSpeed: 1.2, // vertical (relatif à la distance)
+        strafeSpeed: 1.2   // gauche/droite (relatif à la distance)
       }
     });
     app.root.addChild(cameraEntity);
 
     app.resizeCanvas(viewerContainer.clientWidth, viewerContainer.clientHeight);
-    app.once("update", () => resetViewerCamera());
+    app.once('update', () => resetViewerCamera());
 
-    // Tooltips
+    // Tooltips supported if tooltips_url set
     try {
       if (config.tooltips_url) {
-        import("./tooltips.js")
-          .then((tooltipsModule) => {
-            tooltipsModule.initializeTooltips({
-              app,
-              cameraEntity,
-              modelEntity,
-              tooltipsUrl: config.tooltips_url,
-              defaultVisible: !!config.showTooltipsDefault,
-              moveDuration: config.tooltipMoveDuration || 0.6
-            });
-          })
-          .catch(() => {});
+        import('./tooltips.js').then(tooltipsModule => {
+          tooltipsModule.initializeTooltips({
+            app,
+            cameraEntity,
+            modelEntity,
+            tooltipsUrl: config.tooltips_url,
+            defaultVisible: !!config.showTooltipsDefault,
+            moveDuration: config.tooltipMoveDuration || 0.6
+          });
+        }).catch(() => { /* optional */ });
       }
-    } catch (e) {}
+    } catch (e) {
+      // optional
+    }
 
     viewerInitialized = true;
   });
@@ -1017,22 +376,20 @@ export async function initializeViewer(config, instanceId) {
 export function resetViewerCamera() {
   try {
     if (!cameraEntity || !modelEntity || !app) return;
-    // le nom du script d’orbite dépend de l’instance ; on le retrouve automatiquement
-    const orbitKey = Object.keys(cameraEntity.script._scriptsIndex).find(k => k.startsWith('orbitCamera_'));
-    if (!orbitKey) return;
-    const orbitCam = cameraEntity.script[orbitKey];
+    const orbitCam = cameraEntity.script.orbitCamera;
     if (!orbitCam) return;
 
     const modelPos = modelEntity.getPosition();
     const tempEnt = new pc.Entity();
-    tempEnt.setPosition(cameraEntity.getPosition());
+    tempEnt.setPosition(chosenCameraX, chosenCameraY, chosenCameraZ);
     tempEnt.lookAt(modelPos);
 
-    const dist = new pc.Vec3()
-      .sub2(new pc.Vec3(cameraEntity.getPosition().x, cameraEntity.getPosition().y, cameraEntity.getPosition().z), modelPos)
-      .length();
+    const dist = new pc.Vec3().sub2(
+      new pc.Vec3(chosenCameraX, chosenCameraY, chosenCameraZ),
+      modelPos
+    ).length();
 
-    cameraEntity.setPosition(cameraEntity.getPosition());
+    cameraEntity.setPosition(chosenCameraX, chosenCameraY, chosenCameraZ);
     cameraEntity.lookAt(modelPos);
 
     orbitCam.pivotPoint = modelPos.clone();