2 Commits

Author	SHA1	Message	Date
Lucas 'Paperboy' Rose-Winters	122bb3194a	feat(dashboard): add auto-layout button with smart widget packing ... Implements intelligent auto-layout system that efficiently arranges widgets to maximize space usage while respecting panel width constraints. **Key Features:** - Smart packing algorithm that sorts by widget area and finds optimal positions - Respects responsive column count (2-4 columns based on panel width) - Prefers full-width widgets when possible to eliminate gaps - Fallback to narrower widths for better vertical packing - Maintains minimum widget sizes **Implementation:** - GridEngine.autoLayout() - Core packing algorithm with collision detection - DashboardManager.autoLayoutWidgets() - High-level API that re-renders after layout - Auto-Arrange button in dashboard header (uses fa-table-cells-large icon) - Event handler wired to call autoLayoutWidgets with preferFullWidth=true **Algorithm Strategy:** 1. Sort widgets by area (largest first) for efficient packing 2. For each widget, try full-width placement first 3. Find first available position using row-by-row scan 4. If position is too far down, try narrower widths 5. Mark cells as occupied to prevent overlaps **Testing Notes:** - Works with current responsive column system (2-4 columns) - Respects minimum sizes and column constraints - Re-renders all widgets after repositioning - Auto-saves layout changes Part of Epic 2: Dashboard Widget Library	2025-10-23 14:00:00 +11:00
Lucas 'Paperboy' Rose-Winters	fa53616d4f	feat(dashboard): implement grid engine core (Task 1.1) ... Implement GridEngine class with core grid layout functionality: - 12-column responsive grid system with configurable row height - Grid ↔ pixel coordinate conversion (getPixelPosition, snapToCell) - Rectangle intersection collision detection - Auto-reflow algorithm to push overlapping widgets down - Widget validation and grid height calculation - Comprehensive visual test harness with drag-and-drop Technical Details: - Pure vanilla JavaScript ES6 module - No dependencies - Fully documented with JSDoc - Manual calculations verified: column width 87px, snap accuracy 100% Test Harness Features: - Interactive 12-column grid visualization - Draggable test widgets with real-time collision detection - Console logging captured in UI - Stats panel (widget count, collisions, grid height) - Test buttons for reflow and collision verification Acceptance Criteria Met: ✓ Grid engine converts grid ↔ pixel coordinates accurately ✓ Collision detection works for all widget sizes ✓ Reflow pushes widgets down correctly when overlapping ✓ Snap-to-grid works including edge cases ✓ No console errors Epic 1, Task 1.1 Complete (3-4 day estimate)	2025-10-23 08:56:00 +11:00