How rapabru/sag.calculator works
SAG Calculator is a browser-based slackline rigging calculator. Users adjust a rig and person configuration, calculate static sag and clearance plus leash and backup-fall outcomes, then inspect the plotted profile and results. The app also supports saved local presets, change-based history with optional Supabase account sync, multilingual UI, guided onboarding, and image/PDF-oriented export. The graph follows documented capability boundaries; omitted source excerpts mean some UI wiring is represented only where explicit evidence exists.
Main entry points: App.tsx App shell · index.ts Calculation coordinator · storage.ts History storage · SagChart.tsx Sag chart
Components 23
Calculator interface
- App shell
src/App.tsx - Rig controls
src/App.tsx - Result panels
src/components/ResultsPanel.tsx - Sag chart
src/components/SagChart.tsx - Chart geometry
src/components/chartGeometry.ts - Export tools
src/components/exportImage.ts - Welcome guide
src/components/GuideTour.tsx - History panel
src/components/HistoryPanel.tsx
Rig physics
- Calculation coordinator
src/physics/index.ts - Static sag solver
src/physics/staticSolver.ts - Leash fall solver
src/physics/fallSolver.ts - Backup fall solver
src/physics/backupFallSolver.ts - Tree anchor model
src/physics/treeAnchorSolver.ts
Saved data
- History storage
src/history/storage.ts - Browser storage
src/history/storage.ts - Preset storage
src/presets/storage.ts
Account and language
- Account button
src/components/AccountButton.tsx - Session state
src/auth/useSession.ts - Supabase service
src/auth/supabase.ts - Remote history
src/history/storage.ts - Language context
src/i18n/LanguageContext.tsx - Locale bundles
src/i18n/locales/en.json
Other components
- Slackline user
Connections 25
- Slackline user → App shell: opens and configures
- App shell → Rig controls: renders
- App shell → Calculation coordinator: calculates
- Rig controls → Calculation coordinator: supplies rig input
- Calculation coordinator → Static sag solver: solves static sag
- Calculation coordinator → Leash fall solver: solves leash fall
- Calculation coordinator → Backup fall solver: solves backup fall
- Calculation coordinator → Tree anchor model: adjusts tree effects
- App shell → Result panels: renders results
- App shell → Sag chart: renders profile
- Sag chart → Chart geometry: computes chart scale
- App shell → Export tools: exports calculation
- App shell → Welcome guide: shows onboarding
- App shell → History storage: loads and records
- History panel → App shell: selects history entry
- App shell → History panel: renders history
- History storage → Browser storage: reads and writes
- App shell → Preset storage: loads and saves presets
- App shell → Account button: renders account action
- Account button → Session state: uses session actions
- Session state → Supabase service: authenticates
- History storage → Supabase service: requests sync client
- History storage → Remote history: syncs history rows
- App shell → Language context: uses translations
- Language context → Locale bundles: selects bundle