You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
29 lines
2.0 KiB
Markdown
29 lines
2.0 KiB
Markdown
---
|
|
# vibed-nz22
|
|
title: 'Bit-by-bit: live favicon mirrors the partially revealed artwork'
|
|
status: completed
|
|
type: feature
|
|
priority: normal
|
|
created_at: 2026-07-14T20:46:47Z
|
|
updated_at: 2026-07-14T20:53:40Z
|
|
---
|
|
|
|
Render the current artwork (revealed pixels solid, unrevealed as loading-static) into a 64x64 offscreen canvas and set it as the page favicon via a data URL, updating on reveal and theme change. Stays single-file, no external requests.
|
|
|
|
- [x] Add <link rel="icon"> placeholder in head
|
|
- [x] Add updateFavicon() offscreen renderer
|
|
- [x] Hook into renderArt() and applyTheme()
|
|
- [x] Verify no external requests / console errors
|
|
|
|
## Summary of Changes
|
|
|
|
- `index.html` head: `<link id="favicon">` + `<link id="faviconApple">` seeded with an inert 1px data URL.
|
|
- New `updateFavicon()` / `drawFavicon()`: renders the displayed image into a 64x64 offscreen canvas (integer cell size, letterboxed/centred), revealed pixels solid, unrevealed as an alternating static checker, transparent pixels left as canvas background. Falls back to an 8x8 checker placeholder when no artwork is active. Handed to both link tags via `toDataURL()`.
|
|
- Coalesced with a rAF flag so the burst of `renderArt()` calls from one check-off repaints the icon once; href only reassigned when the PNG actually differs.
|
|
- Hooked into `renderArt()` (covers reveal, pop, celebration snapshot, empty state) and `applyTheme()` (bg/static tones are theme-dependent).
|
|
- `docs/DESIGN.md` section 5 documents the behavior.
|
|
|
|
## Verification
|
|
|
|
Headless browser automation was unavailable in the sandbox, so `drawFavicon` and the reveal-order helpers were extracted verbatim from `index.html` and executed in Node against a recording canvas stub with a content-hashed `toDataURL`. With a 16x16 sprite at 5 checks x 8 px/check: 40/40 revealed cells painted solid, 116/116 unrevealed painted static, 100 transparent left as background, 0 mismatches; grid fills the full 64x64; href is stable across an unchanged redraw and changes when more pixels reveal. `grep` confirms no `http://`, `https://`, or `fetch(` in the file.
|