Continue to implement feature

- Tidied up units label to work with more tabs
- Added more fields in the PID Tuning to use the highlighting
- Converted the Rates tab over to use  data-i18n more. Will make sure all of the PIDs pages use it fully.

_locales/en/messages.json

@@ -1182,6 +1182,12 @@
     "pidTuningYawRate": {
         "message": "YAW rate"
     },
+    "pidTuningRollAndPitchExpo": {
+        "message": "Roll & Pitch Expo"
+    },
+    "pidTuningYawExpo" : {
+        "message": "Yaw Expo"
+    },
     "pidTuningMaxRollAngle": {
         "message": "Max. ROLL angle"
     },
@@ -1204,7 +1210,7 @@
         "message": "Manual YAW rate"
     },
     "magHoldYawRate": {
-        "message": "MagHold rate"
+        "message": "Heading Hold rate limit"
     },
     "pidTuningMagHoldYawRateHelp": {
         "message": "Maximum YAW rotation rate that MagHold controller can request from UAV. Used only when MagHold mode is enabled, during RTH and WAYPOINT navigation. Values below 30dps gives nice \"cinematic\" turns"

js/settings.js

@@ -162,6 +162,10 @@ var Settings = (function () {
             // Angles
             'deg' : '°',
             'decideg' : 'deci°',
+            'decideg-lrg' : 'deci°', // Decidegrees, but always converted to degrees by default
+            // Rotational speed
+            'degps' : '° per second',
+            'decadegps' : 'deca° per second',
             // Temperature
             'decidegc' : 'deci°C',
             'degc' : '°C',
@@ -229,6 +233,12 @@ var Settings = (function () {
             'decideg' : {
                 'deg' : 10
             },
+            'decideg-lrg' : {
+                'deg' : 10
+            },
+            'decadegps' : {
+                'degps' : 0.1
+            },
             'decidegc' : {
                 'degc' : 10,
                 'degf' : 'FAHREN'
@@ -245,7 +255,9 @@ var Settings = (function () {
                 'v-cms' : 'fts',
                 'msec' : 'sec',
                 'dsec' : 'sec',
+                'decadegps' : 'degps',
                 'decideg' : 'deg',
+                'decideg-lrg' : 'deg',
                 'decidegc' : 'degf',
             },
             1: { //metric
@@ -256,7 +268,9 @@ var Settings = (function () {
                 'v-cms' : 'ms',
                 'msec' : 'sec',
                 'dsec' : 'sec',
+                'decadegps' : 'degps',
                 'decideg' : 'deg',
+                'decideg-lrg' : 'deg',
                 'decidegc' : 'degc',
             },
             2: { //metric with MPH
@@ -265,7 +279,9 @@ var Settings = (function () {
                 'm-lrg' : 'km',
                 'cms' : 'mph',
                 'v-cms' : 'ms',
+                'decadegps' : 'degps',
                 'decideg' : 'deg',
+                'decideg-lrg' : 'deg',
                 'msec' : 'sec',
                 'dsec' : 'sec',
                 'decidegc' : 'degc',
@@ -276,7 +292,9 @@ var Settings = (function () {
                 'm-lrg' : 'mi',
                 'cms' : 'mph',
                 'v-cms' : 'fts',
+                'decadegps' : 'degpd',
                 'decideg' : 'deg',
+                'decideg-lrg' : 'deg',
                 'msec' : 'sec',
                 'dsec' : 'sec',
                 'decidegc' : 'degc',
@@ -287,18 +305,25 @@ var Settings = (function () {
                 'm-lrg' : 'nm',
                 'cms': 'kt',
                 'v-cms' : 'hftmin',
+                'decadegps' : 'degps',
                 'decideg' : 'deg',
+                'decideg-lrg' : 'deg',
                 'msec' : 'sec',
                 'dsec' : 'sec',
                 'decidegc' : 'degc',
             },
-            default:{}//show base units
+            default: { //show base units
+                'decadegps' : 'degps',
+                'decideg-lrg' : 'deg',
+            }
         };
 
         //this returns the factor in which to multiply to convert a unit
         const getUnitMultiplier = () => {
-            if (conversionTable[uiUnitValue]){
+            let uiUnits = (uiUnitValue != -1) ? uiUnitValue : 'default';
-                const fromUnits = conversionTable[uiUnitValue];
+
+            if (conversionTable[uiUnits]){
+                const fromUnits = conversionTable[uiUnits];
                 if (fromUnits[inputUnit]){
                     const multiplier = unitRatioTable[inputUnit][fromUnits[inputUnit]];
                     return {'multiplier':multiplier, 'unitName':fromUnits[inputUnit]};
@@ -315,10 +340,16 @@ var Settings = (function () {
 
         // Update the step, min, and max; as we have the multiplier here.
         if (element.attr('type') == 'number') {
-            element.attr('step', ((multiplier != 1) ? '0.01' : '1'));
+            let decimalPlaces = 0;
+            if (multiplier > 1) {
+                element.attr('step', '0.01');
+                decimalPlaces = 2;
+            } else {
+                element.attr('step', (multiplier < 1) ? (multiplier * 100).toFixed(0) : '1');
+            }
             if (multiplier != 'FAHREN') {
-                element.attr('min', (element.attr('min') / multiplier).toFixed(2));
+                element.attr('min', (element.attr('min') / multiplier).toFixed(decimalPlaces));
-                element.attr('max', (element.attr('max') / multiplier).toFixed(2));
+                element.attr('max', (element.attr('max') / multiplier).toFixed(decimalPlaces));
             }
         }
 

main.css

@@ -2232,7 +2232,9 @@ ol li {
 /* Position the unit to the right of the wrapper */
 .unit_wrapper::after {
     position: absolute;
-    top: 2px;
+    /*top: 2px;*/
+    bottom: -2px;
+    height: 100%;
     right: .5em;
     transition: all .05s ease-in-out;
 }

src/css/tabs/pid_tuning.css

@@ -1,11 +1,14 @@
 .rate-tpa_input {
-    margin: 4px;
+    width: 150px;
-    width: 5em;
+    height: 20px;
+    line-height: 20px;
     border: 1px solid silver;
     border-radius: 3px;
+    padding-left: 3px;
+    text-align: left;
+    font-size: 12px;
+    font-weight: normal;
     display: inline-block;
-    line-height: 20px;
-    text-align: right;
 }
 
 .settings-table.settings-table--inav td,
@@ -75,6 +78,16 @@
     border-top-right-radius: 5px;
 }
 
+.settings-table tr:last-child th {
+    border-bottom-left-radius: 5px;
+    border-bottom: none;
+}
+
+.settings-table tr:last-child td {
+    border-bottom-right-radius: 5px;
+    border-bottom: none;
+}
+
 .settings-table {
     /*border: 0px solid #ccc; */
     margin-bottom: 10px;
@@ -294,6 +307,12 @@
     border-bottom: 0;
 }
 
+.tab-pid_tuning .rates_number {
+    clear: left;
+    padding: 4px;
+    float: left;
+}
+
 .tab-pid_tuning .number input {
     width: 50px;
     padding-left: 3px;

tabs/pid_tuning.html

@@ -178,72 +178,70 @@
                         <tr>
                             <th class="roll" data-i18n="pidTuningRollRate"></th>
                             <td class="roll">
-                                <input type="number" class="rate-tpa_input" data-setting="roll_rate" data-setting-unit="ddeg" />
+                                <div class="rates_number"><input type="number" class="rate-tpa_input" data-setting="roll_rate" data-unit="decadegps" /></div>
-                                <input type="number" id="rate-roll" class="rate-tpa_input" step="10" min="40" max="1800" />
-                                degrees per second
                             </td>
                         </tr>
                         <tr>
                             <th class="pitch" data-i18n="pidTuningPitchRate"></th>
                             <td class="pitch">
-                                <input type="number" id="rate-pitch" class="rate-tpa_input" step="10" min="40" max="1800" /> degrees per second
+                                <div class="rates_number"><input type="number" class="rate-tpa_input" data-setting="pitch_rate" data-unit="decadegps" /></div>
                             </td>
                         </tr>
                         <tr>
                             <th class="yaw" data-i18n="pidTuningYawRate"></th>
                             <td class="yaw">
-                                <input type="number" id="rate-yaw" class="rate-tpa_input" step="10" min="10" max="1800" /> degrees per second
+                                <div class="rates_number"><input type="number" class="rate-tpa_input" data-setting="yaw_rate" data-unit="decadegps" /></div>
                             </td>
                         </tr>
                         <tr>
-                            <th>Roll & Pitch Expo</th>
+                            <th data-i18n="pidTuningRollAndPitchExpo"></th>
                             <td>
-                                <input data-setting="rc_expo" type="number" class="rate-tpa_input" />
+                                <div class="rates_number"><input type="number" class="rate-tpa_input" data-setting="rc_expo" data-unit="percent" /></div>
                             </td>
                         </tr>
                         <tr>
-                            <th>Yaw Expo</th>
+                            <th data-i18n="pidTuningYawExpo"></th>
                             <td>
-                                <input data-setting="rc_yaw_expo" type="number" class="rate-tpa_input" />
+                                <div class="rates_number"><input type="number" class="rate-tpa_input" data-setting="rc_yaw_expo" data-unit="percent" /></div>
                             </td>
                         </tr>
                         <tr>
                             <th data-i18n="pidTuningMaxRollAngle"></th>
                             <td>
-                                <input type="number" class="rate-tpa_input" data-setting="max_angle_inclination_rll" data-setting-multiplier="10" /> degrees
+                                <div class="rates_number"><input type="number" class="rate-tpa_input" data-setting="max_angle_inclination_rll" data-unit="decideg-lrg" /></div>
                                 <div class="helpicon cf_tip" data-i18n_title="pidTuningMaxRollAngleHelp"></div>
                             </td>
                         </tr>
                         <tr>
                             <th data-i18n="pidTuningMaxPitchAngle"></th>
                             <td>
-                                <input type="number" class="rate-tpa_input" data-setting="max_angle_inclination_pit" data-setting-multiplier="10" /> degrees
+                                <div class="rates_number"><input type="number" class="rate-tpa_input" data-setting="max_angle_inclination_pit" data-unit="decideg-lrg" /></div>
                                 <div class="helpicon cf_tip" data-i18n_title="pidTuningMaxPitchAngleHelp"></div>
                             </td>
                         </tr>
                         <tr>
                             <th data-i18n="magHoldYawRate"></th>
                             <td>
-                                <input type="number" id="magHoldYawRate" class="rate-tpa_input" step="5" min="10" max="250" /> degrees per second
+                                <div class="rates_number"><input type="number" class="rate-tpa_input" data-setting="heading_hold_rate_limit" data-unit="degps" /></div>
                                 <div class="helpicon cf_tip" data-i18n_title="pidTuningMagHoldYawRateHelp"></div>
                             </td>
                         </tr>
                         <tr>
                             <th class="roll" data-i18n="pidTuningManualRollRate"></th>
                             <td class="roll">
-                                <input type="number" id="rate-manual-roll" class="rate-tpa_input" step="1" min="0" max="100" /> %
+                                <div class="rates_number"><input type="number" class="rate-tpa_input" data-setting="manual_roll_rate" data-unit="percent" /></div>
                             </td>
                         </tr>
                         <tr>
                             <th class="pitch" data-i18n="pidTuningManualPitchRate"></th>
                             <td class="pitch">
-                                <input type="number" id="rate-manual-pitch" class="rate-tpa_input" step="1" min="0" max="100" /> %
+                                <div class="rates_number"><input type="number" class="rate-tpa_input" data-setting="manual_pitch_rate" data-unit="percent" /></div>
                             </td>
                         </tr>
                         <tr>
                             <th class="yaw" data-i18n="pidTuningManualYawRate"></th>
                             <td class="yaw">
-                                <input type="number" id="rate-manual-yaw" class="rate-tpa_input" step="1" min="0" max="100" /> %
+                                <div class="rates_number"><input type="number" class="rate-tpa_input" data-setting="manual_yaw_rate" data-unit="percent" /></div>
                             </td>
                         </tr>
                     </tbody>