Update viewer.js

viewer.js

@@ -55,26 +55,703 @@ function traverse(entity, callback) {
   }
 }
 
-// Charger orbit-camera.js **par application**
-const ORBIT_URL = "https://mikafil-viewer-sgos.static.hf.space/orbit-camera.js";
-function loadOrbitScriptsForApp(app, instanceId) {
-  return new Promise((resolve, reject) => {
-    // Si déjà enregistré dans CETTE app, ne rien faire
-    try {
-      if (app?.scripts?.get && app.scripts.get("orbitCamera")) return resolve();
-    } catch (_) {}
-
-    const asset = new pc.Asset("orbit-" + instanceId, "script", { url: ORBIT_URL });
-    app.assets.add(asset);
-    asset.once("load", () => resolve());
-    asset.once("error", (e) => {
-      console.error("[viewer.js] orbit-camera.js load error:", e);
-      reject(e);
-    });
-    app.assets.load(asset);
+// ---------- 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 };
 }
 
+// ---------------------------------------------------------------------------
+
 let pc;
 export let app = null;
 let cameraEntity = null;
@@ -98,59 +775,40 @@ export async function initializeViewer(config, instanceId) {
   const isIOS = /iPad|iPhone|iPod/.test(navigator.userAgent);
   const isMobile = isIOS || /Android/i.test(navigator.userAgent);
 
-  // Config
+  // Params
   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";
+  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";
   minZoom = parseFloat(config.minZoom || "1");
   maxZoom = parseFloat(config.maxZoom || "20");
   minAngle = parseFloat(config.minAngle || "-45");
   maxAngle = parseFloat(config.maxAngle || "90");
-  minAzimuth =
-    config.minAzimuth !== undefined ? parseFloat(config.minAzimuth) : -360;
-  maxAzimuth =
-    config.maxAzimuth !== undefined ? parseFloat(config.maxAzimuth) : 360;
+  minAzimuth = (config.minAzimuth !== undefined) ? parseFloat(config.minAzimuth) : -360;
+  maxAzimuth = (config.maxAzimuth !== undefined) ? parseFloat(config.maxAzimuth) : 360;
   minPivotY = parseFloat(config.minPivotY || "0");
-  minY = config.minY !== undefined ? parseFloat(config.minY) : 0;
-
-  modelX = config.modelX !== undefined ? parseFloat(config.modelX) : 0;
-  modelY = config.modelY !== undefined ? parseFloat(config.modelY) : 0;
-  modelZ = config.modelZ !== undefined ? parseFloat(config.modelZ) : 0;
-  modelScale = config.modelScale !== undefined ? parseFloat(config.modelScale) : 1;
-  modelRotationX =
-    config.modelRotationX !== undefined ? parseFloat(config.modelRotationX) : 0;
-  modelRotationY =
-    config.modelRotationY !== undefined ? parseFloat(config.modelRotationY) : 0;
-  modelRotationZ =
-    config.modelRotationZ !== undefined ? parseFloat(config.modelRotationZ) : 0;
-
-  presentoirScaleX =
-    config.presentoirScaleX !== undefined ? parseFloat(config.presentoirScaleX) : 0;
-  presentoirScaleY =
-    config.presentoirScaleY !== undefined ? parseFloat(config.presentoirScaleY) : 0;
-  presentoirScaleZ =
-    config.presentoirScaleZ !== undefined ? parseFloat(config.presentoirScaleZ) : 0;
-
-  const cameraX = config.cameraX !== undefined ? parseFloat(config.cameraX) : 0;
-  const cameraY = config.cameraY !== undefined ? parseFloat(config.cameraY) : 2;
-  const cameraZ = config.cameraZ !== undefined ? parseFloat(config.cameraZ) : 5;
-  const cameraXPhone =
-    config.cameraXPhone !== undefined ? parseFloat(config.cameraXPhone) : cameraX;
-  const cameraYPhone =
-    config.cameraYPhone !== undefined ? parseFloat(config.cameraYPhone) : cameraY;
-  const cameraZPhone =
-    config.cameraZPhone !== undefined ? parseFloat(config.cameraZPhone) : cameraZ * 1.5;
-
-  color_bg_hex =
-    config.canvas_background !== undefined ? config.canvas_background : "#FFFFFF";
-  espace_expo_bool =
-    config.espace_expo_bool !== undefined ? config.espace_expo_bool : false;
+  minY = (config.minY !== undefined) ? parseFloat(config.minY) : 0;
+
+  modelX = (config.modelX !== undefined) ? parseFloat(config.modelX) : 0;
+  modelY = (config.modelY !== undefined) ? parseFloat(config.modelY) : 0;
+  modelZ = (config.modelZ !== undefined) ? parseFloat(config.modelZ) : 0;
+  modelScale = (config.modelScale !== undefined) ? parseFloat(config.modelScale) : 1;
+  modelRotationX = (config.modelRotationX !== undefined) ? parseFloat(config.modelRotationX) : 0;
+  modelRotationY = (config.modelRotationY !== undefined) ? parseFloat(config.modelRotationY) : 0;
+  modelRotationZ = (config.modelRotationZ !== undefined) ? parseFloat(config.modelRotationZ) : 0;
+
+  presentoirScaleX = (config.presentoirScaleX !== undefined) ? parseFloat(config.presentoirScaleX) : 0;
+  presentoirScaleY = (config.presentoirScaleY !== undefined) ? parseFloat(config.presentoirScaleY) : 0;
+  presentoirScaleZ = (config.presentoirScaleZ !== undefined) ? parseFloat(config.presentoirScaleZ) : 0;
+
+  const cameraX = (config.cameraX !== undefined) ? parseFloat(config.cameraX) : 0;
+  const cameraY = (config.cameraY !== undefined) ? parseFloat(config.cameraY) : 2;
+  const cameraZ = (config.cameraZ !== undefined) ? parseFloat(config.cameraZ) : 5;
+  const cameraXPhone = (config.cameraXPhone !== undefined) ? parseFloat(config.cameraXPhone) : cameraX;
+  const cameraYPhone = (config.cameraYPhone !== undefined) ? parseFloat(config.cameraYPhone) : cameraY;
+  const cameraZPhone = (config.cameraZPhone !== undefined) ? parseFloat(config.cameraZPhone) : (cameraZ * 1.5);
+
+  color_bg_hex = (config.canvas_background !== undefined) ? config.canvas_background : "#FFFFFF";
+  espace_expo_bool = (config.espace_expo_bool !== undefined) ? config.espace_expo_bool : false;
   color_bg = hexToRgbaArray(color_bg_hex);
 
   chosenCameraX = isMobile ? cameraXPhone : cameraX;
@@ -160,6 +818,7 @@ export async function initializeViewer(config, instanceId) {
   // 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);
 
   let oldCanvas = document.getElementById(canvasId);
@@ -173,59 +832,21 @@ export async function initializeViewer(config, instanceId) {
   canvas.setAttribute("tabindex", "0");
   viewerContainer.insertBefore(canvas, progressDialog);
 
-  // Gestes / molette
   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("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;
-  const focusCanvas = () => canvas.focus({ preventScroll: true });
-
-  const onPointerEnter = () => { isPointerOverCanvas = true; focusCanvas(); };
-  const onPointerLeave = () => {
-    isPointerOverCanvas = false;
-    if (document.activeElement === canvas) canvas.blur();
-  };
-
-  canvas.addEventListener("pointerenter", onPointerEnter);
-  canvas.addEventListener("pointerleave", onPointerLeave);
-  canvas.addEventListener("mouseenter", onPointerEnter);
-  canvas.addEventListener("mouseleave", onPointerLeave);
-
-  canvas.addEventListener("mousedown", focusCanvas);
-  canvas.addEventListener("touchstart", () => { focusCanvas(); }, { passive: false });
-
-  canvas.addEventListener("blur", () => { isPointerOverCanvas = false; });
-
-  const onKeyDownCapture = (e) => {
-    if (!isPointerOverCanvas) return;
-    if (scrollKeys.has(e.key) || scrollKeys.has(e.code)) {
-      e.preventDefault();
-    }
-  };
-  window.addEventListener("keydown", onKeyDownCapture, true);
+  // 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());
 
   progressDialog.style.display = "block";
 
@@ -234,7 +855,7 @@ export async function initializeViewer(config, instanceId) {
     window.pc = pc;
   }
 
-  // App
+  // Create app
   const device = await pc.createGraphicsDevice(canvas, {
     deviceTypes: ["webgl2"],
     glslangUrl: "https://playcanvas.vercel.app/static/lib/glslang/glslang.js",
@@ -247,7 +868,7 @@ export async function initializeViewer(config, instanceId) {
   opts.graphicsDevice = device;
   opts.mouse = new pc.Mouse(canvas);
   opts.touch = new pc.TouchDevice(canvas);
-  //opts.keyboard = new pc.Keyboard(canvas); // clavier par canvas
+  // ⚠️ on ne crée PAS pc.Keyboard ici ; notre clavier est par-canvas dans le script
   opts.componentSystems = [
     pc.RenderComponentSystem,
     pc.CameraComponentSystem,
@@ -281,17 +902,11 @@ export async function initializeViewer(config, instanceId) {
 
   app.on("destroy", () => {
     resizeObserver.disconnect();
-    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('pointerenter', focusCanvas);
+    canvas.removeEventListener('pointerleave', () => canvas.blur());
   });
 
-  // Assets (sans orbit-camera ici)
+  // Assets (sans orbit-camera.js)
   const assets = {
     sogs: new pc.Asset("gsplat", "gsplat", { url: sogsUrl }),
     glb: new pc.Asset("glb", "container", { url: glbUrl }),
@@ -301,13 +916,12 @@ export async function initializeViewer(config, instanceId) {
 
   const loader = new pc.AssetListLoader(Object.values(assets), app.assets);
   loader.load(async () => {
-    // Charger et enregistrer orbit-camera.js pour CETTE app
-    await loadOrbitScriptsForApp(app, instanceId);
+    // Enregistre les scripts d’orbite pour CETTE instance
+    const ScriptNames = registerOrbitScriptsForInstance(instanceId);
 
     app.start();
     progressDialog.style.display = "none";
 
-    // Entités
     modelEntity = new pc.Entity("model");
     modelEntity.addComponent("gsplat", { asset: assets.sogs });
     modelEntity.setLocalPosition(modelX, modelY, modelZ);
@@ -342,7 +956,6 @@ export async function initializeViewer(config, instanceId) {
       });
     }
 
-    // Caméra + scripts orbit
     cameraEntity = new pc.Entity("camera");
     cameraEntity.addComponent("camera", {
       clearColor: new pc.Color(color_bg),
@@ -352,7 +965,7 @@ export async function initializeViewer(config, instanceId) {
     cameraEntity.setPosition(chosenCameraX, chosenCameraY, chosenCameraZ);
     cameraEntity.lookAt(modelEntity.getPosition());
     cameraEntity.addComponent("script");
-    cameraEntity.script.create("orbitCamera", {
+    cameraEntity.script.create(ScriptNames.ORBIT, {
       attributes: {
         focusEntity: modelEntity,
         inertiaFactor: 0.2,
@@ -366,31 +979,36 @@ export async function initializeViewer(config, instanceId) {
         frameOnStart: false
       }
     });
-    cameraEntity.script.create("orbitCameraInputMouse");
-    cameraEntity.script.create("orbitCameraInputTouch");
-    cameraEntity.script.create("orbitCameraInputKeyboard", {
-      attributes: { forwardSpeed: 1.2, strafeSpeed: 1.2 }
+    cameraEntity.script.create(ScriptNames.MOUSE);
+    cameraEntity.script.create(ScriptNames.TOUCH);
+    cameraEntity.script.create(ScriptNames.KEYBD, {
+      attributes: {
+        forwardSpeed: 1.2,
+        strafeSpeed: 1.2
+      }
     });
     app.root.addChild(cameraEntity);
 
     app.resizeCanvas(viewerContainer.clientWidth, viewerContainer.clientHeight);
     app.once("update", () => resetViewerCamera());
 
-    // Tooltips (optionnel)
+    // Tooltips
     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(() => {});
       }
-    } catch (_) {}
+    } catch (e) {}
 
     viewerInitialized = true;
   });
@@ -399,19 +1017,22 @@ export async function initializeViewer(config, instanceId) {
 export function resetViewerCamera() {
   try {
     if (!cameraEntity || !modelEntity || !app) return;
-    const orbitCam = cameraEntity.script.orbitCamera;
+    // 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];
     if (!orbitCam) return;
 
     const modelPos = modelEntity.getPosition();
     const tempEnt = new pc.Entity();
-    tempEnt.setPosition(chosenCameraX, chosenCameraY, chosenCameraZ);
+    tempEnt.setPosition(cameraEntity.getPosition());
     tempEnt.lookAt(modelPos);
 
     const dist = new pc.Vec3()
-      .sub2(new pc.Vec3(chosenCameraX, chosenCameraY, chosenCameraZ), modelPos)
+      .sub2(new pc.Vec3(cameraEntity.getPosition().x, cameraEntity.getPosition().y, cameraEntity.getPosition().z), modelPos)
       .length();
 
-    cameraEntity.setPosition(chosenCameraX, chosenCameraY, chosenCameraZ);
+    cameraEntity.setPosition(cameraEntity.getPosition());
     cameraEntity.lookAt(modelPos);
 
     orbitCam.pivotPoint = modelPos.clone();