Hide tabs for features that are disabled.

js/Features.js

@@ -0,0 +1,144 @@
+'use strict;'
+
+var Features = function (config) {
+    var features = [
+        {bit: 0, group: 'rxMode', mode: 'group', name: 'RX_PPM'},
+        {bit: 1, group: 'batteryVoltage', name: 'VBAT'},
+        {bit: 2, group: 'other', name: 'INFLIGHT_ACC_CAL'},
+        {bit: 3, group: 'rxMode', mode: 'group', name: 'RX_SERIAL'},
+        {bit: 4, group: 'esc', name: 'MOTOR_STOP'},
+        {bit: 5, group: 'other', name: 'SERVO_TILT'},
+        {bit: 6, group: 'other', name: 'SOFTSERIAL', haveTip: true},
+        {bit: 7, group: 'gps', name: 'GPS', haveTip: true},
+        {bit: 8, group: 'rxFailsafe', name: 'FAILSAFE'},
+        {bit: 9, group: 'other', name: 'SONAR'},
+        {bit: 10, group: 'other', name: 'TELEMETRY'},
+        {bit: 11, group: 'batteryCurrent', name: 'CURRENT_METER'},
+        {bit: 12, group: 'other', name: '3D'},
+        {bit: 13, group: 'rxMode', mode: 'group', name: 'RX_PARALLEL_PWM'},
+        {bit: 14, group: 'rxMode', mode: 'group', name: 'RX_MSP'},
+        {bit: 15, group: 'rssi', name: 'RSSI_ADC'},
+        {bit: 16, group: 'other', name: 'LED_STRIP'},
+        {bit: 17, group: 'other', name: 'DISPLAY'},
+        {bit: 19, group: 'other', name: 'BLACKBOX', haveTip: true}
+    ];
+
+    if (semver.gte(config.apiVersion, "1.12.0")) {
+        features.push(
+            {bit: 20, group: 'other', name: 'CHANNEL_FORWARDING'}
+        );
+    }
+
+    if (semver.gte(config.apiVersion, "1.16.0")) {
+        features.push(
+            {bit: 21, group: 'other', name: 'TRANSPONDER', haveTip: true}
+        );
+    }
+
+    if (semver.gte(config.flightControllerVersion, "2.8.0")) {
+         features.push(
+            {bit: 22, group: 'other', name: 'AIRMODE'},
+            {bit: 23, group: 'pidTuning', name: 'SUPEREXPO_RATES'},
+            {bit: 24, group: 'other', name: 'OSD'}
+        );
+    }
+
+    this._features = features;
+}
+
+Features.prototype.isFeatureEnabled = function (featureSet, featureName) {
+    var features = this._features;
+    for (var i = 0; i < features.length; i++) {
+        if (features[i].name === featureName && bit_check(featureSet, features[i].bit)) {
+            return true;
+        }
+    }
+    return false;
+}
+
+Features.prototype.generateElements = function (featuresElements, radioGroups) {
+    var features = this._features;
+    for (var i = 0; i < features.length; i++) {
+        var row_e;
+
+        var feature_tip_html = '';
+        if (features[i].haveTip) {
+            feature_tip_html = '<div class="helpicon cf_tip" i18n_title="feature' + features[i].name + 'Tip"></div>';
+        }
+
+        if (features[i].mode === 'group') {
+            row_e = $('<tr><td style="width: 15px;"><input style="width: 13px;" class="feature" id="feature-'
+                    + i
+                    + '" value="'
+                    + features[i].bit
+                    + '" title="'
+                    + features[i].name
+                    + '" type="radio" name="'
+                    + features[i].group
+                    + '" /></td><td><label for="feature-'
+                    + i
+                    + '">'
+                    + features[i].name
+                    + '</label></td><td><span i18n="feature' + features[i].name + '"></span>'
+                    + feature_tip_html + '</td></tr>');
+            radioGroups.push(features[i].group);
+        } else {
+            row_e = $('<tr><td><input class="feature toggle"'
+                    + i
+                    + '" name="'
+                    + features[i].name
+                    + '" title="'
+                    + features[i].name
+                    + '" type="checkbox"/></td><td><label for="feature-'
+                    + i
+                    + '">'
+                    + features[i].name
+                    + '</label></td><td><span i18n="feature' + features[i].name + '"></span>'
+                    + feature_tip_html + '</td></tr>');
+
+            var feature_e = row_e.find('input.feature');
+
+            feature_e.prop('checked', bit_check(BF_CONFIG.features, features[i].bit));
+            feature_e.data('bit', features[i].bit);
+        }
+
+        featuresElements.each(function () {
+            if ($(this).hasClass(features[i].group)) {
+                $(this).append(row_e);
+            }
+        });
+    }
+}
+
+Features.prototype.updateData = function (featureSet, featureElement) {
+    switch (featureElement.attr('type')) {
+        case 'checkbox':
+            var bit = featureElement.data('bit');
+
+            if (featureElement.is(':checked')) {
+                featureSet = bit_set(featureSet, bit);
+            } else {
+                featureSet = bit_clear(featureSet, bit);
+            }
+
+            break;
+        case 'radio':
+            var group = featureElement.attr('name');
+            var controlElements = $('input[name="' + group + '"]');
+            var selectedBit = controlElements.filter(':checked').val();
+
+            controlElements.each(function() {
+                var bit = $(this).val();
+                if (selectedBit === bit) {
+                    featureSet = bit_set(BF_CONFIG.featureSet, bit);
+                } else {
+                    featureSet = bit_clear(featureSet, bit);
+                }
+
+            });
+
+            break;
+    }
+
+    return featureSet;
+}

