Skip to main content

Arcade gains a fitted LCD and live power readout

· 2 min read
Brain Research Visualizer

EXEPERT Arcade now fits the Runner cleanly against the top of its Game Boy LCD and can show a live, accessible device-battery percentage when the browser supports it.

Root cause

The Game Boy shell is scaled independently from Phaser. Phaser's FIT mode read the already transformed parent bounds and wrote centering margins back onto the canvas, producing a visible gray band above the game and cropping the rendered width at some Size settings.

What changed

  • The Runner remains a 320x180 scene, but its rendered canvas is now top-centered, full-width, and uncropped inside the LCD. The unused lower remainder shares the game's dark background.
  • Supporting secure browsers show POWER {percentage}%. Battery events update the percentage, level arcs, LED state, charging glyph, and accessible status without polling.
  • Charging uses the EXEPERT lime accent. Discharging uses green above 50%, amber from 21-50%, and red at 20% or below; the percentage ensures status is never communicated by color alone.
  • Unsupported, blocked, rejected, or invalid Battery API results keep the classic static POWER label and red LED. No percentage is guessed.
  • Battery information is never persisted, logged, transmitted, or added to Arcade research telemetry, and listeners are removed when Arcade closes.

The Battery Status API is a progressive enhancement: browser support is limited, secure contexts are required, and Permissions Policy or privacy controls can prevent access. The Game Boy remains fully usable in every fallback state.

Verification

Automated coverage validates percentage normalization, visual thresholds, live levelchange and chargingchange updates, listener cleanup, missing and rejected API fallbacks, intrinsic 320x180 canvas geometry, LCD containment, Runner and AI Rescue alignment, console resize behavior, and document overflow. The combined telemetry release passed app and docs typechecks, 257 unit tests with six expected skips, all 24 Arcade and responsive Playwright scenarios, and both production builds. Visual checks at desktop, 970x820, and 390x844 confirmed the top-aligned LCD, live charging readout, contained phone Fit behavior, and the absence of document-level horizontal overflow or browser-console errors.