Merge pull request #1697 from iNavFlight/MrD_Add-user-actions-to-Mission-Control

Add user actions to Mission Control

src/css/tabs/mission_planer.css

@@ -522,3 +522,7 @@
 .tab-mission-control .valueLegend{
     float:right;
 }
+
+.tab-mission-control .userActionContainer {
+    display: inline-block;
+}

tabs/mission_control.html

@@ -259,8 +259,8 @@
                             <input id="pointAlt" type="text" value="0" required><span id="altitudeInMeters"></span>
                         </div>
                         <div class="point" id="pointP3class" style="display: none">
-                            <label class="point-label" for="pointP3">Parameter 3: </label>
+                            <label class="point-label" for="pointP3Alt">Sea level Ref: </label>
-                            <input id="pointP3" type="checkbox" value="0" class="togglemedium" checked required>
+                            <input id="pointP3Alt" type="checkbox" value="0" class="togglemedium" checked required>
                         </div>
                         <div class="point" id="elevationAtWP" style="display: none">
                             <label class="point-label">Elevation (m): </label>
@@ -278,6 +278,13 @@
                             <label class="point-label" for="pointP2">Parameter 2: </label>
                             <input id="pointP2" type="text" value="0" required>
                         </div>
+                        <div class="point" id="pointP3UserActionClass" style="display: none">
+                            <label class="point-label" for="pointP3UserAction">User Actions: </label>
+                            <div class="userActionContainer">1 <input id="pointP3UserAction1" type="checkbox" value="0" class="togglemedium" checked required></div>
+                            <div class="userActionContainer">2 <input id="pointP3UserAction2" type="checkbox" value="0" class="togglemedium" checked required></div>
+                            <div class="userActionContainer">3 <input id="pointP3UserAction3" type="checkbox" value="0" class="togglemedium" checked required></div>
+                            <div class="userActionContainer">4 <input id="pointP3UserAction4" type="checkbox" value="0" class="togglemedium" checked required></div>
+                        </div>
                         <div>
                         <table class="waypointOptionsTable">
                             <thead>

tabs/mission_control.js

@@ -46,6 +46,7 @@ var dictOfLabelParameterPoint = {
 };
 
 var waypointOptions = ['JUMP','SET_HEAD','RTH'];
+var initParam3 = 0;
 
 ////////////////////////////////////
 //
@@ -152,7 +153,6 @@ TABS.mission_control.initialize = function (callback) {
               if (!cursorInitialized) {
                   cursorInitialized = true;
 
-
                   /////////////////////////////////////
                   //create layer for current position
                   curPosStyle = new ol.style.Style({
@@ -206,7 +206,6 @@ TABS.mission_control.initialize = function (callback) {
                       source: rthVector
                   });
 
-
                   //////////////////////////////
                   //create layer for bread crumbs
                   breadCrumbLS = new ol.geom.LineString([ol.proj.fromLonLat([lon, lat]), ol.proj.fromLonLat([lon, lat])]);
@@ -232,7 +231,6 @@ TABS.mission_control.initialize = function (callback) {
                     source: breadCrumbSource
                   });
 
-
                   /////////////////////////////
                   //create layer for heading, alt, groundspeed
                   textGeom = new ol.geom.Point([0,0]);
@@ -252,7 +250,6 @@ TABS.mission_control.initialize = function (callback) {
                     })
                   });
 
-
                   textFeature = new ol.Feature({
                     geometry: textGeom
                   });
@@ -271,7 +268,6 @@ TABS.mission_control.initialize = function (callback) {
                   map.addLayer(breadCrumbVector);
                   map.addLayer(currentPositionLayer);
                   map.addControl(textVector);
-
               }
 
               let gpsPos = ol.proj.fromLonLat([lon, lat]);
@@ -297,7 +293,6 @@ TABS.mission_control.initialize = function (callback) {
                               'm\nSpeed: ' + GPS_DATA.speed + 'cm/s\n' +
                               'Dist: ' + GPS_DATA.distanceToHome + 'm');
 
-
               //update RTH every 5th GPS update since it really shouldn't change
               if(rthUpdateInterval >= 5)
               {
@@ -418,7 +413,7 @@ TABS.mission_control.initialize = function (callback) {
         $('#pointAlt').val('');
         $('#pointP1').val('');
         $('#pointP2').val('');
-        $('#pointP3').val('');
+        $('#pointP3Alt').val('');
         $('#missionDistance').text(0);
         $('#MPeditPoint').fadeOut(300);
     }
@@ -735,7 +730,6 @@ TABS.mission_control.initialize = function (callback) {
         });
     }
 
-
     function updateHome() {
         renderHomeTable();
         cleanHomeLayers();
@@ -982,7 +976,6 @@ TABS.mission_control.initialize = function (callback) {
         }
     }
 
-
     /////////////////////////////////////////////
     //
     // Manage Waypoint
@@ -998,7 +991,6 @@ TABS.mission_control.initialize = function (callback) {
     }
 
     function addWaypointMarker(waypoint, isEdit=false) {
-
         let coord = ol.proj.fromLonLat([waypoint.getLonMap(), waypoint.getLatMap()]);
         var iconFeature = new ol.Feature({
             geometry: new ol.geom.Point(coord),
@@ -1055,7 +1047,6 @@ TABS.mission_control.initialize = function (callback) {
         });
     }
 
-
     function repaintLine4Waypoints(mission) {
         let oldPos,
             oldAction,
@@ -1206,7 +1197,6 @@ TABS.mission_control.initialize = function (callback) {
             source: vectorSource
         });
 
-
         vectorLayer.kind = "line";
         vectorLayer.selection = selection;
         vectorLayer.number = pos2ID;
@@ -1261,7 +1251,6 @@ TABS.mission_control.initialize = function (callback) {
         repaintLine4Waypoints(mission);
     }
 
-
     function renderWaypointOptionsTable(waypoint) {
         /*
          * Process Waypoint Options table UI
@@ -1286,9 +1275,11 @@ TABS.mission_control.initialize = function (callback) {
             for (var i = 1; i <= 3; i++) {
                 if (dictOfLabelParameterPoint[element.getAction()]['parameter'+String(i)] != '') {
                     $row.find(".waypointOptions-p"+String(i)).prop("disabled", false);
+                    $row.find(".waypointOptions-p"+String(i)).prop("title", dictOfLabelParameterPoint[element.getAction()]['parameter'+String(i)]);
                 }
                 else {
                     $row.find(".waypointOptions-p"+String(i)).prop("disabled", true);
+                    $row.find(".waypointOptions-p"+String(i)).prop("title", "");
                 }
             }
 
@@ -1299,9 +1290,11 @@ TABS.mission_control.initialize = function (callback) {
                 for (var i = 1; i <= 3; i++) {
                     if (dictOfLabelParameterPoint[element.getAction()]['parameter'+String(i)] != '') {
                         $row.find(".waypointOptions-p"+String(i)).prop("disabled", false);
+                        $row.find(".waypointOptions-p"+String(i)).prop("title", dictOfLabelParameterPoint[element.getAction()]['parameter'+String(i)]);
                     }
                     else {
                         $row.find(".waypointOptions-p"+String(i)).prop("disabled", true);
+                        $row.find(".waypointOptions-p"+String(i)).prop("title", "");
                     }
                 }
                 mission.updateWaypoint(element);
@@ -1311,7 +1304,6 @@ TABS.mission_control.initialize = function (callback) {
 
             $row.find(".waypointOptions-number").text(element.getAttachedNumber()+1);
 
-
             $row.find(".waypointOptions-p1").val((MWNP.WPTYPE.REV[element.getAction()] == "JUMP" ? element.getP1()+1 : element.getP1())).change(function () {
                 if (MWNP.WPTYPE.REV[element.getAction()] == "SET_HEAD") {
                     if ($(this).val() >= 360 || ($(this).val() < 0 && $(this).val() != -1))
@@ -1462,7 +1454,6 @@ TABS.mission_control.initialize = function (callback) {
         };
         ol.inherits(app.PlannerSettingsControl, ol.control.Control);
 
-
         /**
          * @constructor
          * @extends {ol.control.Control}
@@ -1840,7 +1831,16 @@ TABS.mission_control.initialize = function (callback) {
                 // Change SpeedValue to Parameter1, 2, 3
                 $('#pointP1').val(selectedMarker.getP1());
                 $('#pointP2').val(selectedMarker.getP2());
-                changeSwitchery($('#pointP3'), selectedMarker.getP3() == 1);
+
+                let P3Value = selectedMarker.getP3();
+                initParam3 = 0; // Reset init bits for P3 before setting up checkboxes
+
+                changeSwitchery($('#pointP3Alt'), TABS.mission_control.isBitSet(P3Value, 0));
+                changeSwitchery($('#pointP3UserAction1'), TABS.mission_control.isBitSet(P3Value, 1));
+                changeSwitchery($('#pointP3UserAction2'), TABS.mission_control.isBitSet(P3Value, 2));
+                changeSwitchery($('#pointP3UserAction3'), TABS.mission_control.isBitSet(P3Value, 3));
+                changeSwitchery($('#pointP3UserAction4'), TABS.mission_control.isBitSet(P3Value, 4));
+                initParam3 = 31; // Set all bits for above P3 params to true, after setting checkboxes
                 
                 // Selection box update depending on choice of type of waypoint
                 for (var j in dictOfLabelParameterPoint[selectedMarker.getAction()]) {
@@ -1853,6 +1853,7 @@ TABS.mission_control.initialize = function (callback) {
                 selectedMarker = renderWaypointOptionsTable(selectedMarker);
                 $('#EditPointNumber').text("Edit point "+String(selectedMarker.getLayerNumber()+1));
                 $('#MPeditPoint').fadeIn(300);
+                $('#pointP3UserActionClass').fadeIn();
                 redrawLayer();
             }
             else if (selectedFeature && tempMarker.kind == "line" && tempMarker.selection && !disableMarkerEdit) {
@@ -2104,20 +2105,25 @@ TABS.mission_control.initialize = function (callback) {
             }
         });
 
-        $('#pointP3').on('change', function (event) {
+        $('#pointP3Alt').on('change', function (event) {
+            if (selectedMarker) {
+                P3Value = selectedMarker.getP3();
+                
                 if (disableMarkerEdit) {
-                changeSwitchery($('#pointP3'), selectedMarker.getP3() == 1);
+                    changeSwitchery($('#pointP3Alt'), TABS.mission_control.isBitSet(P3Value, 0));
                 }
 
-            if (selectedMarker) {
+                P3Value = TABS.mission_control.setBit(P3Value, 0, $('#pointP3Alt').prop("checked"));
-                const P3Value = selectedMarker.getP3();
+                selectedMarker.setP3(P3Value);
-                selectedMarker.setP3( $('#pointP3').prop("checked") ? 1.0 : 0.0);
+
+                P3Value = TABS.mission_control.setBit(P3Value, 0, $('#pointP3Alt').prop("checked"));
+                selectedMarker.setP3(P3Value);
                 (async () => {
                     const elevationAtWP = await selectedMarker.getElevation(globalSettings);
                     $('#elevationValueAtWP').text(elevationAtWP);
                     var altitude = Number($('#pointAlt').val());
                     if (P3Value != selectedMarker.getP3()) {
-                        if ($('#pointP3').prop("checked")) {
+                        if ($('#pointP3Alt').prop("checked")) {
                             if (altitude < 0) {
                                 altitude = settings.alt;
                             }
@@ -2140,6 +2146,66 @@ TABS.mission_control.initialize = function (callback) {
             }
         });
 
+        $('#pointP3UserAction1').on('change', function(event){
+            if (selectedMarker) {
+                if (disableMarkerEdit) {
+                    changeSwitchery($('#pointP3UserAction1'), TABS.mission_control.isBitSet(selectedMarker.getP3(), 1));
+                }
+
+                P3Value = TABS.mission_control.setBit(selectedMarker.getP3(), 1, $('#pointP3UserAction1').prop("checked"));
+                selectedMarker.setP3(P3Value);
+    
+                mission.updateWaypoint(selectedMarker);
+                mission.update(singleMissionActive());
+                redrawLayer();
+            }
+        });
+
+        $('#pointP3UserAction2').on('change', function(event){
+            if (selectedMarker) {
+                if (disableMarkerEdit) {
+                    changeSwitchery($('#pointP3UserAction2'), TABS.mission_control.isBitSet(selectedMarker.getP3(), 2));
+                }
+
+                P3Value = TABS.mission_control.setBit(selectedMarker.getP3(), 2, $('#pointP3UserAction2').prop("checked"));
+                selectedMarker.setP3(P3Value);
+
+                mission.updateWaypoint(selectedMarker);
+                mission.update(singleMissionActive());
+                redrawLayer();
+            }
+        });
+
+        $('#pointP3UserAction3').on('change', function(event){
+            if (selectedMarker) {
+                if (disableMarkerEdit) {
+                    changeSwitchery($('#pointP3UserAction3'), TABS.mission_control.isBitSet(selectedMarker.getP3(), 3));
+                }
+    
+                P3Value = TABS.mission_control.setBit(selectedMarker.getP3(), 3, $('#pointP3UserAction3').prop("checked"));
+                selectedMarker.setP3(P3Value);
+
+                mission.updateWaypoint(selectedMarker);
+                mission.update(singleMissionActive());
+                redrawLayer();
+            }
+        });
+
+        $('#pointP3UserAction4').on('change', function(event){
+            if (selectedMarker) {
+                if (disableMarkerEdit) {
+                    changeSwitchery($('#pointP3UserAction4'), TABS.mission_control.isBitSet(selectedMarker.getP3(), 4));
+                }
+    
+                P3Value = TABS.mission_control.setBit(selectedMarker.getP3(), 4, $('#pointP3UserAction4').prop("checked"));
+                selectedMarker.setP3(P3Value);
+
+                mission.updateWaypoint(selectedMarker);
+                mission.update(singleMissionActive());
+                redrawLayer();
+            }
+        });
+
         /////////////////////////////////////////////
         // Callback for Waypoint Options Table
         /////////////////////////////////////////////
@@ -2417,7 +2483,6 @@ TABS.mission_control.initialize = function (callback) {
         updateTotalInfo();
     }
 
-
     /////////////////////////////////////////////
     //
     // Load/Save MWP File Toolbox
@@ -2634,7 +2699,6 @@ TABS.mission_control.initialize = function (callback) {
     }
 
     /////////////////////////////////////////////
-    //
     // Load/Save FC mission Toolbox
     // mission = configurator store, WP number indexed from 0, MISSION_PLANNER = FC NVM store, WP number indexed from 1
     /////////////////////////////////////////////
@@ -2868,9 +2932,22 @@ TABS.mission_control.initialize = function (callback) {
             }
         }
     }
-
 };
 
+TABS.mission_control.isBitSet = function(bits, testBit) {
+    let isTrue = ((bits & (1 << testBit)) != 0);
+
+    return isTrue;
+}
+
+TABS.mission_control.setBit = function(bits, bit, value) {
+    if ((initParam3 & (1 << bit)) != 0) {
+        bits &= ~(0 << bit);
+        bits |= (value << bit);
+    }
+    return bits;
+}
+
 // window.addEventListener("error", handleError, true);
 
 // function handleError(evt) {