js/msp.js

@@ -707,6 +707,11 @@ var MSP = {
                 BF_CONFIG.board_align_yaw = data.getInt16(10, 1); // -180 - 360
                 BF_CONFIG.currentscale = data.getInt16(12, 1);
                 BF_CONFIG.currentoffset = data.getUint16(14, 1);
+
+                if (this.features) {
+                    updateTabList(BF_CONFIG.features, this.features);
+                }
+
                 break;
             case MSP_codes.MSP_SET_BF_CONFIG:
                 break;
@@ -720,8 +725,16 @@ var MSP = {
 
             case MSP_codes.MSP_API_VERSION:
                 var offset = 0;
+                var apiVersion = CONFIG.apiVersion;
+
                 CONFIG.mspProtocolVersion = data.getUint8(offset++); 
                 CONFIG.apiVersion = data.getUint8(offset++) + '.' + data.getUint8(offset++) + '.0';
+
+                if ((!this.features || CONFIG.apiVersion !== apiVersion)
+                    && CONFIG.flightControllerVersion !== '') {
+                    this.features = new Features(CONFIG);
+                }
+
                 break;
 
             case MSP_codes.MSP_FC_VARIANT:
@@ -735,7 +748,16 @@ var MSP = {
 
             case MSP_codes.MSP_FC_VERSION:
                 var offset = 0;
+                var flightControllerVersion = CONFIG.flightControllerVersion;
+
                 CONFIG.flightControllerVersion = data.getUint8(offset++) + '.' + data.getUint8(offset++) + '.' + data.getUint8(offset++);
+
+                if ((!this.features
+                    || CONFIG.flightControllerVersion !== flightControllerVersion)
+                    && CONFIG.apiVersion !== '') {
+                    this.features = new Features(CONFIG);
+                }
+
                 break;
 
             case MSP_codes.MSP_BUILD_INFO:
@@ -2072,7 +2094,7 @@ MSP.sendRxFailConfig = function(onCompleteCallback) {
         }
         MSP.send_message(MSP_codes.MSP_SET_RXFAIL_CONFIG, buffer, false, nextFunction);
     }
-};
+}
 
 MSP.SDCARD_STATE_NOT_PRESENT = 0;
 MSP.SDCARD_STATE_FATAL       = 1;

js/serial_backend.js

