feat(mobile): Add FAB widgets with info display around toggle button

- Add 8-position widget system around mobile FAB button (N, NE, E, SE, S, SW, W, NW)
- Display weather icon, weather description, time, date, location around FAB
- Show stats and RPG attributes in larger West/Northwest positions
- Add animated clock face matching main panel design
- Implement expandable text on hover/tap for truncated content
- Add FAB spinner animation during API requests
- Respect tracker preset settings for filtering displayed stats/attributes
- Sync FAB data with lastGeneratedData for real-time updates
- Hide FAB widgets on desktop viewport (>1000px) and when panel is open
- Add settings UI for enabling/disabling individual widget types
- Update FAB widgets on manual edits in tracker editor and stats panels
This commit is contained in:
tomt610
2026-01-10 13:18:34 +00:00
parent f5641ec1f0
commit 73cbb27713
11 changed files with 936 additions and 5 deletions
+11
View File
@@ -58,6 +58,17 @@ export let extensionSettings = {
top: 'calc(var(--topBarBlockSize) + 60px)',
right: '12px'
}, // Saved position for mobile FAB button
// Mobile FAB widget display options (8-position system around the button)
mobileFabWidgets: {
enabled: false, // Master toggle for FAB widgets
weatherIcon: { enabled: false, position: 0 }, // Weather emoji (☀️, 🌧️, etc.)
weatherDesc: { enabled: false, position: 1 }, // Weather description text
clock: { enabled: false, position: 2 }, // Current time display
date: { enabled: false, position: 3 }, // Date display
location: { enabled: false, position: 4 }, // Location name
stats: { enabled: false, position: 5 }, // All stats as compact numbers
attributes: { enabled: false, position: 6 } // Compact RPG attributes display
},
userStats: JSON.stringify({
stats: [
{ id: 'health', name: 'Health', value: 100 },