Commit 39511468 authored by Luc Didry's avatar Luc Didry
Browse files

Add i18n system

parent f7f2a360
Pipeline #24352 passed with stage
in 21 seconds
......@@ -34,7 +34,7 @@
<label for="corners">Corner shape</label>
<select id="corners">
<option value="20" selected>Rounded corners</option>
<option value="0" selected>Square corners</option>
<option value="0">Square corners</option>
</select>
</div>
<div class="three columns">
......
......@@ -25,10 +25,65 @@ var domIsReady = (function(domIsReady) {
})(domIsReady || {});
var svg = new C2S(800,400);
var showSettings = 'Show advanced settings';
var hideSettings = 'Hide advanced settings';
(function(document, window, domIsReady, undefined) {
domIsReady(function() {
// Try to get a translation
var userLang = navigator.language || navigator.userLanguage;
console.log(userLang);
var xhr = new XMLHttpRequest();
xhr.open('GET', 'locales/'+userLang+'.json');
xhr.responseType = 'json';
xhr.onload = function() {
if (xhr.readyState == 4 && xhr.status === 200) {
var locale = xhr.response;
console.log(locale);
['wemake', 'porn', 'filename', 'corners', 'wemake-color', 'porn-color', 'rect-color', 'bg-type', 'color', 'bgr-color', 'egr-color', 'wemake-x', 'wemake-y', 'wemake-size', 'porn-x', 'porn-y', 'porn-size'].forEach(function(e) {
if (locale[e] !== undefined) {
document.querySelector('label[for="'+e+'"]').innerText = locale[e];
}
});
if (locale['corners-rounded'] !== undefined) {
document.querySelector('#corners option[value="20"]').innerText = locale['corners-rounded'];
}
if (locale['corners-square'] !== undefined) {
document.querySelector('#corners option[value="0"]').innerText = locale['corners-square'];
}
['plain', 'gradient', 'rainbow', 'lr', 'rl', 'tb', 'bt', 'r'].forEach(function(e) {
if (locale[e] !== undefined) {
document.querySelector('option[value="'+e+'"]').innerText = locale[e];
}
});
['toggle-svg', 'download', 'reset'].forEach(function(e) {
if (locale[e] !== undefined) {
document.querySelector('#'+e).innerText = locale[e];
if (e === 'download') {
document.querySelector('#download-svg').innerText = locale[e];
}
}
});
if (document.getElementById('settings-block').classList.contains('hidden')) {
if (locale['settings-show'] !== undefined) {
document.querySelector('#settings').innerText = locale['settings-show'];
}
} else if (locale['settings-hide'] !== undefined) {
document.querySelector('#settings').innerText = locale['settings-hide'];
}
if (locale['settings-show'] !== undefined) {
showSettings = locale['settings-show'];
}
if (locale['settings-hide'] !== undefined) {
hideSettings = locale['settings-hide'];
}
if (locale['footer'] !== undefined) {
document.querySelector('footer p').innerHTML = locale['footer'];
}
}
};
xhr.send();
// Trigger drawing
document.querySelectorAll('input[type="text"]').forEach(function(e) {
e.addEventListener('keyup', function() {
......@@ -94,10 +149,10 @@ var svg = new C2S(800,400);
var b = document.getElementById('settings-block');
if (b.classList.contains('hidden')) {
b.classList.remove('hidden');
this.text = 'Hide advanced settings';
this.text = hideSettings;
} else {
b.classList.add('hidden');
this.text = 'Show advanced settings';
this.text = showSettings;
}
});
......
{
"wemake": "Première ligne",
"porn": "Seconde ligne",
"filename": "Nom du fichier",
"corners": "Forme des coins",
"corners-rounded": "Coins arrondis",
"corners-square": "Coins droits",
"wemake-color": "Couleur de la première ligne",
"porn-color": "Couleur de la seconde ligne",
"rect-color": "Couleur du rectangle",
"bg-type": "Type de fond",
"plain": "Couleur unie",
"gradient": "Dégradé de couleurs",
"rainbow": "Drapeau arc-en-ciel",
"color": "Couleur de fond",
"bgr-color": "Première couleur du dégradé",
"egr-color": "Seconde couleur du dégradé",
"gr-orientation": "Orientation du dégradé",
"lr": "De gauche à droite",
"rl": "De droite à gauche",
"tb": "De haut en bas",
"bt": "De bas en haut",
"r": "Radial",
"wemake-x": "Abscisse de la première ligne",
"wemake-y": "Ordonnée de la première ligne",
"wemake-size": "Taille du texte de la première ligne",
"porn-x": "Abscisse de la seconde ligne",
"porn-y": "Ordonnée de la seconde ligne",
"porn-size": "Taille du texte de la seconde ligne",
"toggle-svg": "Travailler en SVG",
"download": "Télécharger",
"reset": "Réinitialiser les paramètres",
"settings-show": "Afficher les paramètres",
"settings-hide": "Cacher les paramètres",
"footer": "WemaWema, créé par <a href=\"https://fiat-tux.fr\">Luc Didry</a>, licensié sous les termes de l'AGPLv3. Récupérez les <a href=\"https://framagit.org/luc/wemawema\">sources</a>.<br>Montrez votre support à l'auteur sur <a href=\"https://liberapay.com/sky/\">Liberapay</a> ou <a href=\"https://www.tipeee.com/fiat-tux\">Tipeee</a> !"
}
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment