Merge pull request #1342 from MrD-RC/mode-in-range-and-acro-indicator-block

Mode in range and Acro indicators

src/css/tabs/auxiliary.css

@@ -22,6 +22,14 @@
     background: #37a8db;
 }
 
+.tab-auxiliary .mode.inRange .info {
+    background: #104156;
+    color: white;
+}
+.tab-auxiliary .mode.inRange:nth-child(odd) .info {
+    background: #104156;
+}
+
 .tab-auxiliary .mode.off .info {
     background: #828885;
     color: white;
@@ -198,6 +206,33 @@
     padding: 10px 5px;
 }
 
+.tab-auxiliary .acroEnabled {
+    margin-top: 0;
+    margin-bottom: 0;
+    background-color: #828885;
+    color: white;
+    font-family: 'open_sansbold', Arial, serif;
+    font-size: 12px;
+    display: block;
+    cursor: pointer;
+    transition: all ease 0.2s;
+    line-height: 28px;
+    position: fixed;
+    bottom:10px;
+    left:20px;
+    width:10%;
+    text-align: center;
+    z-index: 25000;
+}
+
+.tab-auxiliary .acroEnabled.on {
+    background-color: #37a8db;
+}
+
+.tab-auxiliary .acroEnabled.off {
+    background-color: #828885;
+}
+
 @media only screen and (max-width: 1055px) , only screen and (max-device-width: 1055px) {
     .tab-auxiliary .fixed_band {
         width: calc(100% - -30px);

tabs/auxiliary.html

@@ -22,6 +22,9 @@
             <a class="save" href="#" i18n="auxiliaryButtonSave"></a>
         </div>
     </div>
+    <div class="acroEnabled">
+        ACRO
+    </div>
 </div>
 <div id="tab-auxiliary-templates">
     <table class="modes">

tabs/auxiliary.js

@@ -111,6 +111,7 @@ TABS.auxiliary.initialize = function (callback) {
         $(newMode).data('index', modeIndex);
         $(newMode).data('id', modeId);
         $(newMode).data('origId', ORIG_AUX_CONFIG_IDS[modeIndex]);
+        $(newMode).data('modeName', AUX_CONFIG[modeIndex]);
 
         $(newMode).find('.name').data('modeElement', newMode);
         $(newMode).find('a.addRange').data('modeElement', newMode);
@@ -344,8 +345,19 @@ TABS.auxiliary.initialize = function (callback) {
 
         function update_ui() {
             let hasUsedMode = false;
+            let acroEnabled = true;
+            let acroFail = ["ANGLE", "HORIZON", "MANUAL", "NAV RTH", "NAV POSHOLD", "NAV CRUISE", "NAV COURSE HOLD", "NAV WP", "GCS NAV"];
+
+            var auxChannelCount = RC.active_channels - 4;
+
+            for (var i = 0; i < (auxChannelCount); i++) {
+                update_marker(i, RC.channels[i + 4]);
+            }
+
             for (var i = 0; i < AUX_CONFIG.length; i++) {
                 var modeElement = $('#mode-' + i);
+                let inRange = false;
+                
                 if (modeElement.find(' .range').length == 0) {
                     // if the mode is unused, skip it
                     modeElement.removeClass('off').removeClass('on');
@@ -353,13 +365,49 @@ TABS.auxiliary.initialize = function (callback) {
                 }
 
                 if (FC.isModeBitSet(modeElement.data('origId'))) {
-                    $('.mode .name').eq(modeElement.data('index')).data('modeElement').addClass('on').removeClass('off');
+                    // The flight controller can activate the mode
+                    $('.mode .name').eq(modeElement.data('index')).data('modeElement').addClass('on').removeClass('inRange').removeClass('off');
+
+                    if (jQuery.inArray(modeElement.data('modeName'), acroFail) !== -1) {
+                        acroEnabled = false;
+                    }
                 } else {
-                    $('.mode .name').eq(modeElement.data('index')).data('modeElement').removeClass('on').addClass('off');
+                    // Check to see if the mode is in range
+                    var modeRanges = modeElement.find(' .range');
+                    for (r = 0; r < modeRanges.length; r++) {
+                        var rangeLow = $(modeRanges[r]).find('.lowerLimitValue').html();
+                        var rangeHigh = $(modeRanges[r]).find('.upperLimitValue').html();
+                        var markerPosition = $(modeRanges[r]).find('.marker')[0].style.left;
+                        markerPosition = markerPosition.substring(0, markerPosition.length-1);
+
+                        rangeLow = (rangeLow - 900) / (2100-900) * 100;
+                        rangeHigh = (rangeHigh - 900) / (2100-900) * 100;
+
+                        if ((markerPosition >= rangeLow) && (markerPosition <= rangeHigh)) {
+                            inRange = true;
+                        }
+                    }
+                    
+                    if (inRange) {
+                        $('.mode .name').eq(modeElement.data('index')).data('modeElement').removeClass('on').addClass('inRange').removeClass('off');
+
+                        if (jQuery.inArray(modeElement.data('modeName'), acroFail) !== -1) {
+                            acroEnabled = false;
+                        }
+                    } else {
+                        // If not, it is shown as disabled.
+                        $('.mode .name').eq(modeElement.data('index')).data('modeElement').removeClass('on').removeClass('inRange').addClass('off');
+                    }
                 }
                 hasUsedMode = true;
             }
 
+            if (acroEnabled) {
+                $('.acroEnabled').addClass('on').removeClass('off');
+            } else {
+                $('.acroEnabled').removeClass('on').addClass('off');
+            }
+        
             let hideUnused = hideUnusedModes && hasUsedMode;
             for (let i = 0; i < AUX_CONFIG.length; i++) {
                 let modeElement = $('#mode-' + i);
@@ -367,11 +415,6 @@ TABS.auxiliary.initialize = function (callback) {
                     modeElement.toggle(!hideUnused);
                 }
             }    
-            var auxChannelCount = RC.active_channels - 4;
-
-            for (var i = 0; i < (auxChannelCount); i++) {
-                update_marker(i, RC.channels[i + 4]);
-            }
         }
 
         let hideUnusedModes = false;
@@ -391,6 +434,8 @@ TABS.auxiliary.initialize = function (callback) {
         // enable data pulling
         helper.mspBalancedInterval.add('aux_data_pull', 50, 1, get_rc_data);
 
+        $(".tab-auxiliary .acroEnabled").width($("#mode-0 .info").width());
+
         GUI.content_ready(callback);
     }
 };
@@ -398,3 +443,7 @@ TABS.auxiliary.initialize = function (callback) {
 TABS.auxiliary.cleanup = function (callback) {
     if (callback) callback();
 };
+
+$(window).on('resize', function(){
+    $(".tab-auxiliary .acroEnabled").width($("#mode-0 .info").width());
+});