From ab9e3cc4e030ff5a45b19dd2dca32352492d10e4 Mon Sep 17 00:00:00 2001
From: Darren Lines <darren@darrenlines.uk>
Date: Wed, 20 Apr 2022 10:43:15 +0100
Subject: [PATCH] Craft name enhancments

- Moved craft name to OSD page
- OSD preview matches actual craft name
- Only accept usable characters and symbols
---
 _locales/en/messages.json | 12 +++--------
 src/css/tabs/osd.css      |  2 +-
 tabs/configuration.html   | 16 ---------------
 tabs/configuration.js     | 30 ---------------------------
 tabs/osd.html             |  4 ++++
 tabs/osd.js               | 43 +++++++++++++++++++++++++++++++++++++++
 6 files changed, 51 insertions(+), 56 deletions(-)

diff --git a/_locales/en/messages.json b/_locales/en/messages.json
index 6674c216..0d31e2ce 100755
--- a/_locales/en/messages.json
+++ b/_locales/en/messages.json
@@ -1037,15 +1037,6 @@
     "configurationSPIProtocol": {
         "message": "RX SPI protocol"
     },
-    "configurationPersonalization": {
-        "message": "Personalization"
-    },
-    "configurationCraftName": {
-        "message": "Craft Name"
-    },
-    "configurationCraftNameHelp": {
-        "message": "Craft name. Can be displayed by OSD and by compatible RC systems."
-    },
     "configurationEepromSaved": {
         "message": "EEPROM <span style=\"color: #37a8db\">saved</span>: Configuration"
     },
@@ -2967,6 +2958,9 @@
     "osd_video_format": {
         "message" : "Video Format"
     },
+    "osd_craft_name": {
+        "message" : "Craft Name"
+    },
     "osd_units": {
         "message" : "Units"
     },
diff --git a/src/css/tabs/osd.css b/src/css/tabs/osd.css
index 0f881fe7..89db9aef 100644
--- a/src/css/tabs/osd.css
+++ b/src/css/tabs/osd.css
@@ -403,7 +403,7 @@ button {
     font-family: 'open_sansregular', 'Segoe UI', Tahoma, sans-serif;
 }
 
