Merge pull request #2 from suntorytimed/separate_translation_file

Fix disclaimer translation

Author: suntorytimed

templates/disclaimer.html

@@ -53,20 +53,8 @@ <h2 data-i18n="termsOfUseTitle"></h2>
 
     <script src="/static/translations.js"></script>
     <script>
-        var timeoutMinutes = {{ timeout_minutes }};
-        
-        document.addEventListener('DOMContentLoaded', function() {
-            var elements = document.querySelectorAll('[data-i18n="dataStorageText"]');
-            elements.forEach(function(element) {
-                var key = element.getAttribute('data-i18n');
-                var lang = i18n.getCurrentLanguage();
-                if (translations[lang] && translations[lang][key]) {
-                    var text = translations[lang][key];
-                    text = text.replace('{{ timeout_minutes }}', timeoutMinutes);
-                    element.textContent = text;
-                }
-            });
-        });
+        window.timeoutMinutes = {{ timeout_minutes }};
     </script>
+    <script src="/static/translations.js"></script>
 </body>
 </html>

templates/progress.html

@@ -121,7 +121,7 @@ <h2><span data-i18n="status"></span>: <span id="status-text" data-i18n="statusRu
 
             if (reconnectAttempt > 1) {
                 document.getElementById('status-message').textContent = 
-                    `${i18n.translate('connectionLost')} (${i18n.translate('statusSearching')}...)`;
+                    `${i18n.translate('connectionLost')} (${i18n.translate('statusReconnecting')}...)`;
             }
 
             eventSource = new EventSource(`/progress/${jobId}`);
@@ -207,7 +207,7 @@ <h2><span data-i18n="status"></span>: <span id="status-text" data-i18n="statusRu
         function manualReconnect() {
             const statusText = document.getElementById('status-text');
             const statusMessage = document.getElementById('status-message');
-            statusText.textContent = i18n.translate('statusSearching');
+            statusText.textContent = i18n.translate('statusReconnecting');
             statusMessage.textContent = i18n.translate('reconnecting');
 
             reconnectAttempt = 0;

templates/translations.js

@@ -57,7 +57,7 @@ const translations = {
         statusCompleted: "Abgeschlossen",
         statusFailed: "Fehlgeschlagen",
         statusLostConnection: "Verbindung verloren",
-        statusSearching: "Suche nach PDF...",
+        statusReconnecting: "Stelle Verbindung wieder her...",
         statusInProgress: "In Bearbeitung",
         tooltip: "Wenn der Status nicht korrekt angezeigt wird, kann es sein, dass die Konvertierung trotzdem im Hintergrund läuft. Bitte warten Sie einige Minuten und klicken Sie dann auf \"Verbindung wiederherstellen\".",
         startingConversion: "Starte Konvertierung...",
@@ -151,7 +151,7 @@ const translations = {
         statusCompleted: "Completed",
         statusFailed: "Failed",
         statusLostConnection: "Connection lost",
-        statusSearching: "Searching for PDF...",
+        statusReconnecting: "Reconnecting...",
         statusInProgress: "In progress",
         tooltip: "If the status is not displayed correctly, the conversion may still be running in the background. Please wait a few minutes and then click \"Reconnect\".",
         startingConversion: "Starting conversion...",
@@ -214,21 +214,31 @@ const i18n = {
         return translations[lang] && translations[lang][key] ? 
                translations[lang][key] : key;
     },
+
+    replacePlaceholders: function(text) {
+        if (typeof window.timeoutMinutes !== 'undefined') {
+            text = text.replace(/\{\{\s*timeout_minutes\s*\}\}/g, window.timeoutMinutes);
+        }
+
+        return text;
+    },
 
     updatePageContent: function() {
         const lang = this.getCurrentLanguage();
 
         document.querySelectorAll('[data-i18n]').forEach(element => {
             const key = element.getAttribute('data-i18n');
             if (translations[lang] && translations[lang][key]) {
+		            let text = translations[lang][key];
+                text = this.replacePlaceholders(text);
                 if (element.tagName === 'INPUT' || element.tagName === 'TEXTAREA') {
                     if (element.type !== 'checkbox' && element.type !== 'radio') {
-                        element.placeholder = translations[lang][key];
+                        element.placeholder = text;
                     }
                 } else if (element.tagName === 'OPTION') {
-                    element.text = translations[lang][key];
+                    element.text = text;
                 } else {
-                    element.textContent = translations[lang][key];
+                    element.textContent = text;
                 }
             }
         });