support per-language fonts (for Japanese etc)

iNavFlight · Dec 2, 2024 · da5703d · da5703d
1 parent 87a3042
commit da5703d
Show file tree

Hide file tree

Showing 9 changed files with 29 additions and 57 deletions.
diff --git a/index.html b/index.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html>
+<html i18n_lang="currentLanguage">
 
 <head>
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
@@ -384,4 +384,4 @@ <h2 class="groundstation-telemetry__header" data-i18n="gsTelemetry"></h2>
     </div>
 </body>
 
-</html>
+</html>
diff --git a/js/localization.js b/js/localization.js
@@ -173,6 +173,11 @@ i18n.localize = function (reTranslate = false) {
             const element = $(this);
             element.attr('placeholder', translate(element.attr('i18n_placeholder')));
         });
+
+        $('[i18n_lang]').each(function() {
+            const element = $(this);
+            element.attr('lang', translate(element.attr('i18n_lang')));
+        });
     } else {
 
         $('[i18n]:not(.i18n-replaced)').each(function() {
@@ -234,6 +239,13 @@ i18n.localize = function (reTranslate = false) {
             element.attr('placeholder', translate(element.attr('i18n_placeholder')));
             element.addClass('i18n_placeholder-replaced');
         });
+
+        $('[i18n_lang]:not(.i18n_lang-replaced)').each(function() {
+            const element = $(this);
+            element.attr('lang', translate(element.attr('i18n_lang')));
+            element.addClass('i18n_lang-replaced');
+        });
+
     }
 
     return localized;

diff --git a/locale/en/messages.json b/locale/en/messages.json
@@ -6152,5 +6152,8 @@
     },
     "adsbHeartbeatTotalMessages": {
         "message": "Heartbeat msgs"
+    },
+    "currentLanguage": {
+        "message": "en"
     }
 }
diff --git a/locale/uk/messages.json b/locale/uk/messages.json
@@ -5926,5 +5926,8 @@
     },
     "adsbHeartbeatTotalMessages": {
         "message": "Повід. сигналів перевірки"
+    },
+    "currentLanguage": {
+        "message": "uk"
     }
 }
diff --git a/src/css/main.css b/src/css/main.css
@@ -2332,4 +2332,8 @@ ol li {
 
 .bold {
     font-weight: bold;
-}
+}
+
+*:lang(ja) {
+  font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
+}
diff --git a/src/css/tabs/motors.css b/src/css/tabs/motors.css
@@ -464,17 +464,3 @@
 .tab-motors .config-section .number input {
     margin-right: 4px;
 }
-
-.tab-motors .mixerPreview {
-  position: relative;
-}
-
-.tab-motors .motorNumber {
-    position: absolute;
-    font-size: 1.4em;
-    visibility: hidden;
-}
-
-.tab-motors .mixer-preview-image-numbers {
-    width: fit-content;
-}
diff --git a/tabs/mixer.js b/tabs/mixer.js
@@ -476,7 +476,6 @@ TABS.mixer.initialize = function (callback, scrollPosition) {
                 $("#motorNumber"+index).css("left", left_px + "px");
                 $("#motorNumber"+index).css("top", top_px + "px");
                 $("#motorNumber"+index).removeClass("is-hidden");
-                $("#motorNumber"+index).css("visibility", "visible");
             }
         }
     }
@@ -545,7 +544,7 @@ TABS.mixer.initialize = function (callback, scrollPosition) {
             }
 
         }
-       labelMotorNumbers();
+        labelMotorNumbers();
        i18n.localize();;
     }
 
@@ -611,6 +610,7 @@ TABS.mixer.initialize = function (callback, scrollPosition) {
                 }
 
             }
+
             return (errorCount == 0);
         }
 
@@ -661,6 +661,7 @@ TABS.mixer.initialize = function (callback, scrollPosition) {
             const path = './resources/motor_order/'
                 + currentMixerPreset.image + (isReversed ? "_reverse" : "") + '.svg';
             $('.mixerPreview img').attr('src', path);
+
             renderServoOutputImage();
         };
 

diff --git a/tabs/outputs.html b/tabs/outputs.html
@@ -117,11 +117,7 @@
                 <div class="motors right">
                     <div class="half">
                         <div class="mixerPreview">
-                            <img src="./resources/motor_order/custom.svg" id="motor-mixer-preview-img" />
-                                <div class="motorNumber" id="motorNumber1">1</div>
-                                <div class="motorNumber" id="motorNumber2">2</div>
-                                <div class="motorNumber" id="motorNumber3">3</div>
-                                <div class="motorNumber" id="motorNumber4">4</div>
+                            <img src="./resources/motor_order/custom.svg" />
                         </div>
                     </div>
                     <div class="half">

diff --git a/tabs/outputs.js b/tabs/outputs.js
@@ -257,7 +257,6 @@ TABS.outputs.initialize = function (callback) {
         const path = './resources/motor_order/'
             + mixer.getById(val).image + (isReversed ? "_reverse" : "") + '.svg';
         $('.mixerPreview img').attr('src', path);
-        labelMotorNumbers();
     }
 
     function process_servos() {
@@ -718,38 +717,6 @@ TABS.outputs.initialize = function (callback) {
         GUI.content_ready(callback);
     }
 
-   function labelMotorNumbers() {
-
-       if (mixer.getById(FC.MIXER_CONFIG.appliedMixerPreset).image != 'quad_x') {
-           return;
-       }
-
-
-        let index = 0;
-        var rules = FC.MOTOR_RULES.get();
-
-        for (const i in rules) {
-            if (rules.hasOwnProperty(i)) {
-                const rule = rules[i];
-                index++;
-
-                let top_px = 30;
-                let left_px = 28;
-                if (rule.getRoll() < -0.5) {
-                  left_px = $("#motor-mixer-preview-img").width() - 20;
-                }
-
-                if (rule.getPitch() > 0.5) {
-                  top_px = $("#motor-mixer-preview-img").height() - 20;
-                }
-                $("#motorNumber"+index).css("left", left_px + "px");
-                $("#motorNumber"+index).css("top", top_px + "px");
-                $("#motorNumber"+index).css("visibility", "visible");
-            }
-        }
-    }
-
-
 };
 
 TABS.outputs.cleanup = function (callback) {