Add drop waypoint to basic waypoint editor (#511)

src/teleop/gui/src/components/BasicWaypointEditor.vue

@@ -42,6 +42,7 @@
       <br />
       <div style="display: inline-block">
         <button @click="addWaypoint(input)">Add Waypoint</button>
+        <button @click="addWaypoint(formatted_odom)">Drop Waypoint</button>
       </div>
     </div>
     <div class="box1">
@@ -73,6 +74,13 @@ import _ from "lodash";
 import L from "leaflet";
 
 export default {
+  props: {
+    odom: {
+      type: Object,
+      required: true
+    }
+  },
+
   data() {
     return {
       name: "Waypoint",
@@ -81,27 +89,27 @@ export default {
         lat: {
           d: 0,
           m: 0,
-          s: 0,
+          s: 0
         },
         lon: {
           d: 0,
           m: 0,
-          s: 0,
-        },
+          s: 0
+        }
       },
 
-      storedWaypoints: [],
+      storedWaypoints: []
     };
   },
 
   methods: {
     ...mapMutations("erd", {
       setWaypointList: "setWaypointList",
-      setHighlightedWaypoint: "setHighlightedWaypoint",
+      setHighlightedWaypoint: "setHighlightedWaypoint"
     }),
 
     ...mapMutations("map", {
-      setOdomFormat: "setOdomFormat",
+      setOdomFormat: "setOdomFormat"
     }),
 
     deleteItem: function (payload) {
@@ -115,7 +123,7 @@ export default {
       this.storedWaypoints.push({
         name: this.name,
         lat: (coord.lat.d + coord.lat.m / 60 + coord.lat.s / 3600).toFixed(5),
-        lon: (coord.lon.d + coord.lon.m / 60 + coord.lon.s / 3600).toFixed(5),
+        lon: (coord.lon.d + coord.lon.m / 60 + coord.lon.s / 3600).toFixed(5)
       });
     },
 
@@ -129,15 +137,15 @@ export default {
 
     clearWaypoint: function () {
       this.storedWaypoints = [];
-    },
+    }
   },
 
   watch: {
     storedWaypoints: function (newList) {
       const waypoints = newList.map((waypoint) => {
         return {
           latLng: L.latLng(waypoint.lat, waypoint.lon),
-          name: waypoint.name,
+          name: waypoint.name
         };
       });
       this.setWaypointList(waypoints);
@@ -158,7 +166,7 @@ export default {
       this.input.lon.s = 0;
       this.input.lat = convertDMS(this.input.lat, this.odom_format_in);
       this.input.lon = convertDMS(this.input.lon, this.odom_format_in);
-    },
+    }
   },
 
   created: function () {
@@ -173,11 +181,11 @@ export default {
   computed: {
     ...mapGetters("erd", {
       highlightedWaypoint: "highlightedWaypoint",
-      clickPoint: "clickPoint",
+      clickPoint: "clickPoint"
     }),
 
     ...mapGetters("map", {
-      odom_format: "odomFormat",
+      odom_format: "odomFormat"
     }),
 
     min_enabled: function () {
@@ -187,13 +195,26 @@ export default {
     sec_enabled: function () {
       return this.odom_format == "DMS";
     },
+
+    formatted_odom: function () {
+      return {
+        lat: convertDMS(
+          { d: this.odom.latitude_deg, m: 0, s: 0 },
+          this.odom_format
+        ),
+        lon: convertDMS(
+          { d: this.odom.longitude_deg, m: 0, s: 0 },
+          this.odom_format
+        )
+      };
+    }
   },
 
   components: {
     draggable,
     WaypointItem,
-    Checkbox,
-  },
+    Checkbox
+  }
 };
 </script>
 

src/teleop/gui/src/components/Cache.vue

@@ -15,7 +15,7 @@
             <OpenLoopControl
               :forwards-key="79"
               :backwards-key="67"
-              :scale-default="50"
+              :scale-default="100"
               @velocity="velocity = $event"
             ></OpenLoopControl>
           </div>

src/teleop/gui/src/components/ERDTask.vue

@@ -56,7 +56,7 @@
       <JointStateTable :joint-state-data="jointState" :vertical="true" />
     </div>
     <div v-if="type === 'EDM'" class="box waypoint-editor light-bg">
-      <BasicWaypointEditor />
+      <BasicWaypointEditor :odom="odom" />
     </div>
     <div>
       <DriveControls></DriveControls>
@@ -66,7 +66,7 @@
     </div>
     <div class="box moteus light-bg">
       <DriveMoteusStateTable :moteus-state-data="moteusState" />
-      <ArmMoteusStateTable/>
+      <ArmMoteusStateTable />
     </div>
     <div v-show="false">
       <MastGimbalControls></MastGimbalControls>
@@ -89,7 +89,7 @@ import ArmMoteusStateTable from "./ArmMoteusStateTable.vue";
 import OdometryReading from "./OdometryReading.vue";
 import PDBFuse from "./PDBFuse.vue";
 import CommReadout from "./CommReadout.vue";
-import MCUReset from "./MCUReset.vue"
+import MCUReset from "./MCUReset.vue";
 import { quaternionToMapAngle, disableAutonLED } from "../utils.js";
 
 export default {
@@ -106,14 +106,14 @@ export default {
     OdometryReading,
     PDBFuse,
     CommReadout,
-    MCUReset,
+    MCUReset
   },
 
   props: {
     type: {
       type: String,
-      required: true,
-    },
+      required: true
+    }
   },
   data() {
     return {
@@ -122,7 +122,7 @@ export default {
         latitude_deg: 42.294864932393835,
         longitude_deg: -83.70781314674628,
         bearing_deg: 0,
-        speed: 0,
+        speed: 0
       },
 
       // Pubs and Subs
@@ -135,10 +135,10 @@ export default {
       moteusState: {
         name: ["", "", "", "", "", ""],
         error: ["", "", "", "", "", ""],
-        state: ["", "", "", "", "", ""],
+        state: ["", "", "", "", "", ""]
       },
 
-      jointState: {},
+      jointState: {}
     };
   },
 
@@ -147,15 +147,15 @@ export default {
     this.odom_sub = new ROSLIB.Topic({
       ros: this.$ros,
       name: "/gps/fix",
-      messageType: "sensor_msgs/NavSatFix",
+      messageType: "sensor_msgs/NavSatFix"
     });
 
     this.tfClient = new ROSLIB.TFClient({
       ros: this.$ros,
       fixedFrame: "map",
       // Thresholds to trigger subscription callback
       angularThres: 0.0001,
-      transThres: 0.01,
+      transThres: 0.01
     });
 
     // Subscriber for odom to base_link transform
@@ -172,14 +172,14 @@ export default {
     this.brushless_motors_sub = new ROSLIB.Topic({
       ros: this.$ros,
       name: "drive_status",
-      messageType: "mrover/MotorsStatus",
+      messageType: "mrover/MotorsStatus"
     });
 
     this.brushless_motors_sub.subscribe((msg) => {
       this.jointState = msg.joint_states;
       this.moteusState = msg.moteus_states;
     });
-  },
+  }
 };
 </script>
 
@@ -209,7 +209,7 @@ export default {
     "header header"
     "cameras arm-controls"
     "drive-vel-data moteus"
-    "pdb pdb"; 
+    "pdb pdb";
   font-family: sans-serif;
   height: auto;
 }

src/teleop/gui/src/components/ISHTask.vue

@@ -55,7 +55,7 @@
       <Carousel />
     </div>
     <div class="box light-bg cache">
-      <Cache :site="site" />
+      <Cache />
     </div>
     <div class="box light-bg chlorophyll">
       <Chlorophyll :spectral_data="spectral_data" />

src/teleop/gui/src/components/OpenLoopControl.vue

@@ -68,41 +68,13 @@ export default {
   created: function () {
     document.addEventListener("keyup", this.keyMonitorUp);
     document.addEventListener("keydown", this.keyMonitorDown);
-    // Prevent scrolling with the arrows when an open loop controller is on screen
-    window.addEventListener(
-      "preventScroll",
-      function (e) {
-        if (
-          ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"].indexOf(e.code) >
-          -1
-        ) {
-          e.preventDefault();
-        }
-      },
-      false
-    );
 
     interval = setInterval(() => {
       this.$emit("velocity", this.velocity);
     }, this.updateRate * 1000);
   },
 
   beforeDestroy: function () {
-    document.removeEventListener("keyup", this.keyMonitorUp);
-    document.removeEventListener("keydown", this.keyMonitorDown);
-    window.removeEventListener(
-      "preventScroll",
-      function (e) {
-        if (
-          ["Space", "ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"].indexOf(
-            e.code
-          ) > -1
-        ) {
-          e.preventDefault();
-        }
-      },
-      false
-    );
     window.clearInterval(interval);
   },
 

src/teleop/gui/src/components/SATask.vue

@@ -43,7 +43,7 @@
       <BasicMap :odom="odom" />
     </div>
     <div class="box waypoints light-bg">
-      <BasicWaypointEditor />
+      <BasicWaypointEditor :odom="odom" />
     </div>
     <div class="box light-bg cameras">
       <Cameras :primary="true" />
@@ -93,7 +93,7 @@
         :options="[
           { name: 'sa_joint_1', option: 'Joint 1' },
           { name: 'sa_joint_2', option: 'Joint 2' },
-          { name: 'sa_joint_3', option: 'Joint 3' },
+          { name: 'sa_joint_3', option: 'Joint 3' }
         ]"
       />
     </div>