56 lines
1.1 KiB
Plaintext
56 lines
1.1 KiB
Plaintext
---
|
|
/*!
|
|
* © 2023 Nikita Karamov
|
|
* Licensed under AGPL v3 or later
|
|
*/
|
|
import { languages } from "@i18n/translations";
|
|
|
|
const initialLanguage = "en";
|
|
---
|
|
|
|
<div>
|
|
<span data-translate="language">Language:</span>
|
|
<select
|
|
name="language"
|
|
id="language"
|
|
>
|
|
{
|
|
Object.entries(languages).map(([k, v]) => {
|
|
return (
|
|
<option
|
|
selected={k === initialLanguage}
|
|
value={k}
|
|
>
|
|
{v}
|
|
</option>
|
|
);
|
|
})
|
|
}
|
|
</select>
|
|
</div>
|
|
|
|
<script>
|
|
import { findBestLanguage } from "@i18n/engine";
|
|
import { applyTranslations } from "@i18n/engine";
|
|
import { $locale } from "@stores/i18n";
|
|
|
|
const select: HTMLSelectElement = document.querySelector("#language")!;
|
|
|
|
document.addEventListener("DOMContentLoaded", () => {
|
|
$locale.subscribe((newLocale) => {
|
|
if (newLocale === undefined) {
|
|
newLocale = findBestLanguage();
|
|
}
|
|
|
|
applyTranslations(newLocale);
|
|
if (select.value !== newLocale) {
|
|
select.value = newLocale;
|
|
}
|
|
});
|
|
|
|
select.addEventListener("change", (event) => {
|
|
$locale.set((event.target as typeof select).value);
|
|
});
|
|
});
|
|
</script>
|