-.spacer_box div input {
+.spacer_box div input[type="radio"] {
     margin-right: 5px;
 }
 
diff --git a/tabs/configuration.html b/tabs/configuration.html
index 98870dae..f7f08b9e 100644
--- a/tabs/configuration.html
+++ b/tabs/configuration.html
@@ -103,22 +103,6 @@
                 </div>
             </div>
 
-            <div class="config-section gui_box grey config-personalization">
-                <div class="gui_box_titlebar">
-                    <div class="spacer_box_title" data-i18n="configurationPersonalization"></div>
-                </div>
-                <div class="spacer_box">
-                    <div class="string">
-                        <input maxlength="16" id="craft_name" name="craft_name" />
-                        <label for="craft_name">
-                            <span data-i18n="configurationCraftName"></span>
-                        </label>
-                        <div class="helpicon cf_tip" data-i18n_title="configurationCraftNameHelp"></div>
-                    </div>
-                </div>
-            </div>
-
-
             <div class="config-section gui_box grey config-vtx">
                 <div class="gui_box_titlebar">
                     <div class="spacer_box_title" data-i18n="configurationVTX"></div>
diff --git a/tabs/configuration.js b/tabs/configuration.js
index c57bdd6e..57224023 100644
--- a/tabs/configuration.js
+++ b/tabs/configuration.js
@@ -10,23 +10,6 @@ TABS.configuration.initialize = function (callback, scrollPosition) {
         googleAnalytics.sendAppView('Configuration');
     }
 
-    var craftName = null;
-    var loadCraftName = function (callback) {
-        if (!CONFIG.name || CONFIG.name.trim() === '') {
-            mspHelper.getCraftName(function (name) {
-                craftName = name;
-                callback();
-            });
-        } else {
-            craftName = CONFIG.name;
-            callback();
-        }
-    };
-
-    var saveCraftName = function (callback) {
-        mspHelper.setCraftName(craftName, callback);
-    };
-
     var loadChainer = new MSPChainerClass();
 
     var loadChain = [
@@ -40,7 +23,6 @@ TABS.configuration.initialize = function (callback, scrollPosition) {
         mspHelper.loadMixerConfig,
         mspHelper.loadBoardAlignment,
         mspHelper.loadCurrentMeterConfig,
-        loadCraftName,
         mspHelper.loadMiscV2
     ];
 
@@ -60,7 +42,6 @@ TABS.configuration.initialize = function (callback, scrollPosition) {
         mspHelper.saveVTXConfig,
         mspHelper.saveBoardAlignment,
         mspHelper.saveCurrentMeterConfig,
-        saveCraftName,
         mspHelper.saveMiscV2,
         saveSettings,
         mspHelper.saveToEeprom
@@ -290,15 +271,6 @@ TABS.configuration.initialize = function (callback, scrollPosition) {
         $('#3ddeadbandlow').val(REVERSIBLE_MOTORS.deadband_low);
         $('#3ddeadbandhigh').val(REVERSIBLE_MOTORS.deadband_high);
         $('#3dneutral').val(REVERSIBLE_MOTORS.neutral);
-        
-        // Craft name
-        if (craftName != null) {
-            $('.config-personalization').show();
-            $('input[name="craft_name"]').val(craftName);
-        } else {
-            // craft name not supported by the firmware
-            $('.config-personalization').hide();
-        }
 
         $('a.save').click(function () {
             MISC.mag_declination = parseFloat($('#mag_declination').val());
@@ -324,8 +296,6 @@ TABS.configuration.initialize = function (callback, scrollPosition) {
 
             SENSOR_ALIGNMENT.align_mag = parseInt(orientation_mag_e.val());
 
-            craftName = $('input[name="craft_name"]').val();
-
             googleAnalytics.sendEvent('Setting', 'I2CSpeed', $('#i2c_speed').children("option:selected").text());
 
             googleAnalytics.sendEvent('Board', 'Accelerometer', $('#sensor-acc').children("option:selected").text());
diff --git a/tabs/osd.html b/tabs/osd.html
index a87db33e..45ae0687 100644
--- a/tabs/osd.html
+++ b/tabs/osd.html
@@ -53,6 +53,10 @@
                     </div>
                     <div class="spacer_box">
                         <div class="settings">
+                            <label class="craft_name">
+                                <input type="text" id="craft_name" data-setting="name" data-live="true" />
+                                <span data-i18n="osd_craft_name"></span>
+                            </label>
                             <label class="units">
                                 <select id="unit_mode" name="unit_mode"></select>
                                 <span data-i18n="osd_units"></span>
diff --git a/tabs/osd.js b/tabs/osd.js
index c8c16940..1f2d181d 100644
--- a/tabs/osd.js
+++ b/tabs/osd.js
@@ -492,6 +492,7 @@ OSD.DjiElements =  {
         "PowerLimits"
     ],
     supportedSettings: [
+        "craft_name",
         "units"
     ],
     supportedAlarms: [
@@ -2482,6 +2483,7 @@ OSD.GUI.updateFields = function() {
 
      // Update the OSD preview
      refreshOSDSwitchIndicators();
+     updateCraftName();
 };
 
 OSD.GUI.removeBottomLines = function(){
@@ -2501,6 +2503,8 @@ OSD.GUI.removeBottomLines = function(){
     });
 };
 
+
+
 OSD.GUI.updateDjiMessageElements = function(on) {
     $('.display-field').each(function(index, element) {
         var name = $(element).find('input').attr('name');
@@ -2862,6 +2866,21 @@ TABS.osd.initialize = function (callback) {
             refreshOSDSwitchIndicators();
         });
 
+        // Function for when text for craft name changes
+        $('#craft_name').on('keyup', function() {
+            // Make sure that the craft name only contains A to Z, 0-9, spaces, and basic ASCII symbols
+            let testExp = new RegExp('^[A-Za-z0-9 !_,:;=@#\\%\\&\\-\\*\\^\\(\\)\\.\\+\\<\\>\\[\\]]');
+            let testText = $(this).val();
+            if (testExp.test(testText.slice(-1))) {
+                $(this).val(testText.toUpperCase());
+            } else {
+                $(this).val(testText.slice(0, -1));
+            }
+
+            // Update the OSD preview
+            updateCraftName();
+        });
+
         // font preview window
         var $preview = $('.font-preview');
 
@@ -3024,6 +3043,30 @@ function refreshOSDSwitchIndicators() {
     OSD.GUI.updatePreviews();
 }
 
+function updateCraftName() {
+    let generalGroup = OSD.constants.ALL_DISPLAY_GROUPS.filter(function(e) {
+        return e.name == "osdGroupGeneral";
+      })[0];
+
+
+    if ($('#craft_name').val() != undefined) {
+        for (let si = 0; si < generalGroup.items.length; si++) {
+            if (generalGroup.items[si].name == "CRAFT_NAME") {
+                let craftNameText = $('#craft_name').val();
+                
+                if (craftNameText == "") {
+                    generalGroup.items[si].preview = "CRAFT_NAME";
+                } else {
+                    generalGroup.items[si].preview = craftNameText;
+                }
+                break;
+            }
+        }
+    }
+
+    OSD.GUI.updatePreviews();
+}
+
 TABS.osd.cleanup = function (callback) {
     PortHandler.flush_callbacks();