[claude] Improve loading screen with ASCII art Timmy logo (#7) #10

claude · 2026-03-23T18:07:33Z

claude commented

2026-03-23 18:07:33 +00:00

First-time contributor

Fixes #7

What changed

js/loading.js (new): ASCII block-character TIMMY logo, initLoadingArt() to build per-character <span> elements, and setLoadingProgress(pct, msg) to progressively reveal characters left-to-right as progress increases.
js/main.js: imports the loading module; calls setLoadingProgress() at each init step — world (10%), effects (30%), agents (50%), controls (70%), UI (80%), WebSocket (90%), visitor (95%), complete (100%). Loading screen fades after a brief pause at 100%.
index.html: loading screen now contains <pre id="ascii-logo">, a progress bar track/fill, a percent counter, and a status message line. CSS added for dim/unlit vs bright/lit characters with Matrix green glow.

Result

Users see the TIMMY ASCII art fill in character-by-character with a green glow as each subsystem initialises, plus a progress bar and percentage readout. Fully compatible with the existing WebGL context-loss recovery path (progress reporting is first-init only).

Fixes #7 ## What changed - **`js/loading.js`** (new): ASCII block-character TIMMY logo, `initLoadingArt()` to build per-character `<span>` elements, and `setLoadingProgress(pct, msg)` to progressively reveal characters left-to-right as progress increases. - **`js/main.js`**: imports the loading module; calls `setLoadingProgress()` at each init step — world (10%), effects (30%), agents (50%), controls (70%), UI (80%), WebSocket (90%), visitor (95%), complete (100%). Loading screen fades after a brief pause at 100%. - **`index.html`**: loading screen now contains `<pre id="ascii-logo">`, a progress bar track/fill, a percent counter, and a status message line. CSS added for dim/unlit vs bright/lit characters with Matrix green glow. ## Result Users see the TIMMY ASCII art fill in character-by-character with a green glow as each subsystem initialises, plus a progress bar and percentage readout. Fully compatible with the existing WebGL context-loss recovery path (progress reporting is first-init only).

claude added 1 commit 2026-03-23 18:07:34 +00:00

feat: ASCII art Timmy logo with progressive loading reveal d759416fc6

Replace plain "INITIALIZING..." text with a block-character ASCII art
TIMMY logo that fills in character-by-character as each init step
completes. Shows a progress bar and percentage counter.

- js/loading.js: new module — ASCII art, initLoadingArt(), setLoadingProgress()
- js/main.js: import loading module; call setLoadingProgress() at each
  init stage (world 10%, effects 30%, agents 50%, controls 70%,
  UI 80%, WebSocket 90%, visitor 95%, done 100%)
- index.html: loading screen now uses <pre id="ascii-logo">, progress
  bar track/fill, percent label, and status message; CSS styles added
  for lit/unlit characters with green glow

Fixes #7

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

claude referenced this pull request

2026-03-23 18:07:45 +00:00

Improve loading screen with ASCII art Timmy logo #7

Timmy closed this pull request

2026-04-05 00:13:43 +00:00

Pull request closed

Please reopen this pull request to perform a merge.

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: Rockachopa/the-matrix#10

Allow edits from maintainers