const Options = {
    init: async () => {
        let html = await fetch('/lib/pages/options/index.html').then((response) => response.text());
        app.innerHTML = html;

        await Options.optionPush.init();
        Options.optionFont.init();
    },
    optionPush: {
        init: async () => {
            const element = document.getElementById("page-options-notifications");
            const permission = await Notification.requestPermission();

            if (!('serviceWorker' in navigator) || !('PushManager' in window) || permission !== 'granted') {
                element.disabled = true;
                return;
            }

            const registration = await navigator.serviceWorker.ready;
            let subscription = await registration.pushManager.getSubscription();

            if (subscription) {
                element.checked = true;
            } else {
                element.checked = false;
            }
        },
        edit: (state) => {
            if (state) {
                webPush.init();
            } else {
                webPush.unsubscribe();
            }
        }
    },
    optionFont: {
        init: () => {
            const element = document.getElementById("page-options-fontSize");

            let fontSize = localStorage.getItem("fontSize")
                ? localStorage.getItem("fontSize")
                : 'medium';

            element.value = fontSize;
        },
        edit: (mode) => {
            localStorage.setItem("fontSize", mode);
            applyFontMode(mode);
        }
    }
}