Update tooltips.js

tooltips.js

@@ -1,4 +1,121 @@
 // tooltips.js
+//
+// - Charge le JSON depuis GitHub Raw (par défaut) en utilisant un GET conditionnel (If-None-Match),
+//   ce qui évite les problèmes Safari/iOS liés aux requêtes HEAD et maximise la compatibilité CORS.
+// - Met en cache la dernière version valide (localStorage si possible, sinon repli mémoire).
+// - En cas d'erreur réseau/parse, retombe sur la dernière copie valide, sinon tente un GET avec cache-buster.
+// - Supporte camX/camY/camZ pour placer la caméra exactement à ces coordonnées et regarder le tooltip.
+//
+// Utilisation minimale :
+//   initializeTooltips({ app, cameraEntity, defaultVisible: true });
+//
+// Options utiles :
+//   - tooltipsUrl : pour surcharger l'URL (défaut : DEFAULT_TOOLTIPS_URL)
+//   - cacheMode   : 'default' | 'no-cache' | 'reload' | 'no-store' (défaut : 'no-cache' afin de revalider proprement)
+//   - moveDuration: durée (s) de l’animation caméra
+
+const DEFAULT_TOOLTIPS_URL =
+  "https://raw.githubusercontent.com/mika-fi/sgos_dataset/main/exemples/baleine/tooltips.json";
+
+// --- Stockage sûr (localStorage protégé + repli mémoire pour iOS privé / ITP / iframes) ---
+const __memStore = Object.create(null);
+function safeGetItem(key) {
+  try { return localStorage.getItem(key); } catch (_) { return __memStore[key] ?? null; }
+}
+function safeSetItem(key, value) {
+  try { localStorage.setItem(key, value); } catch (_) { __memStore[key] = value; }
+}
+function safeRemoveItem(key) {
+  try { localStorage.removeItem(key); } catch (_) { delete __memStore[key]; }
+}
+
+// --- Parse JSON sûr (évite de crasher le flux en cas de contenu invalide) ---
+async function safeParseJson(resp) {
+  const text = await resp.text();
+  try {
+    return JSON.parse(text);
+  } catch (e) {
+    // JSON invalide (rare sur GitHub Raw, mais mieux vaut prévenir)
+    throw new Error("Invalid JSON");
+  }
+}
+
+/**
+ * fetchWithETag(url, { cacheMode, bustOnError })
+ * - GET conditionnel avec If-None-Match pour obtenir 304 si pas de changement
+ * - Conserve ETag + data localement
+ * - Fallback : sert la dernière copie valide, sinon GET "no-store" avec cache-buster
+ * - Évite les HEAD (souvent source d'ennuis avec Safari/CORS/redirections)
+ */
+async function fetchWithETag(url, { cacheMode = "no-cache", bustOnError = true } = {}) {
+  const LS_KEY_DATA = `tooltips:data:${url}`;
+  const LS_KEY_ETAG = `tooltips:etag:${url}`;
+  const prevEtag = safeGetItem(LS_KEY_ETAG);
+  const prevDataStr = safeGetItem(LS_KEY_DATA);
+  const prevData = prevDataStr ? (() => { try { return JSON.parse(prevDataStr); } catch { return null; } })() : null;
+
+  try {
+    // 1) GET conditionnel (If-None-Match) pour maximiser la compat safari/ios et CDN
+    const headers = {};
+    if (prevEtag) headers["If-None-Match"] = prevEtag;
+
+    const resp = await fetch(url, {
+      method: "GET",
+      cache: cacheMode,        // 'no-cache' pour revalidation, 'no-store' pour refetch strict
+      mode: "cors",
+      redirect: "follow",
+      credentials: "omit",
+      headers
+    });
+
+    // 304 = pas de changement -> réutilise la dernière copie locale
+    if (resp.status === 304 && prevData) {
+      return prevData;
+    }
+
+    if (!resp.ok) {
+      if (prevData) return prevData;
+      throw new Error(`HTTP ${resp.status}`);
+    }
+
+    // 2) Nouvelle version téléchargée
+    const json = await safeParseJson(resp);
+
+    // 3) Enregistre ETag + data
+    const newEtag = resp.headers.get("ETag") || resp.headers.get("etag") || null;
+    if (newEtag) safeSetItem(LS_KEY_ETAG, newEtag);
+    safeSetItem(LS_KEY_DATA, JSON.stringify(json));
+
+    return json;
+  } catch (err) {
+    // 4) Fallback : si échec réseau/parse, renvoie la dernière copie locale si dispo
+    if (prevData) return prevData;
+
+    // 5) Ultime recours : cache-buster no-store (utile contre caches "têtus" de Safari/iOS)
+    if (bustOnError) {
+      const sep = url.includes("?") ? "&" : "?";
+      const bustedUrl = `${url}${sep}t=${Date.now()}`;
+      try {
+        const bustResp = await fetch(bustedUrl, {
+          method: "GET",
+          cache: "no-store",
+          mode: "cors",
+          redirect: "follow",
+          credentials: "omit"
+        });
+        if (!bustResp.ok) throw new Error(`HTTP ${bustResp.status}`);
+        const fresh = await safeParseJson(bustResp);
+        // sauvegarde sans ETag (inconnu sur la requête bustée)
+        safeSetItem(LS_KEY_DATA, JSON.stringify(fresh));
+        return fresh;
+      } catch (e2) {
+        throw err; // On remonte l'erreur d'origine si tout échoue
+      }
+    }
+
+    throw err;
+  }
+}
 
 /**
  * initializeTooltips(options)
@@ -6,42 +123,30 @@
  * - options.app: the PlayCanvas AppBase instance
  * - options.cameraEntity: PlayCanvas camera Entity (utilisant le script orbitCamera)
  * - options.modelEntity: the main model entity (for relative positioning, optional)
- * - options.tooltipsUrl: URL to fetch JSON array of tooltip definitions
- * - options.defaultVisible: boolean: whether tooltips are visible initially
- * - options.moveDuration: number (seconds) for smooth camera move to selected tooltip
- *
- * JSON attendu pour chaque tooltip :
- * {
- *   x, y, z,                       // position du tooltip (obligatoire)
- *   title, description, imgUrl,    // infos UI (optionnelles)
- *   camX, camY, camZ               // position de caméra cible (optionnelles)
- * }
- *
- * Comportement :
- * - Si camX/camY/camZ sont fournis, la caméra se déplacera exactement
- *   vers (camX, camY, camZ) et s'orientera pour regarder le tooltip.
- * - Sinon, on conserve l'ancien comportement : la caméra orbite vers le tooltip
- *   avec une distance calculée (zoom minimum + taille du tooltip).
+ * - options.tooltipsUrl: URL du JSON (optionnel, défaut = DEFAULT_TOOLTIPS_URL)
+ * - options.defaultVisible: booléen : tooltips visibles au démarrage
+ * - options.moveDuration: durée (s) de l’animation caméra (défaut 0.6)
+ * - options.cacheMode: 'default' | 'no-cache' | 'reload' | 'no-store' (défaut 'no-cache' → revalidation correcte)
  */
 export async function initializeTooltips(options) {
   const {
     app,
     cameraEntity,
-    modelEntity,         // non utilisé directement ici mais conservé pour compat
-    tooltipsUrl,
+    modelEntity, // conservé pour compat
+    tooltipsUrl = DEFAULT_TOOLTIPS_URL,
     defaultVisible,
-    moveDuration = 0.6
-  } = options;
+    moveDuration = 0.6,
+    cacheMode = "no-cache"
+  } = options || {};
 
   if (!app || !cameraEntity || !tooltipsUrl) return;
 
