Skip to content

Commit a824593

Browse files
committed
Cut 8 stale journey prototype pages superseded by production
After commit 64360a4 wired section figures into render_journey_page, production /journeys/<slug> pages render the same content as the journey-* prototype HTMLs that build_prototypes.py was emitting. Reviewers should look at the production pages, not the duplicate prototypes. Cut: - public/prototyping/journey-runtime.html - public/prototyping/journey-control-flow.html - public/prototyping/journey-iteration.html - public/prototyping/journey-shapes.html - public/prototyping/journey-interfaces.html - public/prototyping/journey-types.html - public/prototyping/journey-reliability.html - public/prototyping/journey-workers.html - build_prototypes.py: build_journey() function (~50 lines), JOURNEY_STYLE constant, the loop in main() that called it, and the 8 entries in the prototyping index list. Kept (intentional): - journey-figures-gestalt.html — grid view of all 24 section figures for cross-journey design review; production renders one figure per section per page, the gestalt shows them together. - layout-banner-* prototypes — reference designs for the banner grammar (single, pair, trio); useful when adding new banner layouts. - marginalia-gestalt.html, production-figures-gestalt.html — review pages over the figure registry. docs/lessons-learned.md updated: the bullet claiming "journey pages don't yet render section figures inline" was outdated since commit 64360a4. Replaced with a statement of the shipped behavior plus the contract that enforces it. 59 tests pass; prototype index regenerates without the 8 deleted entries.
1 parent 4605ab8 commit a824593

11 files changed

Lines changed: 2 additions & 450 deletions

docs/lessons-learned.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -110,5 +110,5 @@ git diff --check
110110
- **Tag-above vs tag-inside is a layout decision driven by stacking.** `object_box(tag_position="above")` is natural for an isolated box; `tag_position="inside"` is required when boxes stack vertically with less than ~13px of gap (the tag's footprint). Defaults to `"above"` for the common isolated case; stacked callers opt in. The grammar carries the choice, not the caller's hand-positioned `tag()` call.
111111
- **Mono character alignment uses the font's advance, not eyeballed pixels.** JetBrains Mono advances ~6px per char at fs=10. A dashed line marking the `/` at index 12 of `def f(a, b, /, c, d): …` lives at `x=12*6+3=75`, not `x=82`. Hand-tuned positions drift; computed positions match the rendered glyph.
112112
- **Lines must terminate AT elements, not in their gaps or interiors.** A 1.5px gap between a tree edge and a leaf dot reads as "the tree is disconnected" (the `exception-group-peel` bug). A line endpoint 2px inside a circle reads as "the arrow pierces the node" (the `context-bowtie` bug). When connecting to a dot, end the line at the dot's centre and let the dot draw on top — the visual termination is the circumference, with zero gap or overshoot.
113-
- **Journey pages don't yet render section figures inline.** Production journey pages (`/journeys/<slug>`) currently render the section overview, title, and example list — but no figures. The journey-section figures defined in `scripts/build_prototypes.py JOURNEY_SECTION_FIGURES` only show on the `/prototyping/journey-figures-gestalt` review page. The figures are production-quality and audited, but the rendering surface that would carry them on `www.pythonbyexample.dev` hasn't been built. Open question: do journey pages benefit from inline figures, or do they belong to the lesson pages only?
113+
- **Journey pages render section figures inline.** `SECTION_FIGURES` lives in `src/marginalia.py` (single source of truth, keyed by section title) and `render_for_section(title)` is invoked from `render_journey_page` between each section's meta and its example list. The same paint code that produces the `/prototyping/journey-figures-gestalt` review page renders on production journey pages; drift between the two is structurally impossible. Contract 10 asserts every section in `JOURNEYS` has a figure and every figure name resolves.
114114
- **An explicit comparison loop should iterate over the topic's whole spectrum.** When a cell teaches by doing `for label, value in [(...), (...)]: print(...)`, the bracketed list IS the lesson. Two items is a binary contrast; three items reads as a progression. The strings example presented English (pure ASCII, 1 byte/char) against Thai (3 bytes/char) but skipped the Latin-extended middle (French `café`: 4 code points, 5 bytes — `é` is 2 UTF-8 bytes). Adding the middle row turned the cell from "ASCII vs non-Latin" into "1-byte / 2-byte / 3-byte progression." The rule is narrow — most examples spread categories across cells, which is also a valid pattern — but when a comparison loop exists, fill it with the topic's actual spectrum, not just the endpoints.

public/prototyping/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@
3434
<h1>Visual explainer prototypes</h1>
3535
<p class="meta">Real example pages with their attached figures, plus the design-review pages. The example pages all use the production layout: a cell with an attached figure stacks prose, figure, and code vertically; cells without figures keep today's prose|code grid.</p>
3636
</section>
37-
<ul class="prototype-list"><li><a class="text-link" href="/prototyping/marginalia-gestalt.html"><strong>Marginalia gestalt</strong></a><p class="meta">Every journey and example as a card, drawn from the shared grammar. Pure design review.</p></li><li><a class="text-link" href="/prototyping/journey-figures-gestalt.html"><strong>Journey-figures gestalt</strong></a><p class="meta">All journey section figures on one page, grouped by journey, for uniform rubric review.</p></li><li><a class="text-link" href="/prototyping/production-figures-gestalt.html"><strong>Production figures gestalt</strong></a><p class="meta">Every figure currently registered in src/marginalia.py FIGURES, with a tag showing where it renders (example attachment, journey section, or unattached).</p></li><li><a class="text-link" href="/prototyping/operators-polish-comparison.html"><strong>Operators alignment polish</strong></a><p class="meta">Side-by-side before/after for the tree-edge alignment fix; demonstrates Canvas.connect().</p></li><li><a class="text-link" href="/prototyping/layout-banner-single.html"><strong>Layout · banner between cells</strong></a><p class="meta">The grammar: cells stay 2-column always; figures live in banner rows BETWEEN cells. Holds one figure here. The intended union of Tufte/Knuth/algebrica.</p></li><li><a class="text-link" href="/prototyping/layout-banner-pair.html"><strong>Layout · banner with small-multiples pair</strong></a><p class="meta">Same grammar with two figures in the banner — a Tufte small-multiple. The mutable list and the immutable tuple side by side, captioned, between the same pair of cells.</p></li><li><a class="text-link" href="/prototyping/layout-banner-trio.html"><strong>Layout · multiple banners across the walkthrough</strong></a><p class="meta">The grammar at scale: a single-figure banner before the walkthrough, a pair-banner between two cells, a single-figure summary after the last cell. Multiple diagrams; cells never displaced.</p></li><li><a class="text-link" href="/prototyping/journey-runtime.html"><strong>Journey · Runtime</strong></a><p class="meta">Programs run statements, names refer to objects, expressions become method calls.</p></li><li><a class="text-link" href="/prototyping/journey-control-flow.html"><strong>Journey · Control Flow</strong></a><p class="meta">Branches choose paths; the figure depicts a value flowing through a predicate to one of several branches.</p></li><li><a class="text-link" href="/prototyping/journey-iteration.html"><strong>Journey · Iteration</strong></a><p class="meta">Loops repeat; the protocol behind for is iter() then next() until exhausted.</p></li><li><a class="text-link" href="/prototyping/journey-shapes.html"><strong>Journey · Shapes</strong></a><p class="meta">Containers answer different questions; reshaping is the everyday move; text becomes structured data.</p></li><li><a class="text-link" href="/prototyping/journey-interfaces.html"><strong>Journey · Interfaces</strong></a><p class="meta">Functions are named behavior; functions are values; classes bundle state with behavior.</p></li><li><a class="text-link" href="/prototyping/journey-types.html"><strong>Journey · Types</strong></a><p class="meta">Annotations describe but don&#x27;t enforce; unions cover alternatives; generics preserve shape across calls.</p></li><li><a class="text-link" href="/prototyping/journey-reliability.html"><strong>Journey · Reliability</strong></a><p class="meta">Failure is explicit; resources have boundaries; concurrency outlives single expressions.</p></li><li><a class="text-link" href="/prototyping/journey-workers.html"><strong>Journey · Workers</strong></a><p class="meta">Workers-specific journey added on main; section figures pending design.</p></li></ul>
37+
<ul class="prototype-list"><li><a class="text-link" href="/prototyping/marginalia-gestalt.html"><strong>Marginalia gestalt</strong></a><p class="meta">Every journey and example as a card, drawn from the shared grammar. Pure design review.</p></li><li><a class="text-link" href="/prototyping/journey-figures-gestalt.html"><strong>Journey-figures gestalt</strong></a><p class="meta">All journey section figures on one page, grouped by journey, for uniform rubric review.</p></li><li><a class="text-link" href="/prototyping/production-figures-gestalt.html"><strong>Production figures gestalt</strong></a><p class="meta">Every figure currently registered in src/marginalia.py FIGURES, with a tag showing where it renders (example attachment, journey section, or unattached).</p></li><li><a class="text-link" href="/prototyping/operators-polish-comparison.html"><strong>Operators alignment polish</strong></a><p class="meta">Side-by-side before/after for the tree-edge alignment fix; demonstrates Canvas.connect().</p></li><li><a class="text-link" href="/prototyping/layout-banner-single.html"><strong>Layout · banner between cells</strong></a><p class="meta">The grammar: cells stay 2-column always; figures live in banner rows BETWEEN cells. Holds one figure here. The intended union of Tufte/Knuth/algebrica.</p></li><li><a class="text-link" href="/prototyping/layout-banner-pair.html"><strong>Layout · banner with small-multiples pair</strong></a><p class="meta">Same grammar with two figures in the banner — a Tufte small-multiple. The mutable list and the immutable tuple side by side, captioned, between the same pair of cells.</p></li><li><a class="text-link" href="/prototyping/layout-banner-trio.html"><strong>Layout · multiple banners across the walkthrough</strong></a><p class="meta">The grammar at scale: a single-figure banner before the walkthrough, a pair-banner between two cells, a single-figure summary after the last cell. Multiple diagrams; cells never displaced.</p></li></ul>
3838
</article>
3939

4040
</body>

public/prototyping/journey-control-flow.html

Lines changed: 0 additions & 44 deletions
This file was deleted.

0 commit comments

Comments
 (0)