diff --git a/options/options.js b/options/options.js index 9c625c13..5a6bcc2e 100644 --- a/options/options.js +++ b/options/options.js @@ -13,14 +13,22 @@ async function init() { for (let i = 0; i < optionsElements.length; i++) { switch (optionsElements[i].getAttribute("option-type")) { case "toggle": - chrome.storage.sync.get([optionsElements[i].getAttribute("toggle-sync-option")], function(result) { - let optionResult = result[optionsElements[i].getAttribute("toggle-sync-option")]; + let option = optionsElements[i].getAttribute("toggle-sync-option"); + chrome.storage.sync.get([option], function(result) { + let optionResult = result[option]; if (optionResult != undefined) { - optionsElements[i].querySelector("input").checked = optionResult; + let checkbox = optionsElements[i].querySelector("input"); + checkbox.checked = optionResult; - if (optionsElements[i].getAttribute("toggle-type") == "reverse") { + let reverse = optionsElements[i].getAttribute("toggle-type") === "reverse"; + + if (reverse) { optionsElements[i].querySelector("input").checked = !optionResult; } + + checkbox.addEventListener("click", () =>{ + optionToggled(option, reverse ? !checkbox.checked : checkbox.checked) + }); } checksLeft--; @@ -35,4 +43,16 @@ async function init() { optionsContainer.style.display = "inherit"; optionsContainer.classList.add("animated"); +} + +/** + * Called when an option has been toggled. + * + * @param {HTMLElement} element + */ +function optionToggled(option, value) { + console.log(option) + console.log(value) + + chrome.storage.sync.set({[option]: value}); } \ No newline at end of file