37 lines
1.8 KiB
TypeScript
37 lines
1.8 KiB
TypeScript
import { loadSettings, saveSettings } from "../shared/settings";
|
|
import type { FilterMode, Settings } from "../shared/types";
|
|
import "./style.css";
|
|
|
|
const form = document.querySelector<HTMLFormElement>("#settings");
|
|
const threshold = document.querySelector<HTMLInputElement>("#threshold");
|
|
const thresholdValue = document.querySelector<HTMLElement>("#threshold-value");
|
|
const mode = document.querySelector<HTMLSelectElement>("#filter-mode");
|
|
const showScore = document.querySelector<HTMLInputElement>("#show-score");
|
|
const status = document.querySelector<HTMLElement>("#status");
|
|
|
|
void loadSettings().then((settings) => {
|
|
threshold!.value = String(settings.threshold);
|
|
mode!.value = settings.filterMode;
|
|
showScore!.checked = settings.showScore;
|
|
for (const site of ["reddit", "twitter", "facebook"] as const) document.querySelector<HTMLInputElement>(`#site-${site}`)!.checked = settings.enabledSites[site];
|
|
updateThresholdLabel();
|
|
});
|
|
|
|
threshold?.addEventListener("input", updateThresholdLabel);
|
|
form?.addEventListener("submit", async (event) => {
|
|
event.preventDefault();
|
|
const settings: Partial<Settings> = {
|
|
threshold: Number(threshold?.value), filterMode: mode?.value as FilterMode, showScore: showScore?.checked,
|
|
enabledSites: {
|
|
reddit: document.querySelector<HTMLInputElement>("#site-reddit")!.checked,
|
|
twitter: document.querySelector<HTMLInputElement>("#site-twitter")!.checked,
|
|
facebook: document.querySelector<HTMLInputElement>("#site-facebook")!.checked
|
|
}
|
|
};
|
|
await saveSettings(settings);
|
|
if (status) { status.textContent = "Saved"; setTimeout(() => { status.textContent = ""; }, 1500); }
|
|
});
|
|
|
|
function updateThresholdLabel(): void {
|
|
if (thresholdValue && threshold) thresholdValue.textContent = `${Math.round(Number(threshold.value) * 100)}%`;
|
|
}
|