trails-cool/trails
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Implement Planner map UI with collaborative editing (Groups 5+6)

Browse source 
Core Planner experience:
- Full-screen Leaflet map with OSM/OpenTopoMap/CyclOSM layers
- Click to add waypoints, drag to move, right-click to delete
- Waypoint sidebar with reorder, delete, route stats
- Real-time Yjs sync between participants
- Live cursors showing other users' mouse positions on the map

Routing:
- Host election via Yjs awareness (lowest client ID)
- Auto-failover when host disconnects
- Debounced BRouter route computation (500ms)
- Route polyline display from BRouter GeoJSON
- Route stats (distance, elevation gain/loss)

Client-side architecture:
- useYjs hook: WebSocket connection, awareness, document management
- useRouting hook: host election, route computation, stats parsing
- PlannerMap component: Leaflet + Yjs integration
- WaypointSidebar component: list with reorder/delete
- Lazy-loaded components for code splitting

Remaining: elevation chart, profile selector, GPX export (tasks 6.7-6.9)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Ullrich Schäfer 2026-03-23 00:32:51 +01:00
parent 9eee93b27b
commit af70c822ee
No known key found for this signature in database
GPG key ID: A32FF691A0F752D9
8 changed files with 605 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

22
openspec/changes/phase-1-mvp/tasks.md
View file

@ -42,21 +42,21 @@
- [x] 5.1 Implement BRouter HTTP proxy endpoint (POST /api/route → forward to BRouter)
- [x] 5.2 Implement rate limiting middleware (60 requests/session/hour)
- [ ] 5.3 Implement routing host election via Yjs awareness (host/participant roles)
- [ ] 5.4 Implement routing host failover (detect disconnect, elect new host by join timestamp)
- [ ] 5.5 Implement route computation trigger (host watches waypoint changes, debounce 500ms, call BRouter)
- [ ] 5.6 Implement route broadcast (host stores GeoJSON result in Y.Map, syncs to all)
- [x] 5.3 Implement routing host election via Yjs awareness (host/participant roles)
- [x] 5.4 Implement routing host failover (detect disconnect, elect new host by join timestamp)
- [x] 5.5 Implement route computation trigger (host watches waypoint changes, debounce 500ms, call BRouter)
- [x] 5.6 Implement route broadcast (host stores GeoJSON result in Y.Map, syncs to all)
- [ ] 5.7 Implement profile selection (sync profile choice via Y.Map, trigger recompute)
## 6. Planner — Map UI
- [ ] 6.1 Integrate MapView component in Planner with full-screen layout and client-side Yjs connection
- [ ] 6.1a Implement user presence display (Yjs awareness, colors, names, live map cursors)
- [ ] 6.2 Implement waypoint add (click map → add to Y.Array)
- [ ] 6.3 Implement waypoint drag (move marker → update Y.Array)
- [ ] 6.4 Implement waypoint delete (right-click → remove from Y.Array)
- [ ] 6.5 Implement waypoint list sidebar (draggable reorder, synced with Y.Array)
- [ ] 6.6 Implement route polyline display (render GeoJSON from Y.Map)
- [x] 6.1 Integrate MapView component in Planner with full-screen layout and client-side Yjs connection
- [x] 6.1a Implement user presence display (Yjs awareness, colors, names, live map cursors)
- [x] 6.2 Implement waypoint add (click map → add to Y.Array)
- [x] 6.3 Implement waypoint drag (move marker → update Y.Array)
- [x] 6.4 Implement waypoint delete (right-click → remove from Y.Array)
- [x] 6.5 Implement waypoint list sidebar (draggable reorder, synced with Y.Array)
- [x] 6.6 Implement route polyline display (render GeoJSON from Y.Map)
- [ ] 6.7 Implement elevation profile chart (parse elevation from route GeoJSON, render chart)
- [ ] 6.8 Implement profile selector UI (dropdown, synced via Y.Map)
- [ ] 6.9 Implement GPX export button (generate GPX from current waypoints and route)