Update viewer_ar_ios.js

viewer_ar_ios.js

@@ -1,55 +1,26 @@
 /* viewer_ar_ios.js — AR PlayCanvas + GLB/USDZ via config.json
    - Lit config.json (data-config) => { "glb_url": "...", "usdz_url": "..." }
    - iOS : AR Quick Look (USDZ) avec #allowsContentScaling=0 (pas de zoom)
-   - Android/Desktop : WebXR AR (plans HORIZONTAUX uniquement) + slider yaw + blob shadow
+   - Android/Desktop : WebXR AR (horizontaux uniquement) + slider yaw + blob shadow
    - Éclairage PBR par défaut (sans WebXR light estimation)
-   - Bouton "Lancer l’AR" (Android & iOS)
-   - CSS EXTERNE via data-css, **attendue avant création de l’UI**
-   - Montable dans un conteneur dédié via data-mount et data-height (Squarespace-friendly)
+   - Monté dans un conteneur choisi (data-mount="#ar-mount") pour Squarespace
 */
 
 (function () {
-  // ========== Helpers: script courant / CSS / plate-forme / config ==========
+  // ============ Utils: script tag / config / platform ============
   function getCurrentScript() {
+    // robuste même si currentScript n'est pas dispo
     return document.currentScript || (function () {
       var scripts = document.getElementsByTagName('script');
       return scripts[scripts.length - 1] || null;
     })();
   }
 
-  // Injecte <link rel="stylesheet"> et **attend** son chargement
-  function ensureCssLinkAsync(href) {
-    return new Promise(function (resolve) {
-      if (!href) return resolve();
-
-      // Déjà injectée ?
-      var links = document.querySelectorAll('link[rel="stylesheet"]');
-      for (var i = 0; i < links.length; i++) {
-        try {
-          if (new URL(links[i].href, document.baseURI).href === new URL(href, document.baseURI).href) {
-            // Déjà présente : on considère chargée
-            return resolve();
-          }
-        } catch (_) {
-          if (links[i].href === href) return resolve();
-        }
-      }
-
-      var linkEl = document.createElement('link');
-      linkEl.rel = 'stylesheet';
-      linkEl.href = href;
-      linkEl.onload = function () { resolve(); };
-      linkEl.onerror = function () {
-        console.warn('[viewer_ar_ios] CSS failed to load:', href);
-        resolve(); // on continue quand même (pas de blocage)
-      };
-      document.head.appendChild(linkEl);
-    });
-  }
-
   function findConfigUrl() {
     var el = getCurrentScript();
-    return el ? (el.getAttribute('data-config') || null) : null;
+    if (!el) return null;
+    var url = el.getAttribute('data-config');
+    return url || null;
   }
 
   function isIOS() {
@@ -67,14 +38,15 @@
     try {
       var resp = await fetch(url, { cache: 'no-store' });
       if (!resp.ok) throw new Error("HTTP " + resp.status);
-      return await resp.json();
+      var json = await resp.json();
+      return json;
     } catch (e) {
       console.error("Erreur chargement config.json:", e);
       return null;
     }
   }
 
-  // ========== PlayCanvas (Android/Desktop) ==========
+  // ============ PlayCanvas version fixée (Android/Desktop) ============
   var PC_VERSION = "2.11.7";
   var PC_URLS = {
     esm: ["https://cdn.jsdelivr.net/npm/playcanvas@" + PC_VERSION + "/build/playcanvas.min.mjs"],
@@ -94,7 +66,10 @@
         try {
           var mod = await Promise.race([import(/* @vite-ignore */ url), timeout(loadTimeoutMs)]);
           var ns = (mod && (mod.pc || mod["default"])) || mod;
-          if (ns && ns.Application) { if (!window.pc) window.pc = ns; return window.pc; }
+          if (ns && ns.Application) {
+            if (!window.pc) window.pc = ns;
+            return window.pc;
+          }
         } catch (e) { /* continue */ }
       }
       throw new Error("ESM failed");
@@ -130,22 +105,49 @@
     }
   }
 
