docs: visual road-to-v1.0 page with charts + icon coverage#138
Merged
Conversation
Standalone HTML at docs/roadmap-to-v1.html. Renders Meadow-styled
charts (Chart.js via CDN) covering:
- Net codebase growth across all 16 tagged releases
- Commits-per-release and total file count over time
- Per-game hand-drawn icon coverage (fish + bugs only) computed
directly from public/icons/ vs public/data/<game>/{fish,bugs}.json
- Cross-game species overlap pyramid (5g/4g/3g/2g/1g tiers) showing
which un-drawn species would light up the most games at once
- Timeline of remaining v0.9.6 -> v1.0 betas
- v1.0 launch buckets (branding/SEO/a11y/perf)
Self-contained — open the file directly in a browser. Lives in docs/
alongside the existing planning docs; not wired into the deployed app.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Contributor
There was a problem hiding this comment.
Pull request overview
Adds a standalone documentation page under docs/ that visually summarizes progress toward v1.0 and provides charted analysis of hand-drawn icon coverage, intended to be opened directly in a browser (not wired into the deployed app).
Changes:
- Introduces
docs/roadmap-to-v1.html, a self-contained HTML+CSS page with a “Meadow” look and multiple Chart.js visualizations. - Includes static datasets and client-side rendering for release growth charts and per-game fish/bug icon-coverage bars.
- Documents roadmap milestones and “v1.0 launch buckets” in a single page.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| href="https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Inter:wght@400;500;600;700&display=swap" | ||
| rel="stylesheet" | ||
| /> | ||
| <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.1/dist/chart.umd.min.js"></script> |
Owner
Author
There was a problem hiding this comment.
Good catch. I tried to compute the SRI hash for chart.umd.min.js@4.4.1 from the sandbox, but the CDN host isn't in this environment's network allowlist — curl and WebFetch both fail, so I can't generate a verified hash here.
A few options, Bea — how would you like to handle this?
- Add SRI, you provide the hash. Run
curl -sL https://cdn.jsdelivr.net/npm/chart.js@4.4.1/dist/chart.umd.min.js | openssl dgst -sha384 -binary | openssl base64 -Alocally and paste the result; I'll add theintegrity=+crossorigin="anonymous"attributes. - Self-host the file. Vendor
chart.umd.min.jsintodocs/vendor/and reference it locally — eliminates the CDN supply-chain surface entirely. - Skip SRI for this doc. It's a local-only planning doc opened by double-clicking, not deployed; the threat model is much narrower than the Curator handoff (which is also local but follows the SRI pattern as a matter of habit). I'd lean against this one — consistency is cheap.
The other five review comments (aria-labels on the four canvases + the stale methodology comment) are addressed in 222bb90.
Generated by Claude Code
Comment on lines
+517
to
+520
| </p> | ||
| <div class="chart-wrap"> | ||
| <canvas id="locChart"></canvas> | ||
| </div> |
Comment on lines
+526
to
+529
| <h3>Commits per release</h3> | ||
| <div class="chart-wrap short"> | ||
| <canvas id="commitsChart"></canvas> | ||
| </div> |
Comment on lines
+535
to
+539
| is icon assets (PNG sources + 768px exports + manifests), not code bloat. | ||
| </p> | ||
| <div class="chart-wrap short"> | ||
| <canvas id="filesChart"></canvas> | ||
| </div> |
| <strong>5-game tier</strong> lights up every single game at once. | ||
| </p> | ||
| <div class="chart-wrap short"> | ||
| <canvas id="overlapChart"></canvas> |
Comment on lines
+1025
to
+1029
| // For each game: how many fish+bugs are hand-drawn vs scraped (have an icon | ||
| // file in public/icons/<game>/) vs no icon yet. Approximate scraped coverage | ||
| // from the manifest gap-fill % reported in CLAUDE.md. | ||
| // Counts derived directly from public/icons/{fish,bugs}/*.png cross-referenced | ||
| // against public/data/<game>/{fish,bugs}.json on 2026-05-12. |
Addresses Copilot review on PR #138: - Add role="img" + aria-label to all four <canvas> chart elements with a short text alternative describing the chart's key takeaway (locChart, commitsChart, filesChart, overlapChart). - Replace the stale "approximate from CLAUDE.md" comment over the games[] array with an accurate description of how drawn / scraped / missing counts are derived from disk. SRI on the Chart.js CDN script is not addressed in this commit — the sandbox blocks the CDN host so the hash can't be computed here. Will follow up after Bea confirms whether to add SRI (and provides or verifies the hash) or skip it for this local-only doc.
docs/ is never included in the Vite build output — only public/ gets copied to dist/. Moving alongside version-history.html so the page is accessible at /roadmap-to-v1.html on the preview deploy.
jacuzzicoding
pushed a commit
that referenced
this pull request
May 14, 2026
public/roadmap-to-v1.html was generated on 2026-05-12 (PR #138) before the goldfish hand-drawn icon (PR #136) was recorded in the other doc-sync commit (94d17ed) that ran 34 seconds later the same day. Result: the HTML roadmap still shows 7 hand-drawn icons and 203 species remaining; docs/roadmap-to-v1.md already reflects 8/202. Corrections: - Stat tile: 7 / 210 → 8 / 210 - "Where we are" hero number: 7 → 8 - Unique species remaining: 203 → 202 (both the big number and the milestone body) - Fish list: 4 fish (sea-bass, koi, coelacanth, frog) → 5 fish (+ goldfish) - Eyebrow + footer date: 2026-05-12 → 2026-05-14 Note: per-game gameBars data (drawn/scraped counts per game) in the inline JS block are not updated here — those require running `npm run audit:icons` to get precise numbers. Left for a future icon-audit pass. https://claude.ai/code/session_01W5ZSp5SuSQFFU6bQVUZhbU
3 tasks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Adds a single self-contained HTML page at
docs/roadmap-to-v1.htmlvisualising the road from today (v0.9.6-beta in flight) to v1.0. Meadow-styled, Chart.js via CDN, opens by double-clicking — not wired into the deployed app.Sections:
Decisions
docs/lives alongside the existing planning docs (v0.9-plan.md,roadmap-to-v1.md, etc.) and skips the CHANGELOG / CLAUDE.md churn a new React route would require.public/icons/{fish,bugs}/*.pngagainst each game'spublic/data/<gameId>/{fish,bugs}.json. Real ACNH missing-fish-and-bugs count: 86, not ~50.antcorrected to bugs/ — CLAUDE.md mislabelsantasfish/ant; the actual asset is inicon-sources/bugs/ant.png. The page reflects the correct categorisation.Test plan
docs/roadmap-to-v1.htmlin a browser — all five charts render, per-game bars compute correctly, fonts loadpublic/icons/+public/data/npm run buildandnpm testnot relevantGenerated by Claude Code