diff --git a/src/systems/dashboard/widgets/infoBoxWidgets.js b/src/systems/dashboard/widgets/infoBoxWidgets.js index 829a690..7ba58fd 100644 --- a/src/systems/dashboard/widgets/infoBoxWidgets.js +++ b/src/systems/dashboard/widgets/infoBoxWidgets.js @@ -550,7 +550,40 @@ export function registerRecentEventsWidget(registry, dependencies) { * @param {Object} config - Widget configuration */ render(container, config = {}) { - const { getInfoBoxData } = dependencies; + const { getInfoBoxData, getExtensionSettings } = dependencies; + + // Check if Recent Events is enabled in tracker config + const settings = getExtensionSettings(); + const trackerConfig = settings.trackerConfig; + const isEnabled = trackerConfig?.infoBox?.widgets?.recentEvents?.enabled !== false; + + // If disabled, show helpful message + if (!isEnabled) { + const html = ` +
+
+
+
+
+
+
+
Recent Events
+
+ +

Recent Events tracking is currently disabled.

+ +
+
+
+ `; + container.innerHTML = html; + attachDisabledStateHandlers(container); + return; + } + const data = parseInfoBoxData(getInfoBoxData()); // Merge default config with user config @@ -767,3 +800,31 @@ function updateRecentEvent(eventIndex, value, dependencies) { console.log(`[Recent Events Widget] Updated event ${eventIndex}: "${value}"`); } + +/** + * Attach handlers for disabled widget state + * Opens Tracker Settings when "Enable" button is clicked + * @private + */ +function attachDisabledStateHandlers(container) { + const enableBtn = container.querySelector('.rpg-widget-enable-btn'); + if (enableBtn) { + enableBtn.addEventListener('click', () => { + // Open Tracker Settings modal + const trackerSettingsBtn = document.querySelector('#rpg-open-tracker-editor'); + if (trackerSettingsBtn) { + trackerSettingsBtn.click(); + + // After modal opens, switch to Info Box tab + setTimeout(() => { + const infoBoxTab = document.querySelector('.rpg-editor-tab[data-tab="infoBox"]'); + if (infoBoxTab) { + infoBoxTab.click(); + } + }, 100); + } else { + console.warn('[Recent Events Widget] Tracker Settings button not found'); + } + }); + } +} diff --git a/style.css b/style.css index 5cafea4..0382110 100644 --- a/style.css +++ b/style.css @@ -2776,6 +2776,72 @@ body:has(.rpg-panel.rpg-position-left) #sheld { opacity: 1; } +/* Widget Disabled State */ +.rpg-widget-disabled { + position: relative; + opacity: 0.6; + pointer-events: none; +} + +.rpg-widget-disabled-message { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + text-align: center; + padding: 1rem; + pointer-events: all; + z-index: 10; + width: 80%; +} + +.rpg-widget-disabled-message i.fa-circle-info { + font-size: 2rem; + color: var(--rpg-highlight); + margin-bottom: 0.5rem; + display: block; + opacity: 0.8; +} + +.rpg-widget-disabled-message p { + color: var(--rpg-text); + font-size: 0.875rem; + margin: 0.5rem 0; + opacity: 0.9; + line-height: 1.4; +} + +.rpg-widget-enable-btn { + background: var(--rpg-accent); + color: white; + border: none; + border-radius: 0.375rem; + padding: 0.5rem 1rem; + font-size: 0.8125rem; + cursor: pointer; + transition: all 0.2s ease; + display: inline-flex; + align-items: center; + gap: 0.5rem; + margin-top: 0.5rem; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); +} + +.rpg-widget-enable-btn:hover { + background: var(--rpg-highlight); + transform: translateY(-1px); + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); +} + +.rpg-widget-enable-btn:active { + transform: translateY(0); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); +} + +.rpg-widget-enable-btn i { + font-size: 1rem; +} + /* ============================================================================ Scene Info Grid Widget Compact information-dense layout showing all scene data at once