options.js

const defaultBlurStrength = 8;

function saveOptions(e) {
    e.preventDefault();
    browser.storage.sync.set({
        blur: document.querySelector("#blurrange").value
    });
}

function restoreOptions() {
    function setCurrentChoice(result) {
        document.querySelector("#blurrange").value = result.blur || defaultBlurStrength;
        document.querySelector("#strength").textContent = result.blur || defaultBlurStrength;
    }

    function onError(error) {
        console.log(`Error: ${error}`);
    }

    let getting = browser.storage.sync.get("blur");
    getting.then(setCurrentChoice, onError);
}

document.addEventListener("DOMContentLoaded", restoreOptions);
document.querySelector("form").addEventListener("submit", saveOptions);
document.querySelector("#blurrange").addEventListener("input", (event) => {
    document.querySelector("#strength").textContent = event.target.value;
});