-  // --- Chargement du JSON de tooltips ---
+  // --- Chargement robuste des tooltips (dernière version + fallback) ---
   let tooltipsData;
   try {
-    const resp = await fetch(tooltipsUrl);
-    tooltipsData = await resp.json();
+    tooltipsData = await fetchWithETag(tooltipsUrl, { cacheMode, bustOnError: true });
   } catch (e) {
-    // Échec du fetch/parse JSON -> on abandonne proprement
+    // Aucune donnée exploitable -> on abandonne proprement
     return;
   }
   if (!Array.isArray(tooltipsData)) return;
@@ -71,22 +176,22 @@ export async function initializeTooltips(options) {
     sphere.setLocalScale(0.05, 0.05, 0.05);
     sphere.setLocalPosition(x, y, z);
 
-    // On stocke toutes les infos utiles sur l'entité
+    // Infos du tooltip (UI + cible caméra optionnelle)
     sphere.tooltipData = {
       title,
       description,
       imgUrl,
-      // Nouvelle partie : coordonnées de caméra cibles (optionnelles)
-      camTarget: (Number.isFinite(camX) && Number.isFinite(camY) && Number.isFinite(camZ))
-        ? new pc.Vec3(camX, camY, camZ)
-        : null
+      camTarget:
+        Number.isFinite(camX) && Number.isFinite(camY) && Number.isFinite(camZ)
+          ? new pc.Vec3(camX, camY, camZ)
+          : null
     };
 
     app.root.addChild(sphere);
     tooltipEntities.push(sphere);
   }
 
-  // --- Gestion de la visibilité des tooltips ---
+  // --- Visibilité initiale + contrôle externe ---
   function setTooltipsVisibility(visible) {
     tooltipEntities.forEach(ent => { ent.enabled = visible; });
   }
@@ -94,7 +199,7 @@ export async function initializeTooltips(options) {
 
   // Écouteur externe (ex. UI HTML) pour afficher/masquer les tooltips
   document.addEventListener("toggle-tooltips", (evt) => {
-    const { visible } = evt.detail;
+    const { visible } = evt.detail || {};
     setTooltipsVisibility(!!visible);
   });
 
@@ -222,10 +327,7 @@ export async function initializeTooltips(options) {
 
     if (overrideCamWorldPos) {
       // --- Nouveau mode : position caméra imposée par le JSON ---
-      // On calcule l'orbite (yaw/pitch/dist) qui correspond exactement à cette position
       const { yaw, pitch, distance } = computeOrbitFromPositions(overrideCamWorldPos, targetPos);
-
-      // Interpolation par le plus court chemin depuis l'état courant
       endYaw = startYaw + shortestAngleDiff(yaw, startYaw);
       endPitch = startPitch + shortestAngleDiff(pitch, startPitch);
       endDist = distance;
@@ -235,7 +337,6 @@ export async function initializeTooltips(options) {
       const minZoom = orbitCam.distanceMin || 0.1;
       const desiredDistance = Math.max(minZoom * 1.2, worldRadius * 4);
 
-      // On garde la position caméra actuelle comme point de départ pour calculer les angles
       const camWorldPos = cameraEntity.getPosition().clone();
       const { yaw, pitch } = computeOrbitFromPositions(camWorldPos, targetPos);