From a049b34914e6d51443371469c01b77d98182c1ec Mon Sep 17 00:00:00 2001 From: Joshua Date: Tue, 21 Jul 2026 19:51:51 +0100 Subject: [PATCH] feat(web): white logo boot splash; cap splash animation at one 4s cycle Replace the terminal/matrix boot shell in index.html with the SplashScreen look (white, animated logo gif, GITS wordmark) so pre-React and pending splashes match. SplashScreen now counts elapsed time from __gitsBootStart and crossfades to the static logo after one ~4s gif cycle instead of looping while auth/connection resolves. Co-Authored-By: Claude Fable 5 Claude-Session: https://claude.ai/code/session_01Au2F2zbx3i5NauQHWJn4Gb --- apps/web/index.html | 288 ++--------------------- apps/web/src/components/SplashScreen.tsx | 32 ++- 2 files changed, 48 insertions(+), 272 deletions(-) diff --git a/apps/web/index.html b/apps/web/index.html index 11080ddfd8a..3671338a578 100644 --- a/apps/web/index.html +++ b/apps/web/index.html @@ -17,6 +17,7 @@ diff --git a/apps/web/src/components/SplashScreen.tsx b/apps/web/src/components/SplashScreen.tsx index a71742e1619..25efae0be43 100644 --- a/apps/web/src/components/SplashScreen.tsx +++ b/apps/web/src/components/SplashScreen.tsx @@ -1,8 +1,38 @@ +import { useEffect, useState } from "react"; + +// One full cycle of /gits-logo-anim.gif. Elapsed time counts from the static +// index.html boot splash (window.__gitsBootStart) so the animation plays once +// total across both layers, then holds the static logo instead of looping. +// ponytail: constant must track the gif asset; re-measure if the gif changes. +const LOGO_CYCLE_MS = 4000; +const HOLD_LOGO_SRC = "/apple-touch-icon.png"; + +function elapsedSinceBoot(): number { + const start = (window as Window & { __gitsBootStart?: number }).__gitsBootStart; + return typeof start === "number" ? Date.now() - start : 0; +} + export function SplashScreen() { + const [hold, setHold] = useState(() => elapsedSinceBoot() >= LOGO_CYCLE_MS); + useEffect(() => { + if (hold) return; + const timer = setTimeout(() => setHold(true), LOGO_CYCLE_MS - elapsedSinceBoot()); + return () => clearTimeout(timer); + }, [hold]); return (
-
+
+
GITS