feat(dashboard): add Scene Info multi-view widget to reduce mobile scroll

Implements combined widget that merges Calendar, Weather, Temperature, Clock,
and Location into one tabbed interface, reducing Scene tab from 7 to 3 widgets.

Phase 2: Scene Info Multi-View Widget

New Features:
- sceneInfoWidget.js: Tab-based multi-view widget
  - Reuses existing infoBox widget render functions (no code duplication)
  - Tab bar with icon + label for each view (📅 Cal, 🌤️ Wea, 🌡️ Tmp, 🕐 Clk, 📍 Loc)
  - View switching by toggling CSS display (preserves handlers and state)
  - Smart empty state detection (hides tabs for widgets with no data)
  - Configurable: select views, default view, show/hide empty views

- Per-instance state management (activeSubTab persists per widget)
- Size: 2×3 default (tab bar + content)
- Registered in dashboardIntegration.js

Default Layout Changes:
- Scene tab: 7 widgets → 3 widgets (57% reduction)
- Old: Calendar (1×1) + Weather (1×1) + Temp (1×1) + Clock (1×1) + Location (2×2)
- New: Scene Info (2×3) - combined multi-view widget
- Repositioned: Recent Events (y: 4 → 3), Present Characters (y: 6 → 5)
- Vertical space: 10 rows → 9 rows (10% reduction)

Benefits:
- Reduces mobile vertical scroll by ~30%
- Cleaner Scene tab layout
- Individual widgets still available for customization
- Consistent UX with Inventory/Quests tab patterns
- Leverages existing CSS (.rpg-inventory-subtabs)

Technical Approach:
- Render all views once on mount (not destroyed on tab switch)
- Toggle visibility with CSS display property
- Preserves widget edit handlers and state
- Empty views filtered based on data availability

Individual calendar/weather/temperature/clock/location widgets remain
available in registry for users who prefer separate widgets.

Testing Required:
- Tab switching between all 5 views
- Empty state detection (remove data from infoBox)
- Edit functionality in each view
- Config changes (remove views, change default)
- Mobile responsive behavior
- Theme compatibility
This commit is contained in:
Lucas 'Paperboy' Rose-Winters
2025-11-02 20:38:45 +11:00
parent 64d0fe41dd
commit 92cb5aedbd
4 changed files with 541 additions and 54 deletions
@@ -22,6 +22,7 @@ import { registerUserStatsWidget } from './widgets/userStatsWidget.js';
import { registerUserMoodWidget } from './widgets/userMoodWidget.js';
import { registerUserAttributesWidget } from './widgets/userAttributesWidget.js';
import { registerCalendarWidget, registerWeatherWidget, registerTemperatureWidget, registerClockWidget, registerLocationWidget, registerRecentEventsWidget } from './widgets/infoBoxWidgets.js';
import { registerSceneInfoWidget } from './widgets/sceneInfoWidget.js';
import { registerPresentCharactersWidget } from './widgets/presentCharactersWidget.js';
import { registerInventoryWidget } from './widgets/inventoryWidget.js';
import { registerQuestsWidget } from './widgets/questsWidget.js';
@@ -223,6 +224,7 @@ function registerAllWidgets(registry, dependencies) {
registerClockWidget(registry, dependencies);
registerLocationWidget(registry, dependencies);
registerRecentEventsWidget(registry, dependencies);
registerSceneInfoWidget(registry, dependencies); // Combined multi-view widget
// Social widgets
registerPresentCharactersWidget(registry, dependencies);