update and rework translation code

diff --git a/i18n.js b/i18n.js
index d946c63ddd0831e10f85f676213732ba3e05cb14..458ca41502d427a27d0a6c9f6cbbd10cb2709c23 100644 (file)
--- a/i18n.js
+++ b/i18n.js
@@ -20,7 +20,11 @@ var translations = {
                'tr-rootfs-help': 'Das Root Dateisystem als separates Abbild.',
                'tr-sdcard-help': 'Image für SD Speicherkarten.',
                'tr-tftp-help': 'TFTP Dateien können verwendet werden, um ein Gerät über die TFTP Method des Bootloader zu flashen.',
-               'tr-other-help': 'Sonstiger Imagetyp.'
+               'tr-other-help': 'Sonstiger Imagetyp.',
+               'tr-build-successful': 'Build erfolgreich',
+               'tr-build-failed': 'Build fehlgeschlagen',
+               'tr-request-image': 'Frage nach image',
+               'tr-check-again': 'Nochmal nachfragen in 5 Sekunden...'
        },
        'en': {
                'tr-load': 'Download OpenWrt firmware for your device!',
@@ -42,7 +46,11 @@ var translations = {
                'tr-rootfs-help': 'Root file system as a separate image.',
                'tr-sdcard-help': 'Image that is meant to be flashed onto a SD-Card.',
                'tr-tftp-help': 'TFTP images are used to flash a device via the TFTP method of the bootloader.',
-               'tr-other-help': 'Other image type.'
+               'tr-other-help': 'Other image type.',
+               'tr-build-successful': 'Build successful',
+               'tr-build-failed': 'Build failed',
+               'tr-request-image': 'Request image',
+               'tr-check-again': 'Check again in 5 seconds...'
        }
 };
 

diff --git a/index.html b/index.html
index e7fe1ea1dae006179e4ef5fe1f0fe9384c15eb2e..90563b40522b702a0cf89e9ae7d4f5efaff0ce39 100644 (file)
--- a/index.html
+++ b/index.html
@@ -16,7 +16,7 @@
                <img src="logo.png" alt="Logo">
                <div style="flex-grow: 1;"></div>
 
-               <select id="language-selection" onchange="applyLanguage(this.children[this.selectedIndex].value);" size="1">
+               <select id="language-selection" onchange="current_language=this.children[this.selectedIndex].value; translate();" size="1">
                        <option value="en">English</option>
                        <option value="de">Deutsch</option>
                </select>

diff --git a/index.js b/index.js
index 1bdc30f3146d0fd4cbb4ba405be5a016ff4188dd..4cdf9e295dafc29f817f2769fec800d6e5c2dec5 100644 (file)
--- a/index.js
+++ b/index.js
@@ -37,6 +37,7 @@ function build_asa_request() {
   function showStatus(text) {
     show('buildstatus');
     $('buildstatus').innerHTML = text;
+    translate();
   }
 
   function handleError(response) {
@@ -44,7 +45,7 @@ function build_asa_request() {
 
     response.json()
       .then(mobj => {
-        var message = mobj['message'] || 'Build Failed';
+        var message = mobj['message'] || '<span class="tr-build-failed"></span>';
         if (mobj.buildlog == true) {
           var url = config.asu_url + '/store/' + mobj.bin_dir + '/buildlog.txt';
           showStatus('<a href="' + url + '">' + message + '</a>');
@@ -58,7 +59,7 @@ function build_asa_request() {
   updateImages();
 
   show('buildspinner');
-  showStatus('Request image...');
+  showStatus('<span class="tr-request-image></span>');
 
   var request_data = {
     'profile': current_model.id,
@@ -75,7 +76,7 @@ function build_asa_request() {
     switch (response.status) {
       case 200:
         hide('buildspinner');
-        showStatus('Build successful');
+        showStatus('<span class="tr-build-successful"></span>');
 
         response.json()
         .then(mobj => {
@@ -91,7 +92,7 @@ function build_asa_request() {
         });
         break;
       case 202:
-        showStatus('Check again in 5 seconds...');
+        showStatus('<span class="tr-check-again"></span>');
         setTimeout(_ => { build_asa_request() }, 5000);
         break;
       case 400: // bad request
@@ -135,17 +136,11 @@ function setupSelectList(select, items, onselection) {
 }
 
 // Change the translation of the entire document
-function applyLanguage(language) {
-  if (language) {
-    current_language = language;
-  }
-
+function translate() {
   var mapping = translations[current_language];
-  if (mapping) {
-    for (var tr in mapping) {
-      Array.from(document.getElementsByClassName(tr))
+  for (var tr in mapping) {
+    Array.from(document.getElementsByClassName(tr))
       .forEach(e => { e.innerText = mapping[tr]; })
-    }
   }
 }
 
@@ -345,7 +340,7 @@ function updateImages(version, code, date, model, url, mobj, is_custom) {
       switchClass('downloads-title', 'tr-custom-downloads', 'tr-version-downloads');
     }
     // update title translation
-    applyLanguage();
+    translate();
 
     // fill out build info
     $('image-model').innerText = model;
@@ -393,4 +388,4 @@ if (config.asu_url) {
 
 // hide fields
 updateImages();
-applyLanguage(config.language);
+translate();