Update viewer_ar_ios.js

viewer_ar_ios.js

@@ -1,8 +1,7 @@
-<script>
 /* 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 (horizontaux uniquement) + slider yaw + blob shadow
+   - Android/Desktop : WebXR AR (plans HORIZONTAUX uniquement) + slider yaw + blob shadow
    - Éclairage PBR par défaut (sans WebXR light estimation)
    - Monté dans un conteneur choisi (data-mount="#ar-mount") pour Squarespace
 */
@@ -10,7 +9,7 @@
 (function () {
   // ============ Utils: script tag / config / platform ============
   function getCurrentScript() {
-    // robuste même si currentScript n'est pas dispo
+    // Robuste même si document.currentScript n'est pas dispo
     return document.currentScript || (function () {
       var scripts = document.getElementsByTagName('script');
       return scripts[scripts.length - 1] || null;
@@ -71,7 +70,7 @@
             if (!window.pc) window.pc = ns;
             return window.pc;
           }
-        } catch (e) { /* continue */ }
+        } catch (_e) { /* continue */ }
       }
       throw new Error("ESM failed");
     }
@@ -92,7 +91,7 @@
             timeout(loadTimeoutMs)
           ]);
           if (window.pc && window.pc.Application) return window.pc;
-        } catch (e) { /* continue */ }
+        } catch (_e) { /* continue */ }
       }
       throw new Error("UMD failed");
     }
@@ -100,15 +99,15 @@
     try {
       if (esmFirst) return await tryESM();
       return await tryUMD();
-    } catch (e) {
+    } catch (_e) {
       if (esmFirst) return await tryUMD();
       return await tryESM();
     }
   }
 
   // ============ UI / Overlay commun ============
-  // (On garde un style minimal intégré pour le message ; si tu utilises un CSS externe,
-  // tu peux déplacer ces règles dans ce fichier.)
+  // Style minimal intégré : toasts + variante centrée pour le message initial.
+  // (Si tu utilises un CSS externe, tu peux déplacer ces règles dans ce fichier.)
   var css = [
     /* Toast (bas) */
     ".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}",
@@ -145,7 +144,7 @@
   }
   var overlayRoot = ensureOverlayRoot();
 
-  // ------ Système de message : toast (bas) ou centré agrandi ------
+  // ------ Système de message : toast (bas) OU centré agrandi ------
   function getMessageEl() {
     var el = overlayRoot.querySelector(".pc-ar-msg");
     if (!el) {
@@ -175,7 +174,7 @@
       params.set('allowsContentScaling', '0');
       u.hash = params.toString();
       return u.toString();
-    } catch (e) {
+    } catch (_e) {
       return usdzUrl + (usdzUrl.indexOf('#') >= 0 ? '&' : '#') + 'allowsContentScaling=0';
     }
   }
@@ -244,7 +243,7 @@
     // Optionnel : ramener le viewport sur le viewer
     try {
       mountEl.scrollIntoView({ behavior: 'instant', block: 'start' });
-    } catch (_) {}
+    } catch (_e) {}
 
     return canvas;
   }
@@ -362,28 +361,29 @@
     modelRoot.enabled = false;
     app.root.addChild(modelRoot);
 
-    var modelLoaded = false, placedOnce = false;
+    var modelLoaded = false;
+    var placedOnce = false;
 
     // ===== Ombre de contact “blob” =====
     var blobShadowEntity = null;
     var BLOB_SIZE = 0.4;
     var BLOB_OFFSET_Y = 0.005;
 