-  // ========== Overlay / UI générique ==========
+  // ============ UI / Overlay commun ============
+  var css = [
+    ".pc-ar-msg{position:fixed;left:50%;transform:translateX(-50%);bottom:16px;z-index:10002;padding:10px 14px;background:rgba(0,0,0,.65);color:#fff;border-radius:12px;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:14px;line-height:1.3;text-align:center;max-width:min(90vw,640px);box-shadow:0 6px 20px rgba(0,0,0,.25);backdrop-filter:blur(4px);pointer-events:none}",
+    "#xr-overlay-root{position:fixed;inset:0;z-index:10001;pointer-events:none}",
+
+    ".ar-ui{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:rgba(0,0,0,0.55);color:#fff;padding:12px 10px;border-radius:16px;width:56px;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;pointer-events:auto;display:flex;flex-direction:column;align-items:center;gap:8px;box-shadow:0 6px 18px rgba(0,0,0,.25);backdrop-filter:blur(6px);touch-action:none}",
+    ".ar-ui .label{font-size:12px;text-align:center;opacity:.95}",
+    ".rotY-wrap{position:relative;width:48px;height:200px;display:flex;align-items:center;justify-content:center;touch-action:none;overflow:visible;pointer-events:auto}",
+    ".rotY-rail{position:absolute;left:50%;transform:translateX(-50%);width:4px;height:100%;background:rgba(255,255,255,.35);border-radius:2px;pointer-events:none}",
+    ".rotY-knob{position:absolute;left:50%;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.35);transform:translate(-50%,-50%);top:50%;will-change:top;touch-action:none;pointer-events:none}",
+    ".ar-ui input[type=\"range\"].rotY{position:absolute;opacity:0;pointer-events:none;width:0;height:0}",
+    ".ar-ui .val{font-size:12px;opacity:.95}",
+
+    /* iOS Quick Look button */
+    "#ios-quicklook-btn{position:fixed;left:50%;transform:translateX(-50%);bottom:16px;z-index:10003;display:inline-block;pointer-events:auto}",
+    "#ios-quicklook-btn img{display:block;height:44px;width:auto}"
+  ].join("\n");
+  var styleTag = document.createElement("style");
+  styleTag.textContent = css;
+  document.head.appendChild(styleTag);
+
   function ensureOverlayRoot() {
     var r = document.getElementById("xr-overlay-root");
-    if (!r) { r = document.createElement("div"); r.id = "xr-overlay-root"; document.body.appendChild(r); }
+    if (!r) {
+      r = document.createElement("div");
+      r.id = "xr-overlay-root";
+      document.body.appendChild(r);
+    }
     return r;
   }
-  var overlayRoot = null;
+  var overlayRoot = ensureOverlayRoot();
 
   function message(msg) {
-    if (!overlayRoot) overlayRoot = ensureOverlayRoot();
     var el = overlayRoot.querySelector(".pc-ar-msg");
-    if (!el) { el = document.createElement("div"); el.className = "pc-ar-msg"; overlayRoot.appendChild(el); }
+    if (!el) {
+      el = document.createElement("div");
+      el.className = "pc-ar-msg";
+      overlayRoot.appendChild(el);
+    }
     el.textContent = msg;
   }
 
-  // iOS Quick Look URL (empêcher le zoom utilisateur)
+  // iOS Quick Look URL (empêche le pinch to scale)
   function buildQuickLookHref(usdzUrl) {
     try {
       var u = new URL(usdzUrl, window.location.href);
@@ -159,41 +161,76 @@
     }
   }
 
