From c40817d8458127d91c575e4cfe11511673e7b132 Mon Sep 17 00:00:00 2001 From: funman300 Date: Wed, 13 May 2026 17:17:33 -0700 Subject: [PATCH] fix(web): preload card images to prevent white-flash on flip When a card flipped face-up, the browser fetched the PNG on demand, showing the cream fallback colour until the image arrived. Preloading all 52 faces and the back at module load ensures they are cached before any flip can occur. Co-Authored-By: Claude Sonnet 4.6 --- solitaire_server/web/game.js | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/solitaire_server/web/game.js b/solitaire_server/web/game.js index 1a4856b..9df6326 100644 --- a/solitaire_server/web/game.js +++ b/solitaire_server/web/game.js @@ -53,6 +53,16 @@ const SUIT_CODE = { clubs: "C", diamonds: "D", hearts: "H", spades: "S" }; const RANK_LABELS = ["","A","2","3","4","5","6","7","8","9","10","J","Q","K"]; const RED_SUITS = new Set(["diamonds", "hearts"]); +// Preload all card images so face-up transitions never flash white. +(function preloadCards() { + const suits = Object.values(SUIT_CODE); + const ranks = RANK_LABELS.slice(1); // skip empty index 0 + for (const r of ranks) for (const s of suits) { + new Image().src = `/assets/cards/faces/${r}${s}.png`; + } + new Image().src = "/assets/cards/backs/back_0.png"; +}()); + // ── State ──────────────────────────────────────────────────────────────────── let game = null; let snap = null; // last rendered GameSnapshot