Lucas 'Paperboy' Rose-Winters
b5d35ac2b0
Add comprehensive debug logging system that's accessible on mobile devices
where browser console is impractical.
**New Features:**
- Debug mode toggle in extension settings (🔍 Debug Mode)
- Mobile-friendly debug panel with slide-up UI
- Red bug FAB button to toggle debug log viewer
- Copy logs to clipboard functionality
- Auto-scrolling log display with timestamps
- Stores last 100 log entries to prevent memory issues
**Parser Enhancements:**
- All parser logs now use debugLog() helper function
- Logs only appear in UI when debug mode is enabled
- Console.log still works for desktop debugging
- Full visibility into parsing pipeline:
- Raw AI response preview
- Code blocks found and matched
- Stats extraction (health, energy, mood, etc.)
- Inventory parsing (v1 and v2)
- Final values saved to settings
**UI Components:**
- src/systems/ui/debug.js: Debug panel creation and management
- style.css: Mobile-first debug panel styles (FAB + slide-up panel)
- Desktop view: Smaller panel in bottom-right corner
**Settings:**
- src/core/config.js: Added debugMode default (false)
- src/core/state.js: Added debug logs storage array
- settings.html: Added debug mode checkbox
- index.js: Wire up debug toggle and initialize UI
**Usage for Mobile Users:**
1. Enable "Debug Mode" in RPG Companion settings
2. Red bug button appears (bottom-left)
3. Tap bug button to view logs
4. Use "Copy" to share logs for troubleshooting
5. Logs show exactly what AI generated and how parser handled it
This addresses the issue where users on mobile can't access browser
console to diagnose parsing problems (vanishing attributes, placeholder
characters, etc.). Now they can view and share logs directly.
31 lines
1.7 KiB
HTML
31 lines
1.7 KiB
HTML
<div>
|
|
<div class="inline-drawer">
|
|
<div class="inline-drawer-toggle inline-drawer-header">
|
|
<b><i class="fa-solid fa-dice-d20"></i> RPG Companion</b>
|
|
<div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
|
|
</div>
|
|
<div class="inline-drawer-content">
|
|
<label class="checkbox_label" for="rpg-extension-enabled">
|
|
<input type="checkbox" id="rpg-extension-enabled" />
|
|
<span>Enable RPG Companion</span>
|
|
</label>
|
|
<small class="notes">Toggle to enable/disable the RPG Companion extension. Configure additional settings within the panel itself.</small>
|
|
|
|
<label class="checkbox_label" for="rpg-debug-mode" style="margin-top: 10px;">
|
|
<input type="checkbox" id="rpg-debug-mode" />
|
|
<span>🔍 Debug Mode (Mobile-Friendly)</span>
|
|
</label>
|
|
<small class="notes">Enable debug logging visible in UI. Useful for troubleshooting parsing issues on mobile devices. Shows a red bug button to view parser logs.</small>
|
|
|
|
<div style="margin-top: 10px; display: flex; gap: 10px;">
|
|
<a href="https://discord.com/invite/KdAkTg94ME" target="_blank" class="menu_button" style="flex: 1; text-align: center; text-decoration: none;">
|
|
<i class="fa-brands fa-discord"></i> Discord
|
|
</a>
|
|
<a href="https://ko-fi.com/marinara_spaghetti" target="_blank" class="menu_button" style="flex: 1; text-align: center; text-decoration: none;">
|
|
<i class="fa-solid fa-heart"></i> Support Creator
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|