Update tooltips.js

tooltips.js

@@ -20,17 +20,24 @@ export async function initializeTooltips(options) {
     moveDuration = 0.6
   } = options;
 
-  if (!app || !cameraEntity || !tooltipsUrl) return;
+  if (!app || !cameraEntity || !tooltipsUrl) {
+    console.error("tooltips.js → missing required initialization options");
+    return;
+  }
 
-  // Load tooltips
+  // Load JSON of tooltips:
   let tooltipsData;
   try {
     const resp = await fetch(tooltipsUrl);
     tooltipsData = await resp.json();
   } catch (e) {
+    console.error("tooltips.js → failed fetching tooltips.json:", e);
+    return;
+  }
+  if (!Array.isArray(tooltipsData)) {
+    console.error("tooltips.js → tooltips.json must be an array");
     return;
   }
-  if (!Array.isArray(tooltipsData)) return;
 
   const tooltipEntities = [];
 
@@ -49,6 +56,8 @@ export async function initializeTooltips(options) {
     const sphere = new pc.Entity("tooltip-" + i);
     sphere.addComponent("model", { type: "sphere" });
     sphere.model.material = mat;
+
+    // Scale small (primitive sphere radius = 0.5)
     sphere.setLocalScale(0.05, 0.05, 0.05);
     sphere.setLocalPosition(x, y, z);
     sphere.tooltipData = { title, description, imgUrl };
@@ -70,11 +79,19 @@ export async function initializeTooltips(options) {
     setTooltipsVisibility(!!visible);
   });
 
-  // Cancel in-flight camera tween
+  // Keep track of any in-flight camera tween so we can cancel it
   let currentTween = null;
 
-  // Tooltip pick logic (for both mouse/tap)
-  function pickTooltip(x, y) {
+  // On mouse down (or touch equivalent), perform manual ray‐sphere intersection
+  app.mouse.on(pc.EVENT_MOUSEDOWN, (event) => {
+    // If a tween is running, cancel it immediately
+    if (currentTween) {
+      app.off("update", currentTween);
+      currentTween = null;
+    }
+
+    const x = event.x;
+    const y = event.y;
     const from = new pc.Vec3();
     const to   = new pc.Vec3();
     const camera = cameraEntity.camera;
@@ -83,6 +100,7 @@ export async function initializeTooltips(options) {
     camera.screenToWorld(x, y, camera.farClip, to);
 
     const dir = new pc.Vec3().sub2(to, from).normalize();
+
     let closestT = Infinity;
     let pickedEntity = null;
 
@@ -114,40 +132,18 @@ export async function initializeTooltips(options) {
       }));
       tweenCameraToTooltip(pickedEntity, moveDuration);
     }
-  }
+  });
 
-  // Mouse picking
+  // Also close tooltip panel if user interacts (mouse or touch) on the canvas
   const canvasId = app.graphicsDevice.canvas.id;
   const htmlCanvas = document.getElementById(canvasId);
-  if (htmlCanvas) {
-    htmlCanvas.addEventListener("mousedown", (event) => {
-      if (currentTween) {
-        app.off("update", currentTween);
-        currentTween = null;
-      }
-      pickTooltip(event.offsetX * window.devicePixelRatio, event.offsetY * window.devicePixelRatio);
-    }, { passive: false });
-
-    // Touch picking (for iOS/Android)
-    htmlCanvas.addEventListener("touchstart", (event) => {
-      if (event.touches.length === 1) {
-        const rect = htmlCanvas.getBoundingClientRect();
-        const x = (event.touches[0].clientX - rect.left) * window.devicePixelRatio;
-        const y = (event.touches[0].clientY - rect.top) * window.devicePixelRatio;
-        pickTooltip(x, y);
-        event.preventDefault();
-      }
-    }, { passive: false });
-  }
-
-  // Also close tooltip panel if user interacts (mouse or touch) on the canvas
   if (htmlCanvas) {
     htmlCanvas.addEventListener("mousedown", () => {
       document.dispatchEvent(new CustomEvent("hide-tooltip"));
     });
     htmlCanvas.addEventListener("touchstart", () => {
       document.dispatchEvent(new CustomEvent("hide-tooltip"));
-    }, { passive: false });
+    });
   }
 
   // Helper to normalize angle difference into [-180, +180]