-  // Canvas monté dans un conteneur choisi (Squarespace-friendly)
+  function ensureQuickLookButton(USDZ_URL) {
+    var btn = document.getElementById("ios-quicklook-btn");
+    if (btn) return btn;
+
+    var anchor = document.createElement("a");
+    anchor.id = "ios-quicklook-btn";
+    anchor.setAttribute("rel", "ar");
+    anchor.setAttribute("href", buildQuickLookHref(USDZ_URL));
+
+    var img = document.createElement("img");
+    img.alt = "Voir en AR";
+    img.src =
+      "data:image/svg+xml;charset=utf-8," +
+      encodeURIComponent('<svg xmlns="http://www.w3.org/2000/svg" width="160" height="44"><rect rx="8" ry="8" width="160" height="44" fill="black"/><text x="80" y="28" font-size="14" text-anchor="middle" fill="white" font-family="system-ui, -apple-system, Segoe UI, Roboto">Voir en AR</text></svg>');
+
+    anchor.appendChild(img);
+    document.body.appendChild(anchor);
+    return anchor;
+  }
+
+  // ============ Canvas monté dans un conteneur contrôlé (Squarespace) ============
   function ensureCanvas() {
     var scriptEl = getCurrentScript();
     var mountSel = scriptEl && scriptEl.getAttribute('data-mount');
     var desiredHeight = (scriptEl && scriptEl.getAttribute('data-height')) || '70vh';
 
+    // Trouve le conteneur cible
     var mountEl = null;
     if (mountSel) mountEl = document.querySelector(mountSel);
     if (!mountEl) {
+      // fallback : tout en haut du body (pour éviter "sous le footer")
       mountEl = document.createElement('div');
       mountEl.id = 'ar-mount-fallback';
       document.body.insertBefore(mountEl, document.body.firstChild);
     }
 
-    var ms = mountEl.style;
-    if (!ms.position) ms.position = 'relative';
-    ms.width = ms.width || '100%';
-    ms.minHeight = ms.minHeight || desiredHeight;
-    ms.touchAction = ms.touchAction || 'manipulation';
-    ms.webkitTapHighlightColor = 'transparent';
+    // Style du conteneur
+    var mountStyle = mountEl.style;
+    if (!mountStyle.position) mountStyle.position = 'relative';
+    mountStyle.width = mountStyle.width || '100%';
+    mountStyle.minHeight = mountStyle.minHeight || desiredHeight;
+    mountStyle.touchAction = mountStyle.touchAction || 'manipulation';
+    mountStyle.webkitTapHighlightColor = 'transparent';
 
+    // Réutilise ou crée le canvas
     var canvas = mountEl.querySelector('#application-canvas');
-    if (!canvas) { canvas = document.createElement('canvas'); canvas.id = 'application-canvas'; mountEl.appendChild(canvas); }
+    if (!canvas) {
+      canvas = document.createElement('canvas');
+      canvas.id = 'application-canvas';
+      mountEl.appendChild(canvas);
+    }
 
+    // Le canvas remplit le conteneur
     var cs = canvas.style;
-    cs.position = 'absolute'; cs.left = '0'; cs.top = '0';
-    cs.width = '100%'; cs.height = '100%'; cs.display = 'block';
-
-    try { mountEl.scrollIntoView({ behavior: 'instant', block: 'start' }); } catch (_) {}
+    cs.position = 'absolute';
+    cs.left = '0';
+    cs.top = '0';
+    cs.width = '100%';
+    cs.height = '100%';
+    cs.display = 'block';
+
+    // Optionnel : ramener le viewport sur le viewer
+    try {
+      mountEl.scrollIntoView({ behavior: 'instant', block: 'start' });
+    } catch (_) {}
 
     return canvas;
   }
 
   function ensureSliderUI() {
-    if (!overlayRoot) overlayRoot = ensureOverlayRoot();
     var p = overlayRoot.querySelector(".ar-ui");
     if (p) return p;
     p = document.createElement("div");
@@ -210,93 +247,41 @@
     return p;
   }
 
