1
0
Fork 0
VaultUI/src/pages/SetLanguage.ts
2021-05-12 17:37:09 +01:00

72 lines
2.1 KiB
TypeScript

import { Margin } from "../elements/Margin";
import { Page } from "../types/Page";
import { changePage, setPageContent } from "../pageUtils";
import { makeElement } from "../htmlUtils";
import { pageState } from "../globalPageState";
import { reloadNavBar } from "../elements/NavBar";
import i18next from "i18next";
// @ts-ignore
import translations from "../translations/index.mjs";
const languageIDs = Object.getOwnPropertyNames(translations);
export class SetLanguagePage extends Page {
constructor() {
super();
}
async render(): Promise<void> {
const setLanguageForm = makeElement({
tag: "form",
id: "setLanguageForm",
children: [
Margin(
makeElement({
tag: "select",
class: ["uk-select", "uk-form-width-large"],
attributes: {
name: "language",
},
children: languageIDs.map(function (languageID) {
return makeElement({
tag: "option",
text: i18next.getFixedT(languageID, null)("language_name"),
attributes: { value: languageID },
});
}),
}),
),
makeElement({
tag: "p",
id: "errorText",
class: "uk-text-danger",
}),
makeElement({
tag: "button",
class: ["uk-button", "uk-button-primary"],
text: i18next.t("set_language_btn"),
attributes: {
type: "submit",
},
}),
],
}) as HTMLFormElement;
setPageContent(setLanguageForm);
setLanguageForm.addEventListener("submit", function (e) {
e.preventDefault();
const formData = new FormData(setLanguageForm);
const language = formData.get("language") as string;
pageState.language = language;
console.log(pageState.language);
void i18next.changeLanguage(language).then((t) => {
pageState.pageDirection = t("language_direction");
reloadNavBar();
void changePage("HOME");
});
});
}
get name(): string {
return i18next.t("set_language_title");
}
}