Commit 69eed4b
committed
Implement pulsing glow indicators and smart dialog positioning for active graph elements
## New Features
- **Pulsing Glow Effects**: Added bright green pulsing glow to highlight active dialog elements
- Nodes pulse when menu is open with 'dialog-glow' SVG filter
- Edges pulse with stronger 'edge-dialog-glow' filter when relationship dropdown or details dialog is active
- 12px thick edges and 8px thick node borders during active dialogs for maximum visibility
- **Smart Dialog Positioning**: Dialogs now position themselves to avoid obstructing the glow effects
- Edge details dialog appears 100px to the side of clicked edge
- Relationship dropdown appears 120px to the side with intelligent boundary detection
- Both dialogs automatically flip to opposite side if they would go off-screen
- **Intelligent Dropdown Auto-Positioning**: Relationship dropdowns detect off-screen positioning
- Uses DOM measurements with getBoundingClientRect() for precision
- Gradually slides dropdowns back into view with smooth CSS transitions
- Maintains 20px margins from all screen edges
## Enhanced User Experience
- **Consistent Visual Feedback**: Both edge interactions (clicking line vs clicking label) show identical thick line + glow effects
- **Improved Dialog Management**: All dialogs now properly close on background click with backdrop handlers
- **Physics-Aware Styling**: Glow effects persist through D3 simulation ticks and zoom operations
- **Non-Permanent Changes**: Edge thickness automatically resets when dialogs close
## Technical Implementation
- Created separate SVG filters for nodes (15px-35px blur) and edges (25px-50px blur) with pulsing animations
- Added React useEffect-based glow management that works alongside D3.js physics simulation
- Implemented backdrop click handlers for consistent dialog dismissal behavior
- Enhanced background click logic to handle multiple dialog types (nodeMenu, edgeMenu, editingEdge, showEdgeDetails)1 parent 3ecbd44 commit 69eed4b
2 files changed
Lines changed: 372 additions & 48 deletions
0 commit comments