-  // Bouton "Lancer l’AR" + (iOS) ancre rel=ar
-  function ensureLaunchControls(USDZ_URL) {
-    var btn = document.getElementById('ar-launch-btn');
-    if (!btn) {
-      btn = document.createElement('button');
-      btn.id = 'ar-launch-btn';
-      btn.type = 'button';
-      btn.textContent = 'Lancer l’AR';
-      btn.addEventListener('pointerdown', function (e) { e.stopPropagation(); }, { passive: true });
-      btn.addEventListener('click', function (e) { e.stopPropagation(); }, false);
-      document.body.appendChild(btn);
-    }
-
-    var anchor = document.getElementById('ios-quicklook-anchor');
-    if (isIOS()) {
-      if (!anchor) {
-        anchor = document.createElement('a');
-        anchor.id = 'ios-quicklook-anchor';
-        anchor.setAttribute('rel', 'ar');
-        document.body.appendChild(anchor);
-      }
-      if (USDZ_URL) anchor.setAttribute('href', buildQuickLookHref(USDZ_URL));
-    }
-    return { btn: btn, anchor: anchor || null };
-  }
-
-  // ========== Boot : charger **CSS**, puis config, puis brancher iOS/Android ==========
+  // ============ Boot : charge config, route iOS vs Android/Desktop ============
   (async function () {
-    var scriptEl = getCurrentScript();
-    var cssHref = (scriptEl && scriptEl.getAttribute('data-css'))
-      || "https://huggingface.co/spaces/MikaFil/VR/resolve/main/css/style.css";
-
-    // 1) Charger la CSS et ATTENDRE le onload avant toute création d'UI
-    await ensureCssLinkAsync(cssHref);
-
-    // 2) Lire config.json
     var cfgUrl = findConfigUrl();
     var cfg = await loadConfigJson(cfgUrl);
-    var GLB_URL = (cfg && typeof cfg.glb_url === "string" && cfg.glb_url)
-      ? cfg.glb_url
-      : "https://huggingface.co/datasets/MikaFil/viewer_gs/resolve/main/AR/tests/danae_no_metallic.glb";
-    var USDZ_URL = (cfg && typeof cfg.usdz_url === "string" && cfg.usdz_url) ? cfg.usdz_url : null;
+    var GLB_URL = (cfg && typeof cfg.glb_url === "string" && cfg.glb_url) ?
+                  cfg.glb_url :
+                  "https://huggingface.co/datasets/MikaFil/viewer_gs/resolve/main/AR/tests/danae_no_metallic.glb";
+    var USDZ_URL = (cfg && typeof cfg.usdz_url === "string" && cfg.usdz_url) ?
+                   cfg.usdz_url :
+                   null;
 
-    // 3) Construire les contrôles **après** CSS
-    var controls = ensureLaunchControls(USDZ_URL);
-    var launchBtn = controls.btn;
-    var iosAnchor = controls.anchor;
-
-    // 4) iOS → Quick Look (pas de WebXR)
     if (isIOS()) {
       if (USDZ_URL) {
-        message("iOS détecté : appuyez sur « Lancer l’AR » pour ouvrir Quick Look.");
-        launchBtn.onclick = function (e) {
-          e.preventDefault(); e.stopPropagation();
-          if (iosAnchor && iosAnchor.href) iosAnchor.click();
-        };
+        ensureQuickLookButton(USDZ_URL);
+        message("iOS détecté : utilisez le bouton « Voir en AR » (AR Quick Look).");
       } else {
         message("iOS détecté, mais aucun 'usdz_url' dans config.json.");
-        launchBtn.disabled = true; launchBtn.style.opacity = '0.5';
       }
       return;
     }
 
-    // 5) Android/Desktop → PlayCanvas
     try {
       await loadPlayCanvasRobust({ esmFirst: true, loadTimeoutMs: 15000 });
     } catch (e) {
       console.error("Chargement PlayCanvas échoué ->", e);
       message("Impossible de charger PlayCanvas (réseau/CDN). Réessaie plus tard.");
-      launchBtn.disabled = true; launchBtn.style.opacity = '0.5';
       return;
     }
-
-    var activateARRef = { fn: null };
-    initARApp(GLB_URL, activateARRef);
-
-    launchBtn.onclick = function (e) {
-      e.preventDefault(); e.stopPropagation();
-      if (typeof activateARRef.fn === 'function') activateARRef.fn();
-    };
+    initARApp(GLB_URL);
   })();
 
