Implementation of i18n with documentation #49

Merged
tonitch merged 1 commits from tonitch/front/i18n into master 2024-03-02 20:08:03 +01:00
3 changed files with 100 additions and 0 deletions

View File

@ -0,0 +1,8 @@
# English translations (some examples to remove)
login.guest.login=log in
login.guest.register=register
login.guest.welcome=Please Register here
login.success=You are now registered as $name
#=====================================================

View File

@ -0,0 +1,8 @@
# Traductions françaises (Quelques examples a enlever)
login.guest.login=s'identifier
login.guest.register=s'enregistrer
login.guest.welcome=Veuillez vous enregistrer ici
login.success=Vous êtes maintenant identifié comme $name
#=====================================================

84
frontend/src/i18n.js Normal file
View File

@ -0,0 +1,84 @@
/**
* Usage:
* import i18n from './i18n.js'
*
* console.log( i18n('parentcontext.childcontext.key', {user: username}) );
*
* language is loaded from cookie: lang=XX
* translations are loaded from /public/i18n/XX.txt
*
*/
const default_lang = "EN";
let langs;
/**
* Fetch the translation from a key using the current language.
* could also replace certain value of the form `$variable` by providing an object
* with { variable: "value" }
* @param key :string translation key (can be null)
* @param options: Object element to replace in the translation
*
* @return :string The translated text
*/
function i18n(key, options) {
let ret = langs[key];
if(options != null){
for (let key in options) {
ret = ret.replaceAll("$" + key, options[key]);
}
}
return ret;
}
async function reloadLang(){
langs = await loadLangs();
}
reloadLang();
export default i18n;
//
// Those functions are utility functions use by previous exported functions.
//
/**
* Return the content of a cookie with specified key
* @param key cookie name
*/
function getCookie(key){
key = key + "="
let cookies = decodeURIComponent(document.cookie).split(";");
for (let el of cookies) {
el = el.trimStart();
if(el.indexOf(key) == 0){
return el.substr(key.length, el.length);
}
}
return "";
}
/**
* Function that load the file with translation from the specified lang and return a dictionnary
* @param select the language to load. could be null to fetch the cookies for an answer
* if nothing is found. default to EN.txt
*/
async function loadLangs(lang){
lang = lang != null ? lang : getCookie("lang");
lang = lang != "" ? lang : default_lang;
const filename = "./i18n/" + lang.toUpperCase() + ".txt";
const content = await (await fetch(filename)).text();
const lines = content.split("\n");
let filteredLines = {};
for (let line of lines) {
if(!line.trim().startsWith("#") && line.trim() != ""){
let split = line.indexOf("=")
filteredLines[line.substr(0, split)] = line.substr(split+1, line.length);
};
}
return filteredLines;
}