Update viewer_ar_ios.js

viewer_ar_ios.js

@@ -1,14 +1,15 @@
-/* viewer_ar_ios.js — AR PlayCanvas + GLB/USDZ via config.json (+ "sol" + mode mur : Z = normale, Y = haut)
+/* viewer_ar_ios.js — AR PlayCanvas + GLB/USDZ via config.json (+ "sol")
    - config.json : { "glb_url": "...", "usdz_url": "...", "sol": true|false }
-   - sol = true  → plans horizontaux (sol) + rotation autour de l’axe local Y (haut)
-   - sol = false → plans verticaux (mur) :
-       * Z local = normale du mur (perpendiculaire au plan)
-       * Y local = direction plafond (Up monde) projetée dans le plan
-       * rotation utilisateur = autour de Z local (normale)
-       * PENDANT une translation : orientation verrouillée (pas de twist parasite)
-       * À la fin d’une translation : réalignement base sur le NOUVEAU mur (Z=normale, Y→plafond)
-   - iOS : AR Quick Look (USDZ)
-   - Android/Desktop : WebXR AR + bouton "Lancer l’AR" + slider de rotation
+   - sol = true  → plans horizontaux (sol)
+       * Y local = Up monde
+       * rotation utilisateur = autour de Y local
+   - sol = false → plans verticaux (mur)
+       * Y local = normale du mur
+       * Z local = Up monde projeté dans le plan du mur
+       * rotation utilisateur = autour de Y local (normale)
+   - Translation : aucune rotation pendant le drag ; snap sur nouveau plan en fin de drag
+   - iOS : AR Quick Look (manuel)
+   - Android/Desktop : WebXR + PlayCanvas
 */
 
 (function () {
@@ -298,15 +299,9 @@
         ensureQuickLookButton(USDZ_URL);
 
         if (PLACE_ON_FLOOR) {
-          message(
-            "Modèle chargé. Appuyez sur « Lancer l’AR ». Dans la vue AR (Quick Look), " +
-            "placez l’objet sur le sol et ajustez sa position/orientation avec les gestes iOS."
-          );
+          message("Modèle chargé. Appuyez sur « Lancer l’AR ». Dans Quick Look, placez l’objet sur le sol et ajustez-le avec les gestes iOS.");
         } else {
-          message(
-            "Modèle chargé. Appuyez sur « Lancer l’AR ». Sur iOS (Quick Look), l’objet ne peut pas être " +
-            "aligné automatiquement au mur : placez-le et orientez-le manuellement (Y vers le plafond)."
-          );
+          message("Modèle chargé. Appuyez sur « Lancer l’AR ». Sur iOS (Quick Look), l’alignement automatique au mur n’est pas disponible ; placez et orientez l’objet manuellement (Y vers le plafond).");
         }
       } else {
         message("iOS détecté, mais aucun 'usdz_url' dans config.json.");
@@ -390,25 +385,14 @@
     app.root.addChild(modelRoot);
     var modelLoaded = false, placedOnce = false;
 
-    // --- Helpers vecteurs/quaternions stables ---
+    // --- Helpers vecteurs/quaternions ---
     var UP = new pc.Vec3(0, 1, 0);
+
     function projOnPlane(v, n) {
       var d = v.dot(n);
       return new pc.Vec3(v.x - d*n.x, v.y - d*n.y, v.z - d*n.z);
     }
-    function buildWallBasisFromNormalZ(Nz) {
-      // Z local = normale du mur
-      var Z = Nz.clone().normalize();
-      // Y local = Up projété dans le plan (toujours "vers le plafond" le long du mur)
-      var Y = projOnPlane(UP, Z);
-      if (Y.lengthSq() < 1e-8) Y = projOnPlane(new pc.Vec3(0,1,0), Z);
-      Y.normalize();
-      // X = Y × Z  (garantit base orthonormée et droite, avec X×Y = Z)
-      var X = new pc.Vec3(); X.cross(Y, Z).normalize();
-      // Re-orthonormalise Y = Z × X pour éliminer la dérive
-      Y.cross(Z, X).normalize();
-      return { X: X, Y: Y, Z: Z };
-    }
+
     function quatFromBasis(X, Y, Z) {
       // colonnes = X,Y,Z
       var m00 = X.x, m01 = Y.x, m02 = Z.x;
@@ -445,19 +429,43 @@
       q.normalize();
       return q;
     }
-    function computeWallBaseFromRot_ZNormal(rot) {
-      // WebXR/PlayCanvas : la normale du plan est l’axe Z de la pose
-      var Nz = new pc.Vec3();
-      rot.transformVector(new pc.Vec3(0, 0, 1), Nz); // Z monde de la pose
-      Nz.normalize();
-      var basis = buildWallBasisFromNormalZ(Nz);      // Z=normale, Y=Up projeté
-      return quatFromBasis(basis.X, basis.Y, basis.Z);
+
+    // --- Bases pour chaque mode ---
+    function computeFloorBase() {
+      // Y local = UP (0,1,0). On fabrique une base quelconque stable.
+      var Y = UP.clone();                // vertical
+      var Z = new pc.Vec3(0, 0, 1);      // avant “monde”
+      // Orthonormalise Z dans le plan horizontal
+      Z = projOnPlane(Z, Y); if (Z.lengthSq() < 1e-8) Z = new pc.Vec3(1,0,0);
+      Z.normalize();
+      var X = new pc.Vec3(); X.cross(Y, Z).normalize();
+      Z.cross(X, Y).normalize();
+      return quatFromBasis(X, Y, Z);
+    }
+
+    function computeWallBaseFromHit(rot) {
+      // Hypothèse PlayCanvas/WebXR : la normale du plan est l’axe Y de la pose.
+      // N = rot * (0,1,0)
+      var N = new pc.Vec3();
+      rot.transformVector(new pc.Vec3(0,1,0), N);
+      N.normalize();                      // Y local = N (normale du mur)
+
+      // Z local = Up projeté dans le plan (toujours “vers le plafond” dans le plan vertical)
+      var Z = projOnPlane(UP, N);
+      if (Z.lengthSq() < 1e-8) Z = new pc.Vec3(0,0,1);
+      Z.normalize();
+
+      // X = Y × Z ; re-orthonormalise
+      var X = new pc.Vec3(); X.cross(N, Z).normalize();
+      Z.cross(X, N).normalize();
+
+      return quatFromBasis(X, N /*Y*/, Z);
     }
 
     // Mode mur / sol
     var wallMode = !PLACE_ON_FLOOR;
-    var wallBaseRot = new pc.Quat(); // base (mur) : Z=normale, Y=up-projeté
-    var wallAngleDeg = 0;            // rotation utilisateur autour de Z local (normale)
+    var baseRot = new pc.Quat();     // base : définit les axes locaux comme voulu (voir ci-dessus)
+    var userYawDeg = 0;              // rotation utilisateur autour de Y local (toujours)
 
     // Ombre blob (sol uniquement)
     var blob = null;
@@ -514,9 +522,7 @@
       return e;
     }
 
-    // Rotation via slider (sol: Euler Y, mur: twist autour de Z local)
-    var baseEulerX = 0, baseEulerZ = 0;
-    var rotationYDeg = 0;
+    // Rotation via slider (toujours autour de Y local)
     function clamp360(d) { return Math.max(0, Math.min(360, d)); }
     function updateKnobFromY(yDeg) {
       var t = 1 - (yDeg / 360);
@@ -524,24 +530,16 @@
       rotInput.value = String(Math.round(yDeg));
       rotVal.textContent = String(Math.round(yDeg)) + "°";
     }
-    function getCurrentAngle() { return wallMode ? wallAngleDeg : rotationYDeg; }
 
-    function applyRotationY(deg) {
+    function applyYawAroundLocalY(deg) {
       var y = clamp360(deg);
+      userYawDeg = y;
       if (!modelRoot.enabled) { updateKnobFromY(y); return; }
-
-      if (!wallMode) {
-        rotationYDeg = y;
-        modelRoot.setEulerAngles(baseEulerX, y, baseEulerZ);
-      } else {
-        // mur : rotation autour de Z local
-        wallAngleDeg = y;
-        var qLocal = new pc.Quat();
-        qLocal.setFromAxisAngle(new pc.Vec3(0, 0, 1), y); // rotation locale autour de Z
-        var qFinal = new pc.Quat();
-        qFinal.mul2(wallBaseRot, qLocal);                 // base (Z=normale, Y=up projeté) puis twist utilisateur
-        modelRoot.setRotation(qFinal);
-      }
+      var qLocal = new pc.Quat();
+      qLocal.setFromAxisAngle(pc.Vec3.UP, y); // UP ici = axe Y LOCAL quand on post-multiplie
+      var qFinal = new pc.Quat();
+      qFinal.mul2(baseRot, qLocal);
+      modelRoot.setRotation(qFinal);
       updateKnobFromY(y);
     }
 
@@ -558,6 +556,7 @@
       modelRoot.addChild(instance);
       modelRoot.setLocalScale(1, 1, 1);
 
+      // matériaux safe
       var renders = instance.findComponents('render');
       for (var ri = 0; ri < renders.length; ri++) {
         var r = renders[ri];
@@ -573,30 +572,29 @@
         }
       }
 
-      var initE = modelRoot.getEulerAngles();
-      baseEulerX = initE.x; baseEulerZ = initE.z;
-
       modelLoaded = true;
       message("Modèle chargé. Appuyez sur « Lancer l’AR ».");
     });
 
     if (!app.xr.supported) { message("WebXR n’est pas supporté sur cet appareil."); return; }
 
-    // ----- Détection orientation des plans (utilise Z comme normale) -----
-    var TMP_Z = new pc.Vec3(0, 0, 1), TMP_OUT = new pc.Vec3();
+    // ----- Détection orientation des plans (pose Y = normale du plan) -----
+    var TMP_Y = new pc.Vec3(0, 1, 0), TMP_OUT = new pc.Vec3();
 
+    // Sol : normale (Y) ≈ +Up
     function isHorizontalUpFacing(rot, minDot) {
-      // sol : normale (Z) ≈ +Y
       minDot = (typeof minDot === "number") ? minDot : 0.75;
-      rot.transformVector(TMP_Z, TMP_OUT);
+      rot.transformVector(TMP_Y, TMP_OUT);
       return TMP_OUT.y >= minDot;
     }
+
+    // Mur : normale (Y) horizontale → |Y.y| petit
     function isVerticalFacing(rot, maxAbsY) {
-      // mur : normale (Z) quasi horizontale → |Z.y| petit
       maxAbsY = (typeof maxAbsY === "number") ? maxAbsY : 0.35;
-      rot.transformVector(TMP_Z, TMP_OUT);
+      rot.transformVector(TMP_Y, TMP_OUT);
       return Math.abs(TMP_OUT.y) <= maxAbsY;
     }
