Update deplacement_dans_env/viewer_pr_env.js

deplacement_dans_env/viewer_pr_env.js

@@ -1,12 +1,13 @@
-// viewer_pr_env.js — robuste (boot non-bloquant, logs, physics avec fallback)
+// viewer_pr_env.js — robuste v2 (multi‑CDN PlayCanvas import)
 // ============================================================================
-// - PlayCanvas ESM
-// - Boot non-bloquant : l'app démarre et rend tout de suite (caméra au root)
-// - Ammo (WASM) en parallèle, avec timeout + double API (promise/callback)
-// - Colliders mesh posés après 1ère frame (postrender)
+// - Boot non-bloquant : l'app démarre tout de suite (caméra au root)
+// - Import PlayCanvas **robuste** : ESM multi‑CDN (esm.run → jsDelivr → unpkg)
+//   puis fallback **UMD** (playcanvas.js) si ESM bloqué par CSP/iframe
+// - Ammo (WASM) en parallèle, timeout + double API (promise/callback)
+// - Colliders mesh ajoutés après 1ʳᵉ frame (postrender)
 // - Player capsule créé seulement si Ammo OK, puis caméra reparentée
-// - Chargement GSplat/GLB tolérant (logs + timeout) ; DPR dynamique ; logs jalons
-// - NE CHARGE PAS le script de contrôle caméra (à ajouter côté scène)
+// - GSplat/GLB chargés avec logs + timeout ; DPR dynamique ; logs jalons
+// - Ne charge pas le script de contrôle caméra (à ajouter côté scène)
 // ============================================================================
 
 /* -------------------------------------------
@@ -90,8 +91,52 @@ function isMobileUA() {
   return isIOS || isAndroid;
 }
 
+async function importPlayCanvasRobust(timeoutMs = 6000) {
+  const sourcesESM = [
+    'https://esm.run/playcanvas',
+    'https://cdn.jsdelivr.net/npm/playcanvas@latest/build/playcanvas.mjs',
+    'https://unpkg.com/playcanvas@latest/build/playcanvas.mjs'
+  ];
+
+  // Essais ESM
+  for (const url of sourcesESM) {
+    try {
+      console.log('[PC-IMPORT] Try ESM:', url);
+      const mod = await Promise.race([
+        import(/* @vite-ignore */ url),
+        new Promise((_, rej) => setTimeout(() => rej(new Error('ESM timeout')), timeoutMs))
+      ]);
+      if (mod) {
+        console.log('[PC-IMPORT] ESM OK:', url);
+        return mod; // module ESM
+      }
+    } catch (e) {
+      console.warn('[PC-IMPORT] ESM failed:', url, e);
+    }
+  }
+
+  // Fallback UMD
+  const sourcesUMD = [
+    'https://cdn.jsdelivr.net/npm/playcanvas@latest/build/playcanvas.js',
+    'https://unpkg.com/playcanvas@latest/build/playcanvas.js'
+  ];
+  for (const url of sourcesUMD) {
+    try {
+      console.log('[PC-IMPORT] Try UMD:', url);
+      await new Promise((resolve, reject) => {
+        const s = document.createElement('script');
+        s.src = url; s.async = true; s.onload = resolve; s.onerror = reject;
+        document.head.appendChild(s);
+      });
+      if (window.pc) { console.log('[PC-IMPORT] UMD OK:', url); return window.pc; }
+    } catch (e) {
+      console.warn('[PC-IMPORT] UMD failed:', url, e);
+    }
+  }
+  throw new Error('PlayCanvas import failed on all sources');
+}
+
 async function loadAmmoWithTimeout(baseUrl, timeoutMs = 4000) {
-  // Config URLs
   try {
     pc.WasmModule.setConfig('Ammo', {
       glueUrl: `${baseUrl}ammo.wasm.js`,
@@ -102,7 +147,7 @@ async function loadAmmoWithTimeout(baseUrl, timeoutMs = 4000) {
     console.warn('[Ammo] setConfig failed (ignored):', e);
   }
 
-  // 1) Tente API Promise
+  // 1) API Promise
   try {
     const maybePromise = pc.WasmModule.getInstance('Ammo', `${baseUrl}ammo.wasm.js`);
     if (maybePromise && typeof maybePromise.then === 'function') {
@@ -118,7 +163,7 @@ async function loadAmmoWithTimeout(baseUrl, timeoutMs = 4000) {
     console.warn('[Ammo] promise API failed:', e);
   }
 
-  // 2) Tente API callback
+  // 2) API callback
   let resolved = false;
   try {
     step('Ammo: waiting (callback API)…');
@@ -126,10 +171,7 @@ async function loadAmmoWithTimeout(baseUrl, timeoutMs = 4000) {
       new Promise((resolve) => pc.WasmModule.getInstance('Ammo', () => { resolved = true; resolve(); })),
       new Promise((_, rej) => setTimeout(() => rej(new Error('Ammo load timeout (callback)')), timeoutMs))
     ]);
-    if (resolved) {
-      step('Ammo: ready (callback API)');
-      return true;
-    }
+    if (resolved) { step('Ammo: ready (callback API)'); return true; }
   } catch (e) {
     console.warn('[Ammo] callback API failed:', e);
   }
@@ -237,18 +279,24 @@ export async function initializeViewer(config, instanceId) {
   canvas.addEventListener('blur', onCanvasBlur);
 
   // Empêche les touches scroll pendant survol
-  const scrollKeys = new Set(['ArrowUp','ArrowDown','ArrowLeft','ArrowRight','PageUp','PageDown','Home','End',' ','Space','Spacebar']);
+  const scrollKeys = new Set(['ArrowUp','ArrowDown','ArrowLeft','ArrowRight','PageUp','PageDown','Home','End',' ','Space','Space','Spacebar']);
   const onKeyDownCapture = (e) => { if (!isPointerOverCanvas) return; if (scrollKeys.has(e.key) || scrollKeys.has(e.code)) e.preventDefault(); };
   window.addEventListener('keydown', onKeyDownCapture, true);
 
   if (progressDialog) progressDialog.style.display = 'block';
 
-  // ---- Import PlayCanvas ----
+  // ---- Import PlayCanvas (robuste) ----
   if (!pc) {
-    step('B: importing PlayCanvas…');
-    pc = await import('https://esm.run/playcanvas');
-    window.pc = pc; // debug convenience
-    step('B+: PlayCanvas imported');
+    step('B: importing PlayCanvas (robust)…');
+    try {
+      const modOrPc = await importPlayCanvasRobust( mobile ? 8000 : 6000 );
+      pc = modOrPc && modOrPc.Application ? modOrPc : (window.pc || modOrPc);
+      window.pc = pc; // debug convenience
+      step('B+: PlayCanvas imported OK');
+    } catch (e) {
+      console.error('[PC-IMPORT] FAILED:', e);
+      throw e; // surface d’erreurs l’affichera
+    }
   }
 
   // ---- Crée l’Application (démarrage non-bloquant) ----
@@ -329,28 +377,18 @@ export async function initializeViewer(config, instanceId) {
   const assets = [];
   let sogAsset = null, glbAsset = null;
 
-  if (sogUrl) {
-    sogAsset = new pc.Asset('gsplat', 'gsplat', { url: sogUrl });
-    app.assets.add(sogAsset); assets.push(sogAsset);
-  }
-  if (glbUrl) {
-    glbAsset = new pc.Asset('glb', 'container', { url: glbUrl });
-    app.assets.add(glbAsset); assets.push(glbAsset);
-  }
+  if (sogUrl) { sogAsset = new pc.Asset('gsplat', 'gsplat', { url: sogUrl }); app.assets.add(sogAsset); assets.push(sogAsset); }
+  if (glbUrl) { glbAsset = new pc.Asset('glb', 'container', { url: glbUrl }); app.assets.add(glbAsset); assets.push(glbAsset); }
 
   step('F: requesting assets', { sog: !!sogUrl, glb: !!glbUrl });
 
   await new Promise((resolve) => {
     if (!assets.length) return resolve();
-
     const loader = new pc.AssetListLoader(assets, app.assets);
     let done = false;
     const finish = (label) => { if (!done) { done = true; step('F+: assets loaded (' + label + ')'); resolve(); } };
-
     loader.on('error', (e) => { console.warn('[viewer] Asset load error:', e); finish('with errors'); });
     loader.load(() => finish('ok'));
-
-    // garde-fou timeout
     setTimeout(() => { if (!done) { console.warn('[viewer] Asset load timeout — continuing'); finish('timeout'); } }, 10000);
   });
 
@@ -366,13 +404,8 @@ export async function initializeViewer(config, instanceId) {
 
   // ---- Instancier le GLB d’environnement ----
   envEntity = glbAsset && glbAsset.resource ? glbAsset.resource.instantiateRenderEntity() : null;
-  if (envEntity) {
-    envEntity.name = 'ENV_GLTF';
-    app.root.addChild(envEntity);
-    step('I: env GLB instanced');
-  } else {
-    console.warn('[viewer] No environment GLB — physics will be skipped.');
-  }
+  if (envEntity) { envEntity.name = 'ENV_GLTF'; app.root.addChild(envEntity); step('I: env GLB instanced'); }
+  else { console.warn('[viewer] No environment GLB — physics will be skipped.'); }
 
   // ---- Matériau "fond uni" si pas d'espace expo ----
   if (!espace_expo_bool && envEntity) {
@@ -391,25 +424,18 @@ export async function initializeViewer(config, instanceId) {
   }
 
   // ---- Physique : chargement Ammo en parallèle, colliders après 1ère frame ----
-  let physicsReady = false;
   if (wantPhysics) {
     (async () => {
       try {
-        const ok = await loadAmmoWithTimeout(ammoBaseUrl, isMobileUA() ? 5000 : 3500).catch(() => false);
+        const ok = await loadAmmoWithTimeout(ammoBaseUrl, isMobileUA() ? 8000 : 5000).catch(() => false);
         if (!ok) { step('P: Ammo unavailable — rendering without physics'); return; }
 
-        // Pose des colliders mesh après 1ère frame pour garantir meshInstances
         if (envEntity) {
           app.once('postrender', () => {
             const applyStaticMesh = (e) => {
-              if (e.render && !e.collision) {
-                try { e.addComponent('collision', { type: 'mesh' }); } catch (err) { console.warn('[phys] add collision failed:', err); }
-              }
-              if (!e.rigidbody) {
-                try { e.addComponent('rigidbody', { type: 'static', friction: 0.6, restitution: 0.0 }); } catch (err) { console.warn('[phys] add rigidbody failed:', err); }
-              } else if (e.rigidbody && e.rigidbody.type !== 'static') {
-                e.rigidbody.type = 'static';
-              }
+              if (e.render && !e.collision) { try { e.addComponent('collision', { type: 'mesh' }); } catch (err) { console.warn('[phys] add collision failed:', err); } }
+              if (!e.rigidbody) { try { e.addComponent('rigidbody', { type: 'static', friction: 0.6, restitution: 0.0 }); } catch (err) { console.warn('[phys] add rigidbody failed:', err); } }
+              else if (e.rigidbody && e.rigidbody.type !== 'static') { e.rigidbody.type = 'static'; }
             };
             const stack=[envEntity];
             while (stack.length){ const n=stack.pop(); applyStaticMesh(n); n.children?.forEach(c=>stack.push(c)); }
@@ -417,9 +443,7 @@ export async function initializeViewer(config, instanceId) {
           });
         }
 
-        // Crée Player capsule et reparent caméra
         createPlayerCapsuleAndAttachCamera(app, config);
-        physicsReady = true;
         step('Q: physics ON (player created)');
       } catch (e) {
         console.warn('[phys] init failed:', e);
@@ -458,7 +482,6 @@ export async function initializeViewer(config, instanceId) {
    Helpers: création Player capsule + cam
 -------------------------------------------- */
 function createPlayerCapsuleAndAttachCamera(app, config) {
-  // Si déjà présent, ne pas recréer
   if (playerEntity && playerEntity.rigidbody) { step('Q+: player already exists'); return; }
 
   playerEntity = new pc.Entity('Player');
@@ -477,14 +500,12 @@ function createPlayerCapsuleAndAttachCamera(app, config) {
       linearDamping: 0.15,
       angularDamping: 0.999
     });
-    playerEntity.rigidbody.angularFactor = new pc.Vec3(0, 0, 0); // éviter roulis
+    playerEntity.rigidbody.angularFactor = new pc.Vec3(0, 0, 0);
   } catch (e) { console.warn('[phys] add rigidbody failed:', e); }
 
-  // Spawn
   playerEntity.setPosition(chosenCameraX, chosenCameraY, chosenCameraZ);
   app.root.addChild(playerEntity);
 
-  // Caméra -> enfant Player (yeux)
   const eyes = config.eyesOffsetY !== undefined ? parseFloat(config.eyesOffsetY) : Math.max(0.1, capsuleHeight * 0.9);
   try {
     cameraEntity.reparent(playerEntity);
@@ -492,7 +513,6 @@ function createPlayerCapsuleAndAttachCamera(app, config) {
     cameraEntity.setLocalEulerAngles(0, 0, 0);
   } catch (e) { console.warn('[phys] camera reparent failed:', e); }
 
-  // Gravité selon freeFly
   const freeFly = !!config.freeFly;
   app.scene.gravity = freeFly ? new pc.Vec3(0,0,0) : new pc.Vec3(0,-9.81,0);
 }