-  // ========== App WebXR (Android/Desktop) ==========
-  function initARApp(GLB_URL, activateARRef) {
+  // ============ App Android/Desktop (WebXR) ============
+  function initARApp(GLB_URL) {
     var pc = window.pc;
     var canvas = ensureCanvas();
-    overlayRoot = ensureOverlayRoot();
     var ui = ensureSliderUI();
     var rotWrap = ui.querySelector("#ar-rotY-wrap");
     var rotKnob = ui.querySelector("#ar-rotY-knob");
@@ -320,13 +305,13 @@
     app.on("destroy", function () { window.removeEventListener("resize", onResize); });
     app.start();
 
-    // Rendu / PBR
+    // Rendu / PBR defaults
     app.scene.gammaCorrection = pc.GAMMA_SRGB;
     app.scene.toneMapping = pc.TONEMAP_ACES;
     app.scene.exposure = 1;
     app.scene.ambientLight = new pc.Color(1, 1, 1);
 
-    // Caméra + lumière directionnelle
+    // Camera + lumière
     var camera = new pc.Entity("Camera");
     camera.addComponent("camera", { clearColor: new pc.Color(0, 0, 0, 0), farClip: 10000 });
     app.root.addChild(camera);
@@ -342,6 +327,7 @@
     reticleMat.opacity = 0.85;
     reticleMat.blendType = pc.BLEND_NORMAL;
     reticleMat.update();
+
     var reticle = new pc.Entity("Reticle");
     reticle.addComponent("render", { type: "torus", material: reticleMat });
     reticle.setLocalScale(0.12, 0.005, 0.12);
@@ -385,6 +371,7 @@
 
     function createBlobShadowAt(pos, rot) {
       var tex = makeBlobTexture(app, 256);
+
       var blobMat = new pc.StandardMaterial();
       blobMat.diffuse = new pc.Color(0, 0, 0);
       blobMat.opacity = 1.0;
@@ -399,19 +386,22 @@
       var e = new pc.Entity("BlobShadow");
       e.addComponent("render", { type: "plane", castShadows: false, receiveShadows: false });
       e.render.material = blobMat;
+
       e.setPosition(pos.x, pos.y + BLOB_OFFSET_Y, pos.z);
       e.setRotation(rot);
       e.setLocalScale(BLOB_SIZE, 1, BLOB_SIZE);
+
       app.root.addChild(e);
       return e;
     }
 
-    // Euler de base
+    // Euler de base (évite inversions)
     var baseEulerX = 0, baseEulerZ = 0;
 
-    // Rotation via slider
+    // Rotation via slider (0..360, 360 en haut / 0 en bas)
     var rotationYDeg = 0;
     function clamp360(d) { return Math.max(0, Math.min(360, d)); }
+
     function updateKnobFromY(yDeg) {
       var t = 1 - (yDeg / 360);
       rotKnob.style.top = String(t * 100) + "%";
@@ -431,13 +421,14 @@
       if (rotLikePlane) blob.setRotation(rotLikePlane);
     }
 
-    // Chargement GLB
+    // Chargement GLB (depuis config.json)
     app.assets.loadFromUrl(GLB_URL, "container", function (err, asset) {
       if (err) { console.error(err); message("Échec du chargement du modèle GLB."); return; }
       var instance = asset.resource.instantiateRenderEntity({ castShadows: true, receiveShadows: false });
       modelRoot.addChild(instance);
       modelRoot.setLocalScale(1, 1, 1);
 
+      // Fix matériaux simples
       var renders = instance.findComponents('render');
       for (var ri = 0; ri < renders.length; ri++) {
         var r = renders[ri];
@@ -457,71 +448,87 @@
       baseEulerX = initE.x; baseEulerZ = initE.z;
 
       modelLoaded = true;
-      message("Modèle chargé. Appuyez sur « Lancer l’AR » pour démarrer.");
+      message("Modèle chargé. Touchez l’écran pour démarrer l’AR.");
     });
 
     if (!app.xr.supported) { message("WebXR n’est pas supporté sur cet appareil."); return; }
 
-    // Slider fiable
-    var uiInteracting = false, draggingWrap = false, activePointerId = null;
+    // Slider fiable (pointer events en capture)
+    var uiInteracting = false;
+    var draggingWrap = false;
+    var activePointerId = null;
+
     function insideWrap(target) { return rotWrap.contains(target); }
     function degFromPointer(e) {
       var rect = rotWrap.getBoundingClientRect();
       var y = (e.clientY != null) ? e.clientY : ((e.touches && e.touches[0] && e.touches[0].clientY) || 0);
-      var ratio = (y - rect.top) / rect.height; var t = Math.max(0, Math.min(1, ratio));
+      var ratio = (y - rect.top) / rect.height;
+      var t = Math.max(0, Math.min(1, ratio));
       return (1 - t) * 360;
     }
+
     function onPointerDownCapture(e) {
       if (!insideWrap(e.target)) return;
-      uiInteracting = true; draggingWrap = true;
+      uiInteracting = true;
+      draggingWrap = true;
       activePointerId = (e.pointerId != null) ? e.pointerId : 1;
-      if (rotWrap.setPointerCapture) { try { rotWrap.setPointerCapture(activePointerId); } catch (er) {} }
+      if (rotWrap.setPointerCapture) {
+        try { rotWrap.setPointerCapture(activePointerId); } catch (er) {}
+      }
       applyRotationY(degFromPointer(e));
-      e.preventDefault(); e.stopPropagation();
+      e.preventDefault();
+      e.stopPropagation();
     }
     function onPointerMoveCapture(e) {
       if (!draggingWrap || ((e.pointerId != null ? e.pointerId : 1) !== activePointerId)) return;
       applyRotationY(degFromPointer(e));
-      e.preventDefault(); e.stopPropagation();
+      e.preventDefault();
+      e.stopPropagation();
     }
     function endDrag(e) {
       if (!draggingWrap || ((e.pointerId != null ? e.pointerId : 1) !== activePointerId)) return;
-      draggingWrap = false; uiInteracting = false;
-      if (rotWrap.releasePointerCapture) { try { rotWrap.releasePointerCapture(activePointerId); } catch (er) {} }
+      draggingWrap = false;
+      uiInteracting = false;
+      if (rotWrap.releasePointerCapture) {
+        try { rotWrap.releasePointerCapture(activePointerId); } catch (er) {}
+      }
       activePointerId = null;
-      e.preventDefault(); e.stopPropagation();
+      e.preventDefault();
+      e.stopPropagation();
     }
+
     document.addEventListener("pointerdown", onPointerDownCapture, { capture: true, passive: false });
     document.addEventListener("pointermove", onPointerMoveCapture, { capture: true, passive: false });
     document.addEventListener("pointerup", endDrag, { capture: true, passive: false });
     document.addEventListener("pointercancel", endDrag, { capture: true, passive: false });
 
-    // Démarrage AR (exposé pour le bouton)
+    // --- Démarrage AR (Android/Desktop)
     function activateAR() {
       if (!app.xr.isAvailable(pc.XRTYPE_AR)) { message("AR immersive indisponible sur cet appareil."); return; }
       if (!app.xr.domOverlay) app.xr.domOverlay = {};
-      app.xr.domOverlay.root = document.getElementById("xr-overlay-root") || ensureOverlayRoot();
+      app.xr.domOverlay.root = document.getElementById("xr-overlay-root");
       camera.camera.startXr(pc.XRTYPE_AR, pc.XRSPACE_LOCALFLOOR, {
         requiredFeatures: ["hit-test", "dom-overlay"],
         domOverlay: { root: app.xr.domOverlay.root },
         callback: function (err) {
-          if (err) { console.error("Échec du démarrage AR :", err); message("Échec du démarrage AR : " + (err.message || err)); }
+          if (err) {
+            console.error("Échec du démarrage AR :", err);
+            message("Échec du démarrage AR : " + (err.message || err));
+          }
         }
       });
     }
-    if (activateARRef && typeof activateARRef === 'object') activateARRef.fn = activateAR;
-
-    // Tap écran (optionnel)
     app.mouse.on("mousedown", function () { if (!app.xr.active && !uiInteracting) activateAR(); });
     if (app.touch) {
       app.touch.on("touchend", function (evt) {
         if (!app.xr.active && !uiInteracting) activateAR();
-        evt.event.preventDefault(); evt.event.stopPropagation();
+        evt.event.preventDefault();
+        evt.event.stopPropagation();
       });
     }
     app.keyboard.on("keydown", function (evt) { if (evt.key === pc.KEY_ESCAPE && app.xr.active) app.xr.end(); });
 
-    // Hit-test HORIZONTAL
+    // Hit-test HORIZONTAL uniquement
     var TMP_IN = new pc.Vec3(0, 1, 0), TMP_OUT = new pc.Vec3();
     function isHorizontalUpFacing(rot, minDot) {
       minDot = (typeof minDot === "number") ? minDot : 0.75;
@@ -529,6 +536,7 @@
       return TMP_OUT.y >= minDot;
     }
 
+    // Hit Test global
     app.xr.hitTest.on("available", function () {
       app.xr.hitTest.start({
         entityTypes: [pc.XRTRACKABLE_POINT, pc.XRTRACKABLE_PLANE],
@@ -536,6 +544,7 @@
           if (err) { message("Le AR hit test n’a pas pu démarrer."); return; }
           hitSource.on("result", function (pos, rot) {
             if (!isHorizontalUpFacing(rot)) return;
+
             reticle.enabled = true;
             reticle.setPosition(pos);
             reticle.setRotation(rot);
@@ -544,9 +553,11 @@
               modelRoot.enabled = true;
               modelRoot.setPosition(pos);
 
+              // Ombre de contact
               blob = createBlobShadowAt(pos, rot);
 
-              var e = new pc.Vec3(); rot.getEulerAngles(e);
+              var e = new pc.Vec3();
+              rot.getEulerAngles(e);
               var y0 = ((e.y % 360) + 360) % 360;
               applyRotationY(y0);
 
@@ -559,7 +570,7 @@
       });
     });
 
-    // Déplacement XR
+    // Déplacement XR (drag) — ignoré si UI active
     var isDragging = false;
     app.xr.input.on("add", function (inputSource) {
       inputSource.on("selectstart", function () {
@@ -586,7 +597,7 @@
       inputSource.on("selectend", function () { isDragging = false; });
     });
 
-    // Desktop : rotation souris
+    // Desktop : rotation souris (ignore si UI)
     var rotateMode = false, lastMouseX = 0;
     var ROTATE_SENSITIVITY = 0.25;
     app.mouse.on("mousedown", function (e) {
@@ -594,7 +605,8 @@
       if (e.button === 0 && !e.shiftKey) {
         isDragging = true;
       } else if (e.button === 2 || (e.button === 0 && e.shiftKey)) {
-        rotateMode = true; lastMouseX = e.x;
+        rotateMode = true;
+        lastMouseX = e.x;
       }
     });
     app.mouse.on("mousemove", function (e) {
@@ -606,7 +618,8 @@
           updateBlobPositionUnder(p, null);
         }
       } else if (rotateMode && modelRoot.enabled) {
-        var dx = e.x - lastMouseX; lastMouseX = e.x;
+        var dx = e.x - lastMouseX;
+        lastMouseX = e.x;
         applyRotationY(rotationYDeg + dx * ROTATE_SENSITIVITY);
       }
     });
@@ -621,20 +634,13 @@
       applyRotationY(v);
     }, { passive: true });
 
-    // Événements AR
-    app.xr.on("start", function () {
-      message("Session AR démarrée. Visez le sol pour détecter un plan…");
-      reticle.enabled = true;
-    });
-    app.xr.on("end", function () {
-      message("Session AR terminée.");
-      reticle.enabled = false;
-      isDragging = false; rotateMode = false; rotYInput.disabled = true;
-    });
+    // AR events
+    app.xr.on("start", function () { message("Session AR démarrée. Visez le sol pour détecter un plan…"); reticle.enabled = true; });
+    app.xr.on("end", function () { message("Session AR terminée."); reticle.enabled = false; isDragging = false; rotateMode = false; rotYInput.disabled = true; });
     app.xr.on("available:" + pc.XRTYPE_AR, function (a) {
       if (!a) message("AR immersive indisponible.");
       else if (!app.xr.hitTest.supported) message("AR Hit Test non supporté.");
-      else message(modelLoaded ? "Touchez l’écran ou « Lancer l’AR »." : "Chargement du modèle…");
+      else message(modelLoaded ? "Touchez l’écran pour démarrer l’AR." : "Chargement du modèle…");
     });
 
     if (!app.xr.isAvailable(pc.XRTYPE_AR)) message("AR immersive indisponible.");