-    function makeBlobTexture(app, size) {
-      size = size || 256;
+    function makeBlobTexture(appRef, size) {
+      var s = size || 256;
       var cvs = document.createElement('canvas');
-      cvs.width = cvs.height = size;
+      cvs.width = cvs.height = s;
       var ctx = cvs.getContext('2d');
-      var r = size * 0.45;
-      var grd = ctx.createRadialGradient(size/2, size/2, r*0.2, size/2, size/2, r);
+      var r = s * 0.45;
+      var grd = ctx.createRadialGradient(s / 2, s / 2, r * 0.2, s / 2, s / 2, r);
       grd.addColorStop(0, 'rgba(0,0,0,0.5)');
       grd.addColorStop(1, 'rgba(0,0,0,0.0)');
       ctx.fillStyle = grd;
-      ctx.fillRect(0, 0, size, size);
+      ctx.fillRect(0, 0, s, s);
 
-      var tex = new pc.Texture(app.graphicsDevice, {
-        width: size,
-        height: size,
+      var tex = new pc.Texture(appRef.graphicsDevice, {
+        width: s,
+        height: s,
         format: pc.PIXELFORMAT_R8_G8_B8_A8,
         mipmaps: true,
         magFilter: pc.FILTER_LINEAR,
@@ -420,7 +420,8 @@
     }
 
     // Euler de base (évite inversions)
-    var baseEulerX = 0, baseEulerZ = 0;
+    var baseEulerX = 0;
+    var baseEulerZ = 0;
 
     // Rotation via slider (0..360, 360 en haut / 0 en bas)
     var rotationYDeg = 0;
@@ -473,7 +474,7 @@
 
       modelLoaded = true;
 
-      // >>> ICI : message centré et plus grand <<<
+      // >>> Message centré & un peu plus grand pour l’invite initiale
       messageCenterBig("Modèle chargé. Touchez l’écran pour démarrer l’AR.");
     });
 
@@ -490,7 +491,7 @@
       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));
-      return (1 - t) * 360;
+      return (1 - t) * 360; // 360 en haut, 0 en bas
     }
 
     function onPointerDownCapture(e) {
@@ -499,7 +500,7 @@
       isTrackDragging = true;
       activePointerId = (e.pointerId != null) ? e.pointerId : 1;
       if (rotTrack.setPointerCapture) {
-        try { rotTrack.setPointerCapture(activePointerId); } catch (er) {}
+        try { rotTrack.setPointerCapture(activePointerId); } catch (_er) {}
       }
       applyRotationY(degFromPointer(e));
       e.preventDefault();
@@ -516,7 +517,7 @@
       isTrackDragging = false;
       isUIInteracting = false;
       if (rotTrack.releasePointerCapture) {
-        try { rotTrack.releasePointerCapture(activePointerId); } catch (er) {}
+        try { rotTrack.releasePointerCapture(activePointerId); } catch (_er) {}
       }
       activePointerId = null;
       e.preventDefault();
@@ -556,11 +557,12 @@
     app.keyboard.on("keydown", function (evt) { if (evt.key === pc.KEY_ESCAPE && app.xr.active) app.xr.end(); });
 
     // Hit-test HORIZONTAL uniquement
-    var TMP_IN = new pc.Vec3(0, 1, 0), TMP_OUT = new pc.Vec3();
+    var TMP_IN = new pc.Vec3(0, 1, 0);
+    var TMP_OUT = new pc.Vec3();
     function isHorizontalUpFacing(rot, minDot) {
-      minDot = (typeof minDot === "number") ? minDot : 0.75;
+      var md = (typeof minDot === "number") ? minDot : 0.75;
       rot.transformVector(TMP_IN, TMP_OUT);
-      return TMP_OUT.y >= minDot;
+      return TMP_OUT.y >= md; // normale proche de +Y
     }
 
     // Hit Test global
@@ -627,7 +629,8 @@
     });
 
     // Desktop : rotation souris (ignore si UI)
-    var isRotateMode = false, lastMouseX = 0;
+    var isRotateMode = false;
+    var lastMouseX = 0;
     var ROTATE_SENSITIVITY = 0.25;
     app.mouse.on("mousedown", function (e) {
       if (!app.xr.active || !placedOnce || isUIInteracting) return;
@@ -664,8 +667,17 @@
     }, { passive: true });
 
     // AR events
-    app.xr.on("start", function () { messageToast("Session AR démarrée. Visez le sol pour détecter un plan…"); reticle.enabled = true; });
-    app.xr.on("end", function () { messageToast("Session AR terminée."); reticle.enabled = false; isModelDragging = false; isRotateMode = false; rotRangeInput.disabled = true; });
+    app.xr.on("start", function () {
+      messageToast("Session AR démarrée. Visez le sol pour détecter un plan…");
+      reticle.enabled = true;
+    });
+    app.xr.on("end", function () {
+      messageToast("Session AR terminée.");
+      reticle.enabled = false;
+      isModelDragging = false;
+      isRotateMode = false;
+      rotRangeInput.disabled = true;
+    });
     app.xr.on("available:" + pc.XRTYPE_AR, function (a) {
       if (!a) messageToast("AR immersive indisponible.");
       else if (!app.xr.hitTest.supported) messageToast("AR Hit Test non supporté.");
@@ -677,4 +689,3 @@
     else messageToast("Chargement du modèle…");
   }
 })();
-</script>