add automatic enabling and disabling of UI elements based on existence of elements
This commit is contained in:
parent
94b01ea25b
commit
c4e4f5a29b
2 changed files with 40 additions and 2 deletions
|
@ -44,7 +44,8 @@
|
|||
<legend data-text="filters"></legend>
|
||||
<label data-text="settings_filters_description"></label>
|
||||
<div class="field-row action-buttons">
|
||||
<button data-action="filters,update" data-text="settings_filters_update"></button>
|
||||
<button data-action="filters,update" data-text="settings_filters_update"
|
||||
data-enable="filters"></button>
|
||||
<button href="settings/filters" tab-height="607.5" tab-width="1080"
|
||||
data-text="settings_filters_open"></button>
|
||||
</div>
|
||||
|
@ -66,7 +67,8 @@
|
|||
<legend data-text="storage"></legend>
|
||||
<label data-text="settings_storage_description"></label>
|
||||
<div class="field-row action-buttons">
|
||||
<button data-text="settings_storage_clear" data-action="storage,clear"></button>
|
||||
<button data-text="settings_storage_clear" data-enable="sites"
|
||||
data-action="storage,clear"></button>
|
||||
</div>
|
||||
</fieldset>
|
||||
</section>
|
||||
|
|
|
@ -307,9 +307,45 @@ class windowman {
|
|||
links();
|
||||
}
|
||||
|
||||
/*
|
||||
Update the interface based on the storage data changes.
|
||||
*/
|
||||
async function updates() {
|
||||
// Import the module.
|
||||
const secretariat = await import(
|
||||
chrome.runtime.getURL("scripts/secretariat.js")
|
||||
);
|
||||
|
||||
// Get the storage data.
|
||||
let storage_data = await secretariat.read();
|
||||
|
||||
async function update_interface() {
|
||||
let input_elements = document.querySelectorAll("[data-enable]");
|
||||
|
||||
if (input_elements) {
|
||||
input_elements.forEach((input_element) => {
|
||||
(async () => {
|
||||
input_element.disabled =
|
||||
(await secretariat.read(
|
||||
input_element.getAttribute("data-enable"),
|
||||
)) == null;
|
||||
})();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Update the input elements.
|
||||
secretariat.observe((what) => {
|
||||
update_interface();
|
||||
});
|
||||
|
||||
update_interface();
|
||||
}
|
||||
|
||||
storage();
|
||||
functionality();
|
||||
actions();
|
||||
updates();
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue