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.
19 lines
1.7 KiB
Markdown
19 lines
1.7 KiB
Markdown
# 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 for the selected day (today or a backfilled past day, bounded by the active image's start), daily rollover, per-habit streak math, seeded (mulberry32) reveal-order permutation, and log-derived reveal: each habit reveals pixels equal to its own current streak length (1 the first day, 2 the next consecutive day, and so on), independent of any other habit. Because reveal recomputes from the whole log, backfilling a missed day re-bridges that habit's streak automatically. |
|
|
| **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, day navigator on the Today card (backfill past days), settings dialog (habits / artwork / data / about / changelog), 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.
|