+
     function planeMatchesMode(rot) {
       return wallMode ? isVerticalFacing(rot) : isHorizontalUpFacing(rot);
     }
@@ -626,12 +624,12 @@
       draggingTrack = true;
       activePointerId = (e.pointerId != null) ? e.pointerId : 1;
       if (rotTrack.setPointerCapture) { try { rotTrack.setPointerCapture(activePointerId); } catch (er) {} }
-      applyRotationY(degFromPointer(e));
+      applyYawAroundLocalY(degFromPointer(e));
       e.preventDefault(); e.stopPropagation();
     }
     function onPointerMoveCapture(e) {
       if (!draggingTrack || ((e.pointerId != null ? e.pointerId : 1) !== activePointerId)) return;
-      applyRotationY(degFromPointer(e));
+      applyYawAroundLocalY(degFromPointer(e));
       e.preventDefault(); e.stopPropagation();
     }
     function endDrag(e) {
@@ -686,23 +684,23 @@
 
               if (!wallMode) {
                 // --- MODE SOL ---
+                baseRot.copy(computeFloorBase());
+                // angle initial : récupérer un yaw “monde” pour démarrer aligné (optionnel)
+                var e = new pc.Vec3(); rot.getEulerAngles(e);
+                applyYawAroundLocalY(((e.y % 360) + 360) % 360);
+                // Ombre au sol
                 blob = createBlobShadowAt(pos, rot);
-                var e = new pc.Vec3();
-                rot.getEulerAngles(e);
-                var y0 = ((e.y % 360) + 360) % 360;
-                applyRotationY(y0);
               } else {
                 // --- MODE MUR (première pose) ---
-                wallBaseRot.copy(computeWallBaseFromRot_ZNormal(rot)); // Z=normale, Y=up-projeté
-                modelRoot.setRotation(wallBaseRot);
-                applyRotationY(0); // angle initial = 0 (autour de Z)
+                baseRot.copy(computeWallBaseFromHit(rot)); // Y=normale, Z=Up projeté
+                applyYawAroundLocalY(0);                   // yaw utilisateur = 0 au départ
               }
 
               placedOnce = true;
               rotInput.disabled = false;
               message(
                 wallMode
-                  ? "Objet placé contre le mur (Z=normale, Y→plafond). Glissez pour déplacer, tournez avec le slider →"
+                  ? "Objet placé contre le mur (Y=normale, Z→plafond). Glissez pour déplacer, tournez avec le slider →"
                   : "Objet placé. Glissez pour déplacer, tournez-le avec le slider →"
               );
             }
@@ -712,16 +710,15 @@
     });
 
     // Drag XR continu (déplacements suivants, sans rotation parasite)
