v0.0.4.0 feat(module-2): tam giác đồng dạng (lớp 8, scale slider)

[tiennm99]

Summary

Third interactive theorem demo: Module 2 — Tam giác đồng dạng, live at /lop-8/tam-giac-dong-dang/. With this PR, all three MVP modules from the autoplan plan are live — Hình Học Sống has its hero curriculum.

What changed

Module 2 (the killer moment): a single range slider drives k ∈ [0.5, 2] step 0.05. Fixed △ABC on the left; △A′B′C′ on the right is recomputed each frame as centroid_target + k · (vertex − centroid_ABC). Three ratio readouts (AB/A′B′, BC/B′C′, CA/C′A′) show the same number, regardless of k. That numerical-equality-under-scaling IS similarity, made visible in one gesture.

Files:

• src/components/similarity-scale.ts — slider controller. Single input event listener; no Pointer Events here. AbortController teardown on astro:before-swap.
• src/pages/lop-8/tam-giac-dong-dang.astro — page at viewBox 400×300, hub-style layout. Left triangle's tick marks rendered once on mount (static); right triangle's redrawn on every input.
• i18n/vi.ts extended with module2.* strings + lop-8.href/status flipped to live.

Encoding (Decision D3, same as Module 1):

• AB / A′B′ → pair1 #D7263D + 1 tick
• BC / B′C′ → pair2 #1B998B + 2 ticks
• CA / C′A′ → pair3 #F46036 + 3 ticks

Build observation

With three canvas pages now in the build, Astro extracts shared geom-engine chunks (vec.js ~441B, triangle.js ~288B) instead of inlining per-page scripts. Per-page scripts are now 2–3.6KB, cached after first visit. Net result: total JS for any page < 4KB, and visiting a second module is faster (shared chunks already cached). Documented in CHANGELOG.

Test Coverage

No new geom-engine logic in this PR — Module 2 reuses triangle.sides() and vec.scale/sub/add. Existing 39 tests still pass; coverage unchanged.

Tests: 39 pass (16 vec + 13 circle + 10 triangle). No new tests.

The math being demonstrated (similar triangles have proportional sides + equal angles) is implicit in vec.scale's definition; the unit tests for scale already cover it.

Pre-Landing Review

No critical findings. INFORMATIONAL:

• Module 2 ships scale-slider mode only (autoplan plan's BONUS variant). Free-vertex-drag mode with AA/SAS/SSS đồng dạng detectors deferred to v0.0.5.0+ (P2 in TODOS.md). Rationale: scale-slider gives the strongest "wow" in one gesture and ships in a weekend; free-drag is a separate UI surface with its own detector module.
• Numeric angle readouts (∠A, ∠B, ∠C and primes) deferred to P3. Currently the angle-invariance is pinned in prose ("các góc tại A, B, C không thay đổi"). Numeric readouts add reassurance but aren't load-bearing for the MVP demo.
• The static A/B/C circles in the page markup are decorative (not draggable). Distinct from the dynamic A'/B'/C' which are repositioned by the controller. Astro hint count went 0 → 3 because the static labels don't have data-vertex-label="..." (they're not referenced by the script). Non-issue.

Adversarial Review (Claude inline, Codex unavailable)

Checked: slider clamped to [0.5, 2.0] so k cannot reach 0 (autoplan eng failure mode #3). Number.isFinite(k) guards the parsed value before update. 1/k ratio computation cannot divide by zero given the clamp. Static triangle 1 vertices are inline literals matching the component's A/B/C constants — if those drift, the static SVG will visibly misalign with the controller's expectations; the static positions and the constants should ideally be a single source of truth, but for one-pair-of-numbers it's overkill to wire that up now (called out in CHANGELOG implicitly).

Plan Completion (vs autoplan plan)

• Module 2 (Tam giác đồng dạng) — was deferred to weekend 4; now done
• Scale slider clamped to [0.5, 2.0] (autoplan failure mode v0.0.3.0 feat(module-1): drag-to-explore tam giác bằng nhau (lớp 7, SSS) #3)
• Live ratio readouts (the killer-demo property)
• SGK tick-mark encoding paired with 3-color palette (D3 reuse)
• All 3 MVP modules from autoplan now live (Module 1, 2, 3)
• Free-drag mode with AA/SAS/SSS đồng dạng detectors — P2
• Numeric angle readouts — P3
• More worked examples — P3 across all modules
• Visual regression baselines — P2 (covers all three modules)

Documentation

CHANGELOG entry for 0.0.4.0 written. TODOS.md: 2 P1 items moved to Completed (scale slider, similarity-ratio readout). Module 2 section reduced to remaining P2/P3 items. VERSION + package.json bumped together.

Test plan

• bun run test && bun run typecheck && bun run build clean locally
• All 39 Vitest tests pass
• Astro check: 0 errors / 0 warnings / 3 hints (decorative-vs-controlled SVG element distinction; informational)
• Build produces 4 pages (+ sitemap)
• Per-page JS bundle 2–3.6KB; shared geom-engine chunks ~730B total
• CI workflow on this PR
• Deploy on merge
• Manual: drag the slider in a real browser, confirm all 3 ratios stay numerically equal as k changes

🤖 Generated with Claude Code