@@ -262,9 +262,11 @@ function onConnect() {
     $('div#connectbutton a.connect_state').text(chrome.i18n.getMessage('disconnect')).addClass('active');
     $('div#connectbutton a.connect').addClass('active');
     $('#tabs ul.mode-disconnected').hide();
-    $('#tabs ul.mode-connected').show(); 
+    $('#tabs ul.mode-connected-cli').show();
     
     if (CONFIG.flightControllerVersion !== '') {
+        $('#tabs ul.mode-connected').show();
+
         if (semver.gte(CONFIG.flightControllerVersion, "3.0.0")) {
             MSP.send_message(MSP_codes.MSP_STATUS_EX, false, false);
         } else {
@@ -301,6 +303,7 @@ function onClosed(result) {
     }
 
     $('#tabs ul.mode-connected').hide();
+    $('#tabs ul.mode-connected-cli').hide();
     $('#tabs ul.mode-disconnected').show();
 
     var sensor_state = $('#sensor-status');

main.css

@@ -508,6 +508,10 @@ input[type="number"]::-webkit-inner-spin-button {
     display: none;
 }
 
+#tabs ul.mode-connected-cli {
+    display: none;
+}
+
 #tabs li {
     border-bottom: 1px solid rgba(0, 0, 0, 0.30);
 }

main.html

@@ -64,6 +64,7 @@
 <script type="text/javascript" src="./js/localization.js"></script>
 <script type="text/javascript" src="./js/boards.js"></script>
 <script type="text/javascript" src="./js/RateCurve.js"></script>
+<script type="text/javascript" src="./js/Features.js"></script>
 <script type="text/javascript" src="./main.js"></script>
 <script type="text/javascript" src="./tabs/landing.js"></script>
 <script type="text/javascript" src="./tabs/setup.js"></script>
@@ -226,6 +227,8 @@
                     <li class="tab_sensors"><a href="#" i18n="tabRawSensorData" class="tabicon ic_sensors" title="Sensors"></a></li>
                     <li class="tab_logging"><a href="#" i18n="tabLogging" class="tabicon ic_log" title="Tethered Logging"></a></li>
                     <li class="tab_onboard_logging"><a href="#" i18n="tabOnboardLogging" class="tabicon ic_data" title="Onboard Logging"></a></li>
+                </ul>
+                <ul class="mode-connected-cli">
                     <li class="tab_cli"><a href="#" i18n="tabCLI" class="tabicon ic_cli" title="CLI"></a></li>
                     <!-- spare icons
                     <li class=""><a href="#"class="tabicon ic_mission">Mission (spare icon)</a></li>

main.js

@@ -393,10 +393,40 @@ String.prototype.format = function () {
     });
 };
 
-
-
 function updateActivatedTab() {
     var activeTab = $('#tabs > ul li.active');
     activeTab.removeClass('active');
     $('a', activeTab).trigger('click');
 }
+
+function updateTabList(featureSet, features) {
+    if (features.isFeatureEnabled(featureSet, 'GPS')) {
+        $('#tabs ul.mode-connected li.tab_gps').show();
+    } else {
+        $('#tabs ul.mode-connected li.tab_gps').hide();
+    }
+
+    if (features.isFeatureEnabled(featureSet, 'LED_STRIP')) {
+        $('#tabs ul.mode-connected li.tab_led_strip').show();
+    } else {
+        $('#tabs ul.mode-connected li.tab_led_strip').hide();
+    }
+
+    if (features.isFeatureEnabled(featureSet, 'BLACKBOX')) {
+        $('#tabs ul.mode-connected li.tab_onboard_logging').show();
+    } else {
+        $('#tabs ul.mode-connected li.tab_onboard_logging').hide();
+    }
+
+    if (features.isFeatureEnabled(featureSet, 'TRANSPONDER')) {
+        $('#tabs ul.mode-connected li.tab_transponder').show();
+    } else {
+        $('#tabs ul.mode-connected li.tab_transponder').hide();
+    }
+
+    if (features.isFeatureEnabled(featureSet, 'OSD')) {
+        $('#tabs ul.mode-connected li.tab_osd').show();
+    } else {
+        $('#tabs ul.mode-connected li.tab_osd').hide();
+    }
+}

tabs/configuration.js

