---
path: /domains/nyx/time-travel
surface: customer
domain: nyx
auth: signed-in
source: apps/oshun/web/src/app/domains/nyx/time-travel/page.tsx
status: walked
last_walked:
  '2026-05-29 automated runtime walk (Playwright headless) — render, /v1 data
  (2xx), console/page-errors, expected content, screenshot verified; live
  screen-reader, touch, offline, and telemetry-delivery checks pending a manual
  AT pass. Evidence: WALKTHROUGH/results/runtime-sweep-2026-05-29.md'
---

# Nyx · Time Travel

## Purpose

Temporal-scrubbing surface — set any date between −4000 and 4000 CE and watch
the sky at that moment, with playback controls, speed presets, and dedicated
tabs for historical events, axial precession demonstrations, and planetary
retrograde motion. Wired via
`apps/oshun/web/src/app/domains/nyx/time-travel/page.tsx` ('use client') which
mounts `<NyxTimeTravel onClose={() => router.back()} />`.

## Entry points

- **Direct URL / bookmark** — yes (signed-in)
- **In-app navigation** — verify Nyx hub link, and any "rewind / fast forward"
  affordance on the star chart
- **Browser back affordance** — in-component back button calls `router.back()`

## Layout regions

`NyxTimeTravel` (`apps/oshun/web/src/components/domains/nyx/NyxTimeTravel.tsx`):

- **Header**: back button (no `aria-label` snippet visible — verify), title
  `<h1>Time Travel</h1>`
- **Tab bar**: four tabs from `TABS` — `Sky View` (`sky`), `Historical Events`
  (`events`), `Precession`, `Retrograde`
- **Sky View tab**:
  - **Date & Time card** — Year (-4000 to 4000), Month, Day, Hour (UT) numeric
    inputs; large display of current year on the right
  - **Playback bar** — `Rev` (backward) / Play/Pause / `Fwd` (forward) / speed
    `<select aria-label="Playback speed">` with `SPEED_PRESETS` (1 sec/s → 1
    month/s) / "Today" preset reset button
  - **Sky Visualization card** — heading "Sky at <full date>" + rendered sky
  - **Preset Buttons card** — historical-date presets

## States

- [ ] **Loading** — bundled simulation data; client-only
- [ ] **Default tab** — `Sky View` with current date (verify initial `activeTab`
      and seed date)
- [ ] **Playing forward** — `isPlaying` true, `direction='forward'`; `Pause`
      shown
- [ ] **Playing backward** — `isPlaying` true, `direction='backward'`
- [ ] **Speed changed** — speed `<select>` updates `speedIndex`; playback rate
      changes
- [ ] **Year at limit** (−4000 or +4000) — clamped via `Math.max/Math.min` in
      the year input
- [ ] **Today preset clicked** — date resets to current `new Date()`
- [ ] **Historical Events tab** — verify event timeline content
- [ ] **Precession tab** — verify visualization
- [ ] **Retrograde tab** — verify retrograde motion display
- [ ] **Offline** — static client bundle; works offline

## Interactions

### Header

- [ ] **Back button** (icon, `ArrowLeft`) — verify exact `aria-label`

### Tab bar (four tabs)

- [ ] **Sky View tab** — sets `activeTab='sky'`
- [ ] **Historical Events tab** — sets `activeTab='events'`
- [ ] **Precession tab** — sets `activeTab='precession'`
- [ ] **Retrograde tab** — sets `activeTab='retrograde'`

### Date & Time inputs

- [ ] **Year input** (number, min −4000 max 4000) —
      `aria-label="Year (-4000     to 4000)"`
- [ ] **Month input** (number, min 1 max 12) — `aria-label="Month"`
- [ ] **Day input** (number, min 1 max 31) — `aria-label="Day"`
- [ ] **Hour input** (number, min 0 max 23) — `aria-label="Hour (UT)"`

### Playback controls

- [ ] **Rev button** (icon, `Rewind`) — sets `direction='backward'`
- [ ] **Play / Pause button** (icon, `Play`/`Pause`)
  - Screen reader: `aria-label="Play" / "Pause"`
  - Function: toggles `isPlaying`
- [ ] **Fwd button** (icon, `FastForward`) — sets `direction='forward'`
- [ ] **Playback speed select** — `aria-label="Playback speed"`
  - Options from `SPEED_PRESETS`: `1 sec/s`, `1 min/s`, `1 hr/s`, `1 day/s`,
    `1 month/s` (and beyond — verify the rest of the list)
- [ ] **"Today" preset button** (icon, `RotateCcw`) — resets via
      `goToPreset({ label: 'Today', year, month, day })`

### Preset buttons card

- [ ] **Each preset** (button) — verify exact list (e.g., Halley's Comet
      apparitions, Battle of Hastings, etc.)

## Data & contracts

- **Reads**: bundled simulation data inside the component (~1700 lines)
- **Writes**: none persisted; state is in-memory
- **Realtime**: in-component playback timer
- **Caching**: static client bundle
- **Auth/role check**: middleware enforces signed-in for `/domains/*`

## Cross-references

- Domain hub: [`nyx.md`](./nyx.md)
- Sibling tools: [`domains-nyx-star-chart.md`](./domains-nyx-star-chart.md)
  (time slider also exists on the star chart, −12 to +12 hours),
  [`domains-nyx-events.md`](./domains-nyx-events.md)
- Component source:
  `apps/oshun/web/src/components/domains/nyx/NyxTimeTravel.tsx`

## Open questions / known gaps

- [ ] Verify back-button `aria-label` (not in the snippet I read)
- [ ] Document the full preset list and where each preset jumps to
- [ ] Confirm whether playback animates continuously while a tab other than
      `Sky View` is active
- [ ] Confirm the relationship between `Time Travel` and the star chart's ±12 h
      slider — should one supersede the other?
