38 lines
1.7 KiB
Markdown
38 lines
1.7 KiB
Markdown
---
|
|
id: TASK-14
|
|
title: 'Overhaul canvas shape creation, connections, and sync'
|
|
status: Done
|
|
assignee: []
|
|
created_date: '2026-02-15 15:28'
|
|
labels:
|
|
- canvas
|
|
- bugfix
|
|
- refactor
|
|
dependencies: []
|
|
priority: high
|
|
---
|
|
|
|
## Description
|
|
|
|
<!-- SECTION:DESCRIPTION:BEGIN -->
|
|
Fixed multiple issues preventing the FolkJS canvas and shapes from working properly.
|
|
<!-- SECTION:DESCRIPTION:END -->
|
|
|
|
## Acceptance Criteria
|
|
<!-- AC:BEGIN -->
|
|
- [ ] #1 Trip shapes (itinerary, destination, budget, packing-list, booking) have position:absolute CSS
|
|
- [ ] #2 Arrow connections work with all 21 shape types, not just markdown and wrapper
|
|
- [ ] #3 New shapes appear at viewport center instead of clustering top-left
|
|
- [ ] #4 Shape creation uses shared createAndAddShape() utility (~270 lines removed)
|
|
- [ ] #5 Google Item toolbar button exists
|
|
- [ ] #6 Remote shape creation has error handling (try-catch-finally)
|
|
- [ ] #7 WebSocket keep-alive ping actually sends a message
|
|
- [ ] #8 Sync layer uses toJSON() to capture all shape-specific properties
|
|
<!-- AC:END -->
|
|
|
|
## Final Summary
|
|
|
|
<!-- SECTION:FINAL_SUMMARY:BEGIN -->
|
|
Fixed 8 issues in canvas.html and community-sync.ts:\n\n1. Added 5 missing trip shapes to CSS position:absolute rule\n2. Expanded arrow connection mode from 2 to all 21 shape types\n3. New shapes now center in viewport (accounting for zoom/pan)\n4. Extracted createAndAddShape() utility, eliminating ~270 lines of duplication\n5. Added missing Google Item toolbar button\n6. Added try-catch-finally on remote shape creation\n7. Implemented actual WebSocket keep-alive ping (was no-op)\n8. Replaced manual property extraction in #shapeToData() with shape.toJSON() for all shape types\n\nNet result: -158 lines (179 added, 337 removed)
|
|
<!-- SECTION:FINAL_SUMMARY:END -->
|