release: bump version to 0.40.4

frontend/public/earth/js/main.js

@@ -242,6 +242,7 @@ let activeTouchPoints = new Map();
 let pinchGesture = null;
 let pointerDragDistance = 0;
 let suppressNextClick = false;
+let shouldRefreshSatellitesAfterVisibilityResume = false;
 
 const clock = new THREE.Clock();
 const interactionRaycaster = new THREE.Raycaster();
@@ -2392,6 +2393,7 @@ export async function setSatellitesEnabled(
 
 function setupEventListeners() {
   const handleResize = () => onWindowResize();
+  const handleVisibilityChange = () => onVisibilityChange();
   const handlePointerMove = (event) => onPointerMove(event);
   const handlePointerDown = (event) => onPointerDown(event);
   const handlePointerUp = (event) => onPointerUp(event);
@@ -2403,6 +2405,7 @@ function setupEventListeners() {
   const handleInfoCardDrag = () => repositionCruiseConnector();
 
   bindListener(window, "resize", handleResize);
+  bindListener(document, "visibilitychange", handleVisibilityChange);
   bindListener(window, "pagehide", handlePageHide);
   bindListener(window, "beforeunload", handlePageHide);
   bindListener(window, "earth:rotation-mode-change", handleRotationMode);
@@ -2425,6 +2428,20 @@ function setupEventListeners() {
   }
 }
 
+function onVisibilityChange() {
+  if (document.hidden) {
+    shouldRefreshSatellitesAfterVisibilityResume = true;
+    return;
+  }
+
+  if (!shouldRefreshSatellitesAfterVisibilityResume) return;
+  shouldRefreshSatellitesAfterVisibilityResume = false;
+
+  // Drop the elapsed background time so the next RAF does not replay it.
+  clock.getDelta();
+  updateSatellitePositions(0, true, { resetTrails: true });
+}
+
 function updateHudScale() {
   const widthScale = window.innerWidth / HUD_CONFIG.scaleReferenceWidth;
   const heightScale = window.innerHeight / HUD_CONFIG.scaleReferenceHeight;

frontend/public/earth/js/satellites.js

@@ -68,6 +68,7 @@ const SATELLITE_CONSTELLATION_LABELS = Object.freeze({
 const TRAIL_LENGTH = SATELLITE_CONFIG.trailLength;
 const DOT_TEXTURE_SIZE = 32;
 const POSITION_UPDATE_INTERVAL_MS = 250;
+const BACKGROUND_TRAIL_RESET_DELTA_MS = 2000;
 const DIMMED_SATELLITE_BRIGHTNESS = 0.42;
 const DIMMED_SATELLITE_TRAIL_BRIGHTNESS = 0.24;
 const DIMMED_SATELLITE_POINT_OPACITY = 0.62;
@@ -556,6 +557,34 @@ function createSatellitePositionState() {
   };
 }
 
+function resetSatelliteTrailState() {
+  satellitePositions.forEach((position) => {
+    position.trail = [];
+    position.trailIndex = 0;
+    position.trailCount = 0;
+  });
+}
+
+function clearSatelliteTrailGeometry() {
+  if (!satelliteTrails) return;
+
+  const trailPositionAttr = satelliteTrails.geometry.attributes.position;
+  const trailColorAttr = satelliteTrails.geometry.attributes.color;
+  if (trailPositionAttr?.array) {
+    trailPositionAttr.array.fill(0);
+    trailPositionAttr.needsUpdate = true;
+  }
+  if (trailColorAttr?.array) {
+    trailColorAttr.array.fill(0);
+    trailColorAttr.needsUpdate = true;
+  }
+}
+
+function clearSatelliteTrails() {
+  resetSatelliteTrailState();
+  clearSatelliteTrailGeometry();
+}
+
 function ensureSatelliteCapacity(count) {
   if (!satellitePoints || !satelliteBackdropPoints || !satelliteTrails) return;
 
@@ -925,21 +954,32 @@ export async function loadSatellites(options = {}) {
   };
 }
 
-export function updateSatellitePositions(deltaTime = 0, force = false) {
+export function updateSatellitePositions(deltaTime = 0, force = false, options = {}) {
   if (!satellitePoints || !satelliteBackdropPoints || satelliteData.length === 0) return;
 
   const shouldUpdateTrails =
     showSatellites || showTrails || lockedSatelliteIndex !== null;
-  positionUpdateAccumulator += deltaTime;
+  const shouldResetTrails =
+    options.resetTrails ||
+    (!force && deltaTime >= BACKGROUND_TRAIL_RESET_DELTA_MS);
+
+  if (shouldResetTrails) {
+    clearSatelliteTrails();
+    positionUpdateAccumulator = POSITION_UPDATE_INTERVAL_MS;
+  } else {
+    positionUpdateAccumulator += deltaTime;
+  }
 
   if (!force && positionUpdateAccumulator < POSITION_UPDATE_INTERVAL_MS) {
     return;
   }
 
-  const elapsedMs = Math.max(
-    positionUpdateAccumulator,
-    POSITION_UPDATE_INTERVAL_MS,
-  );
+  const elapsedMs = shouldResetTrails
+    ? 0
+    : Math.max(
+        positionUpdateAccumulator,
+        POSITION_UPDATE_INTERVAL_MS,
+      );
   positionUpdateAccumulator = 0;
 
   const positions = satellitePoints.geometry.attributes.position.array;
@@ -2384,10 +2424,8 @@ export function clearSatelliteData() {
 
   satellitePositions.forEach((position) => {
     position.current.set(0, 0, 0);
-    position.trail = [];
-    position.trailIndex = 0;
-    position.trailCount = 0;
   });
+  resetSatelliteTrailState();
 
   if (satellitePoints) {
     const positionAttr = satellitePoints.geometry.attributes.position;
@@ -2424,18 +2462,7 @@ export function clearSatelliteData() {
     satelliteBackdropPoints.geometry.setDrawRange(0, 0);
   }
 
-  if (satelliteTrails) {
-    const trailPositionAttr = satelliteTrails.geometry.attributes.position;
-    const trailColorAttr = satelliteTrails.geometry.attributes.color;
-    if (trailPositionAttr?.array) {
-      trailPositionAttr.array.fill(0);
-      trailPositionAttr.needsUpdate = true;
-    }
-    if (trailColorAttr?.array) {
-      trailColorAttr.array.fill(0);
-      trailColorAttr.needsUpdate = true;
-    }
-  }
+  clearSatelliteTrailGeometry();
 
   hideHoverRings();
   hideLockedRing();