Lokalizace

mdui interně používá angličtinu. Pokud potřebujete jiný jazyk, je nutné nastavit vícejazyčnou konfiguraci.

Způsob použití

mdui nabízí tři funkce pro práci s lokalizací:

• loadLocale: Načte jazykový balíček. Parametrem je funkce, která přijímá kód jazyka jako parametr a vrací Promise. Když je jazykový balíček načten, Promise je vyřešen (resolve) na odpovídající jazykový balíček. Zavolejte tuto funkci ve vstupním souboru projektu.
• setLocale: Přepne na zadaný jazyk. Parametrem je nový kód jazyka, návratovou hodnotou je Promise, který je vyřešen po načtení nového jazykového balíčku.
• getLocale: Získá aktuální kód jazyka.

Příklad použití:

import { loadLocale } from 'mdui/functions/loadLocale.js';
import { setLocale } from 'mdui/functions/setLocale.js';
import { getLocale } from 'mdui/functions/getLocale.js';

// Na vstupu projektu zavolejte loadLocale pro načtení jazykového balíčku
loadLocale((locale) => import(`../node_modules/mdui/locales/${locale}.js`));

// Když potřebujete přepnout jazyk, zavolejte tuto funkci. Po vyřešení (resolve) Promise je přepnutí jazyka dokončeno
setLocale('zh-cn').then(() => {
  // Voláním getLocale získáte aktuální kód jazyka
  console.log(getLocale()); // zh-cn
});

Události stavu

Na začátku, konci a při selhání přepínání jazyka se na window spustí událost mdui-localize-status. Můžete ji poslouchat a provádět vlastní akce, například zapsat kód jazyka do cookie po úspěšném přepnutí jazyka.

Vlastnost detail.status události popisuje, k jaké změně stavu došlo. Možné hodnoty: loading, ready, error:

Příklad použití:

window.addEventListener('mdui-localize-status', (event) => {
  if (event.detail.status === 'loading') {
    console.log(
      `Začíná se načítat nový jazykový balíček: ${event.detail.loadingLocale}`,
    );
  } else if (event.detail.status === 'ready') {
    console.log(
      `Nový jazykový balíček ${event.detail.readyLocale} byl úspěšně načten`,
    );
  } else if (event.detail.status === 'error') {
    console.error(
      `Načtení nového jazykového balíčku ${event.detail.errorLocale} selhalo: ${event.detail.errorMessage}`,
    );
  }
});

Způsoby načtení jazykového balíčku

Líné načítání

Použití dynamického importu umožňuje stáhnout odpovídající jazykový balíček až při přepnutí na daný jazyk. Toto je nejdoporučovanější metoda.

import { loadLocale } from 'mdui/functions/loadLocale.js';

loadLocale((locale) => import(`../node_modules/mdui/locales/${locale}.js`));

Přednačítání

Při načítání stránky se předem stáhnou všechny potřebné jazykové balíčky. To znamená, že při přepínání jazyků není nutné další stahování, což činí přepínání jazyků rychlejším.

import { loadLocale } from 'mdui/functions/loadLocale.js';

const localizedTemplates = new Map([
  ['zh-cn', import(`../node_modules/mdui/locales/zh-cn.js`)],
  ['zh-tw', import(`../node_modules/mdui/locales/zh-tw.js`)],
]);

loadLocale(async (locale) => localizedTemplates.get(locale));

Statický import

Tato metoda umožňuje zabalit všechny potřebné jazykové balíčky do jednoho souboru spolu s kódem vašeho projektu, takže již není nutné stahovat jazykové balíčky samostatně.

import { loadLocale } from 'mdui/functions/loadLocale.js';
import * as locale_zh_cn from 'mdui/locales/zh-cn.js';
import * as locale_zh_tw from 'mdui/locales/zh-tw.js';

const localizedTemplates = new Map([
  ['zh-cn', locale_zh_cn],
  ['zh-tw', locale_zh_tw],
]);

loadLocale(async (locale) => localizedTemplates.get(locale));

Načtení jazykového balíčku přes CDN

Pokud používáte mdui přes CDN, můžete jazykový balíček načíst přímo z CDN. Příklad použití:

<script src="https://unpkg.com/mdui@2/mdui.global.js"></script>

<script>
  mdui.loadLocale(
    (locale) => import(`https://unpkg.com/mdui@2/locales/${locale}.js`),
  );
  mdui.setLocale('zh-cn');
</script>

Podporované jazyky

mdui v současné době podporuje následující jazyky:

Odeslání nového překladu

Chcete-li přispět novým překladem nebo vylepšit stávající překlad, vytvořte prosím Pull Request na Githubu. Jazykové balíčky se nacházejí v packages/mdui/src/xliff. Můžete je upravovat přímo na Githubu.