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.
1.4 KiB
1.4 KiB
Paint by Habits — Architecture
Everything lives in one file, index.html, organized into sections:
| Component | Responsibility |
|---|---|
| State | Single JSON document under localStorage key bitbybit.v1; load/save with corruption guards; versioned for future migration. |
| Mechanics | Habit check/uncheck logging, daily rollover, streak math, seeded (mulberry32) reveal-order permutation, and log-derived reveal: each day reveals triangular(checks) pixels (the Nth check reveals N), multiplied by that day's streak length. |
| Artwork | Preset pixel-art definitions (palette + row strings); upload pipeline (offscreen canvas downsample → pixel grid); gallery of finished pieces. |
| Rendering | Canvas renderer for the artwork (revealed pixels, checkerboard for hidden, pop-in animation for deltas); DOM renderer for checklist, stats, settings. |
| UI wiring | Onboarding, settings dialog (habits / artwork / data / about), theme cycling (auto→light→dark via data-theme + CSS custom properties), export/import/wipe, confetti celebration, and a page footer disclosing authorship. |
Data flows one way: user action → mutate state → persist → re-render. The reveal permutation is derived from a stored seed, never persisted, so exports stay small and rendering is deterministic.
There is no server, no network I/O, and no build step. See docs/DESIGN.md for
the full specification.