-    var isDragging = false;
-    var dragLockedRot = new pc.Quat();
-    var lastHitRot = new pc.Quat();
+    var rotateMode = false, lastMouseX = 0;
+    var ROTATE_SENSITIVITY = 0.25;
 
     app.xr.input.on("add", function (inputSource) {
       inputSource.on("selectstart", function () {
         if (uiInteracting) return;
         if (!placedOnce || !modelLoaded) return;
 
-        // Verrouille l'orientation courante pendant la translation
+        // Verrouille l'orientation pendant la translation
         dragLockedRot.copy(modelRoot.getRotation());
 
         inputSource.hitTestStart({
@@ -734,26 +731,22 @@
               if (!isDragging) return;
               if (!planeMatchesMode(rot)) return;
 
-              lastHitRot.copy(rot);        // garde trace du dernier mur rencontré
-              modelRoot.setPosition(pos);  // translate uniquement
+              lastHitRot.copy(rot);       // garde trace du dernier plan
+              modelRoot.setPosition(pos); // translate uniquement
+              modelRoot.setRotation(dragLockedRot); // aucune rotation pendant le drag
 
-              if (!wallMode) {
-                updateBlobPositionUnder(pos, rot);
-              } else {
-                modelRoot.setRotation(dragLockedRot); // aucune rotation pendant le drag
-              }
+              if (!wallMode) updateBlobPositionUnder(pos, rot);
             });
 
-            // Fin du drag : snap orientation sur le NOUVEAU mur, en conservant l'angle utilisateur
+            // Fin du drag : snap orientation sur NOUVEAU plan + ré-applique yaw local Y
             transientSource.once("remove", function () {
               isDragging = false;
               if (wallMode) {
-                wallBaseRot.copy(computeWallBaseFromRot_ZNormal(lastHitRot));
-                var qLocal = new pc.Quat();
-                qLocal.setFromAxisAngle(new pc.Vec3(0, 0, 1), wallAngleDeg); // rotation autour de Z local
-                var qFinal = new pc.Quat();
-                qFinal.mul2(wallBaseRot, qLocal);
-                modelRoot.setRotation(qFinal);
+                baseRot.copy(computeWallBaseFromHit(lastHitRot)); // recalcule Y/Z
+                applyYawAroundLocalY(userYawDeg);                 // conserve l'angle utilisateur autour de Y local
+              } else {
+                // sol : garder baseRot (Y=Up monde), ne rien changer d'orientation
+                modelRoot.setRotation(dragLockedRot);
               }
             });
           }
@@ -765,9 +758,7 @@
       });
     });
 
-    // Desktop : rotation à la souris (clic droit ou Shift+clic gauche)
-    var rotateMode = false, lastMouseX = 0;
-    var ROTATE_SENSITIVITY = 0.25;
+    // Desktop : rotation à la souris (Shift+drag gauche ou clic droit)
     app.mouse.on("mousedown", function (e) {
       if (!app.xr.active || !placedOnce || uiInteracting) return;
       if (e.button === 0 && !e.shiftKey) {
@@ -784,17 +775,16 @@
         if (reticle.enabled) {
           var p = reticle.getPosition();
           modelRoot.setPosition(p);
+          modelRoot.setRotation(dragLockedRot);
           if (!wallMode) updateBlobPositionUnder(p, null);
-          else modelRoot.setRotation(dragLockedRot);
         }
       } else if (rotateMode && modelRoot.enabled) {
         var dx = e.x - lastMouseX;
         lastMouseX = e.x;
-        applyRotationY(getCurrentAngle() + dx * ROTATE_SENSITIVITY);
+        applyYawAroundLocalY(userYawDeg + dx * ROTATE_SENSITIVITY);
       }
     });
     app.mouse.on("mouseup", function () {
-      // (optionnel) faire un snap sur desktop si tu déclenches un hit-test ici.
       isDragging = false;
       rotateMode = false;
     });
@@ -804,14 +794,14 @@
     rotInput.disabled = true;
     rotInput.addEventListener("input", function (e) {
       var v = parseFloat(e.target.value || "0");
-      applyRotationY(v);
+      applyYawAroundLocalY(v);
     }, { passive: true });
 
     // Événements AR
     app.xr.on("start", function () {
       if (startBtn) startBtn.style.display = "none";
       message(wallMode
-        ? "Session AR démarrée. Visez un mur (Z=normale, Y du modèle vers le plafond)…"
+        ? "Session AR démarrée. Visez un mur (Y=normale du mur, Z du modèle vers le plafond)…"
         : "Session AR démarrée. Visez le sol pour détecter un plan…");
       reticle.enabled = true;
     });