diff --git a/web/src/screens/hangar.ts b/web/src/screens/hangar.ts index a35affd..914eb97 100644 --- a/web/src/screens/hangar.ts +++ b/web/src/screens/hangar.ts @@ -18,7 +18,7 @@ * rather than offering a button that would lose the work. */ -import { currentSession } from "../api"; +import { type Session, currentSession } from "../api"; import { footer } from "../chrome"; import { el, render } from "../dom"; import { library } from "../library"; @@ -1080,8 +1080,27 @@ export function hangarScreen(): Node[] { return picker; } + /** + * The strip, once the session read has answered. + * + * One picker, not two. A picker built before the answer has to be a + * signed-out one, which rolls a camo and repaints every sprite on the + * screen — so a player with a default of their own watched the hangar open + * in a random paint and then change to theirs a moment later. The read is a + * promise the masthead has already started, so what this waits on is + * usually already in flight. + */ + function mountCamo(session: Session | null): void { + camo.replaceChildren(follow(camoPicker(session, "random")).node); + } + const camo = el("section", { className: "card hangar-camo" }, [ - follow(camoPicker(null, "random")).node, + // The picker's own opening shape, so the card does not resize under the + // strip when the real one replaces this. + el("div", { className: "choice camo-pick" }, [ + el("strong", { textContent: "Camo" }), + el("p", { className: "hint", textContent: "Reading your camo…" }), + ]), ]); const screen = el("div", { className: "hangar" }, [ @@ -1142,14 +1161,14 @@ export function hangarScreen(): Node[] { draw(); void currentSession() - .then((session) => { - if (!session) return; - camo.replaceChildren(follow(camoPicker(session, "random")).node); - }) + .then(mountCamo) .catch((error: unknown) => { // The API being down costs the camo strip and nothing else: the library - // is a published file and the force is arithmetic over it. + // is a published file and the force is arithmetic over it. The strip + // still goes up, as the signed-out one: no saved camo to read, but None + // and a roll need no account and no API. console.warn("hangar: the session could not be read", error); + mountCamo(null); }); // Which library, asked of the API rather than compiled in, so a helm