diff --git a/.utilities/settings-page-builder/script.js b/.utilities/settings-page-builder/script.js index a3d065c..87236ce 100644 --- a/.utilities/settings-page-builder/script.js +++ b/.utilities/settings-page-builder/script.js @@ -17,6 +17,7 @@ const loadSettingsBox = document.getElementById('loadSettingsWrapper'); const unmuteLabel = document.getElementById('unmute-label'); // Global variables +let settingsData = ''; let settingsMap = new Map(); // Construct local storage key prefix so that each widget has their own unique settings @@ -40,6 +41,8 @@ function LoadJSON(settingsJson) { fetch(settingsJson) .then(response => response.json()) .then(data => { + settingsData = data; + // Clear the settings panel settingsPanel.innerHTML = ''; @@ -201,7 +204,7 @@ function LoadJSON(settingsJson) { settingsMap.set(setting.id, settingElement.value); SaveSettingsToStorage(); - RefreshWidgetPreview(data); + RefreshWidgetPreview(); }); settingItemContent.appendChild(inputElement); @@ -233,14 +236,14 @@ function LoadJSON(settingsJson) { } UpdateSettingItemVisibility(); - RefreshWidgetPreview(data); + RefreshWidgetPreview(); SaveSettingsToStorage(); }) .catch(error => console.error('Error loading settings:', error)); } function SaveSettingsToStorage() { - console.log(settingsMap); + console.debug(settingsMap); const settingsArray = Array.from(settingsMap.entries()); const settingsArrayString = JSON.stringify(settingsArray); localStorage.setItem(`${keyPrefix}-settings`, settingsArrayString); @@ -264,9 +267,9 @@ function LoadDefaultSettings() { loadDefaultsBox.style.opacity = 0; } -function RefreshWidgetPreview(data) { +function RefreshWidgetPreview() { const settings = {}; - data.settings.forEach(setting => { + settingsData.settings.forEach(setting => { let inputElement = document.getElementById(setting.id); if (setting.type === 'checkbox') { @@ -411,6 +414,7 @@ function LoadSettings() { inputElement.checked = value.toLocaleLowerCase() == 'true'; else inputElement.value = value; + inputElement.dispatchEvent(new Event('input')); // Triggers the page refresh } }); diff --git a/.utilities/settings-page-builder/style.css b/.utilities/settings-page-builder/style.css index 429973a..bbfbf7e 100644 --- a/.utilities/settings-page-builder/style.css +++ b/.utilities/settings-page-builder/style.css @@ -98,7 +98,10 @@ body { pointer-events: none; font-size: 3em; font-weight: 500; - color: rgba(255, 255, 255, 0.7); + color: rgba(255, 255, 255); + background-color: rgba(255, 255, 255, 0.3); + padding: 0.25em 0.5em; + border-radius: 0.25em; display: none; }