1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
|
# Electric Flux and Charge Implementation Plan
**Goal:** Build an interactive 3D lesson for the only enabled subject in `PLAN.md`, with an extensible model interface.
**Architecture:** A TypeScript application shell loads models from a registry. Each model owns its controls, lesson, state, and disposable Three.js scene. Pure SI-unit physics is independent of rendering and localization. One English catalog supplies all interface text.
**Tech stack:** Existing Vite, TypeScript, Three.js, and KaTeX dependencies; Node >=22.12.0.
**References:** `PLAN.md`, `AGENTS.md`, and `docs/theory/3Electric flux and charge.pdf`, especially sections 3.2–3.4.
## Constraints and decisions
- Implement only electric flux and charge. Keep excluded subjects and deleted tests absent.
- Work in the supplied checkout, preserving existing edits and unrelated deletions.
- Do not create test scripts, per the user's explicit request. Use type checking, a production build, and direct runtime inspection.
- Use English as default and fallback, with typed message keys, parameterized messages, and locale-aware numbers. No language selector.
- Use a point charge in vacuum and a closed sphere or cube centered at the origin. Let charge position vary along x; explain the finite visual charge marker and qualitative arrows.
- Compute total flux analytically using Gauss's law. A nonzero charge exactly on the boundary gives an undefined result, not a misleading finite value.
- Native sliders, buttons, checkboxes, camera keyboard shortcuts, and a text summary make the experiment operable without a mouse.
## Tasks
- [x] Create build configuration, app shell, typed model lifecycle and registry, and English localization.
- [x] Implement pure point-charge field, surface membership, and enclosed-charge/flux calculations.
- [x] Implement the 3D surface, signed field arrows, movable charge, orbit camera, toggles, and presets; add live measurements and explanations.
- [x] Add responsive styling, keyboard operation, WebGL fallback, and developer documentation for adding models/locales.
- [x] Run type checking and production build; inspect browser behavior and fix observed issues without adding test scripts.
## Review focus
Zero/negative charge, boundary singularity, moving outside a surface, switching surface shape, resetting all controls, keyboard input, narrow screens, rendering unavailable, and scene disposal.
## Verification record
- `npm run build`: TypeScript and Vite production build passed. Vite reports a size warning for the Three.js vendor chunk (about 562 kB minified, 139 kB gzip); the model is loaded lazily.
- Direct Chromium inspection (no test files created): +2 nC gives +225.9 N·m²/C; −2 nC gives −225.9; an external charge gives zero. Changing sphere radius from 1.8 m to 3 m and switching to a cube preserves total flux. A nonzero charge exactly on the boundary is undefined; zero charge on that boundary gives zero.
- Reset restores the initial values and layers. Native slider keyboard input and camera arrow keys work. Desktop and 768, 390, and 320 px layouts have no horizontal page overflow. No browser page errors observed.
- Forced WebGL unavailability shows a useful message and preserves working numerical controls.
- A separate read-only code review found secondary text contrast issues. These were fixed, with the affected text now measuring 4.73:1–5.26:1. No other important findings.
- Unrelated deletions, staged user changes, `PLAN.md`, and `package.json` were preserved. Fresh application entry points were created as required by the task. No tests, test configuration, or lockfile were restored.
|