@@ -113,7 +113,6 @@ TABS.configuration.initialize = function (callback, scrollPosition) {
     MSP.send_message(MSP_codes.MSP_IDENT, false, false, load_config);
     
     function process_html() {
-        
         var mixer_list_e = $('select.mixerList');
         for (var i = 0; i < mixerList.length; i++) {
             mixer_list_e.append('<option value="' + (i + 1) + '">' + mixerList[i].name + '</option>');
@@ -130,109 +129,12 @@ TABS.configuration.initialize = function (callback, scrollPosition) {
         // select current mixer configuration
         mixer_list_e.val(BF_CONFIG.mixerConfiguration).change();
 
-        // generate features
-        var features = [
-            {bit: 0, group: 'rxMode', mode: 'group', name: 'RX_PPM'},
-            {bit: 1, group: 'batteryVoltage', name: 'VBAT'},
-            {bit: 2, group: 'other', name: 'INFLIGHT_ACC_CAL'},
-            {bit: 3, group: 'rxMode', mode: 'group', name: 'RX_SERIAL'},
-            {bit: 4, group: 'esc', name: 'MOTOR_STOP'},
-            {bit: 5, group: 'other', name: 'SERVO_TILT'},
-            {bit: 6, group: 'other', name: 'SOFTSERIAL', haveTip: true},
-            {bit: 7, group: 'gps', name: 'GPS', haveTip: true},
-            {bit: 8, group: 'rxFailsafe', name: 'FAILSAFE'},
-            {bit: 9, group: 'other', name: 'SONAR'},
-            {bit: 10, group: 'other', name: 'TELEMETRY'},
-            {bit: 11, group: 'batteryCurrent', name: 'CURRENT_METER'},
-            {bit: 12, group: 'other', name: '3D'},
-            {bit: 13, group: 'rxMode', mode: 'group', name: 'RX_PARALLEL_PWM'},
-            {bit: 14, group: 'rxMode', mode: 'group', name: 'RX_MSP'},
-            {bit: 15, group: 'rssi', name: 'RSSI_ADC'},
-            {bit: 16, group: 'other', name: 'LED_STRIP'},
-            {bit: 17, group: 'other', name: 'DISPLAY'},
-            {bit: 19, group: 'other', name: 'BLACKBOX', haveTip: true}
-        ];
-        
-        if (semver.gte(CONFIG.apiVersion, "1.12.0")) {
-            features.push(
-                {bit: 20, group: 'other', name: 'CHANNEL_FORWARDING'}
-            );
-        }
-
-        if (semver.gte(CONFIG.apiVersion, "1.16.0")) {
-            features.push(
-                {bit: 21, group: 'other', name: 'TRANSPONDER', haveTip: true}
-            );
-        }
-
-        if (CONFIG.flightControllerIdentifier === "BTFL" && semver.gte(CONFIG.flightControllerVersion, "2.8.0")) {
-             features.push(
-                {bit: 22, group: 'other', name: 'AIRMODE'}
-            );
-        }
-
-        function isFeatureEnabled(featureName) {
-            for (var i = 0; i < features.length; i++) {
-                if (features[i].name == featureName && bit_check(BF_CONFIG.features, features[i].bit)) {
-                    return true;
-                }
-            }
-            return false;
-        }
+        var features = new Features(CONFIG);
 
         var radioGroups = [];
-        
         var features_e = $('.features');
-        for (var i = 0; i < features.length; i++) {
-            var row_e;
 
-            var feature_tip_html = '';
-            if (features[i].haveTip) {
-                feature_tip_html = '<div class="helpicon cf_tip" i18n_title="feature' + features[i].name + 'Tip"></div>';
-            }
-            
-            if (features[i].mode === 'group') {
-                row_e = $('<tr><td style="width: 15px;"><input style="width: 13px;" class="feature" id="feature-'
-                        + i
-                        + '" value="'
-                        + features[i].bit
-                        + '" title="'
-                        + features[i].name
-                        + '" type="radio" name="'
-                        + features[i].group
-                        + '" /></td><td><label for="feature-'
-                        + i
-                        + '">'
-                        + features[i].name
-                        + '</label></td><td><span i18n="feature' + features[i].name + '"></span>' 
-                        + feature_tip_html + '</td></tr>');
-                radioGroups.push(features[i].group);
-            } else {
-                row_e = $('<tr><td><input class="feature toggle"'
-                        + i
-                        + '" name="'
-                        + features[i].name
-                        + '" title="'
-                        + features[i].name
-                        + '" type="checkbox"/></td><td><label for="feature-'
-                        + i
-                        + '">'
-                        + features[i].name
-                        + '</label></td><td><span i18n="feature' + features[i].name + '"></span>' 
-                        + feature_tip_html + '</td></tr>');
-                
-                var feature_e = row_e.find('input.feature');
-
-                feature_e.prop('checked', bit_check(BF_CONFIG.features, features[i].bit));
-                feature_e.data('bit', features[i].bit);
-            }
-
-            features_e.each(function () {
-                if ($(this).hasClass(features[i].group)) {
-                    $(this).append(row_e);
-                }
-            });
-        }
+        features.generateElements(features_e, radioGroups);
         
         // translate to user-selected language
         localize();
@@ -511,10 +413,11 @@ TABS.configuration.initialize = function (callback, scrollPosition) {
             $('input[name="autodisarmdelay"]').val(ARMING_CONFIG.auto_disarm_delay);
             $('input[name="disarmkillswitch"]').prop('checked', ARMING_CONFIG.disarm_kill_switch);
             $('div.disarm').show();            
-            if(bit_check(BF_CONFIG.features, 4))//MOTOR_STOP
+            if (features.isFeatureEnabled(BF_CONFIG.features, 'MOTOR_STOP')) {
                 $('div.disarmdelay').show();
-            else
+            } else {
                 $('div.disarmdelay').hide();
+            }
 
             $('div.cycles').show();
         }
@@ -550,53 +453,29 @@ TABS.configuration.initialize = function (callback, scrollPosition) {
             }
         }
 
-        $('input[type="checkbox"].feature', features_e).change(function () {
-            var element = $(this),
-                index = element.data('bit'),
-                state = element.is(':checked');
+        // UI hooks
+        $('input.feature', features_e).change(function () {
+            var element = $(this);
 
-            if (state) {
-                BF_CONFIG.features = bit_set(BF_CONFIG.features, index);
-                if(element.attr('name') === 'MOTOR_STOP')                    
+            BF_CONFIG.features = features.updateData(BF_CONFIG.features, element);
+            updateTabList(BF_CONFIG.features, features);
+
+            if (element.attr('name') === 'MOTOR_STOP') {
+                if (features.isFeatureEnabled(BF_CONFIG.features, 'MOTOR_STOP')) {
                     $('div.disarmdelay').show();
                 } else {
-                BF_CONFIG.features = bit_clear(BF_CONFIG.features, index);
-                if(element.attr('name') === 'MOTOR_STOP')
                     $('div.disarmdelay').hide();
                 }
-        });
-
-        $("input[type='checkbox']").change(function() {
-            var element = $(this), 
-                name = element.attr('name'),
-                isChecked = element.is(':checked');
-            if (name == 'unsyncedPWMSwitch') {
-                if (isChecked) { $('div.unsyncedpwmfreq').show(); }
-                else { $('div.unsyncedpwmfreq').hide(); }
             }
         });
 
-        // UI hooks
-        $('input[type="radio"].feature', features_e).change(function () {
-            var element = $(this),
-                group = element.attr('name');
-
-            var controls_e = $('input[name="' + group + '"]');
-            var selected_bit = controls_e.filter(':checked').val();
-            
-            controls_e.each(function() {
-                var bit = $(this).attr('value');
-                
-                var selected = (selected_bit == bit);
-                if (selected) {
-                    BF_CONFIG.features = bit_set(BF_CONFIG.features, bit);
+        $("input[name='unsyncedPWMSwitch']").change(function() {
+            if ($(this).is(':checked')) {
+                $('div.unsyncedpwmfreq').show();
             } else {
-                    BF_CONFIG.features = bit_clear(BF_CONFIG.features, bit);
+                $('div.unsyncedpwmfreq').hide();
             }
-
         });
-        });
-
 
         $('a.save').click(function () {
             // gather data that doesn't have automatic change event bound