Merge remote-tracking branch 'origin/camera-tab' into integration

launch/basestation.launch

@@ -14,7 +14,8 @@
 
   <node if="$(arg run_frontend)" name="gui_frontend" pkg="mrover" type="gui_frontend.sh" cwd="node" required="true" />
   <node if="$(arg run_backend)" name="gui_backend" pkg="mrover" type="gui_backend.sh" cwd="node" required="true" />
-  <node if="$(arg run_browser)" name="gui_chromium" pkg="mrover" type="gui_chromium.sh" />
+  <node if="$(arg run_browser)" name="gui_chromium_menu" pkg="mrover" type="gui_chromium_menu.sh" />
+  <node if="$(arg run_browser)" name="gui_chromium_cameras" pkg="mrover" type="gui_chromium_cameras.sh" />
 
   <group if="$(arg run_rviz)">
     <arg name="rvizconfig" default="$(find mrover)/config/rviz/basestation.rviz" />

src/teleoperation/frontend/src/components/AutonTask.vue

@@ -47,7 +47,7 @@
       </div>
     </div>
     <div class="shadow p-3 rounded cameras">
-      <Cameras :primary="true" :isSA="false" :mission="'auton'"/>
+      <Cameras :isSA="false" :mission="'auton'"/>
     </div>
     <div class="shadow p-3 rounded moteus">
       <DriveMoteusStateTable :moteus-state-data="moteusState" />

src/teleoperation/frontend/src/components/CameraFeed.vue

@@ -3,20 +3,7 @@
     <canvas :id="'stream-' + id" v-on:click="handleClick"></canvas>
     <div v-if="mission != 'ZED'">
       <p>{{ name }} • ID: {{ id }}</p>
-      <div class="form-group col-md-4">
-        <label for="quality">Quality:</label>
-        <select
-            v-model="quality"
-            min="0"
-            max="4"
-            class="form-control"
-            id="quality"
-            @change="changeQuality()"
-        >
-          <option v-for="i in 5" :key="i">{{ i - 1 }}</option>
-        </select>
-      </div>
-      <Checkbox v-if="mission === 'ik'" :name="'IK Camera'" v-on:toggle="toggleIKMode"/>
+      <Checkbox v-if="mission === 'ik'" :name="'IK Camera'" v-on:toggle="toggleIKMode" />
     </div>
   </div>
 </template>
@@ -52,8 +39,6 @@ export default defineComponent({
 
       // IK Mode
       IKCam: false,
-
-      quality: 2
     }
   },
 
@@ -74,15 +59,7 @@ export default defineComponent({
         this.sendMessage({type: 'start_click_ik', data: {x: event.offsetX, y: event.offsetY}})
       }
     },
-    changeQuality: function () {
-      this.sendMessage({
-        type: 'sendCameras',
-        primary: this.mission === 'sa',
-        device: this.id,
-        resolution: parseInt(this.quality)
-      })
-    },
-
+    
     toggleIKMode: function () {
       this.IKCam = !this.IKCam
     },

src/teleoperation/frontend/src/components/Cameras.vue

@@ -1,7 +1,6 @@
 <template>
   <div class="wrap row">
     <div class="col">
-      <h3>Cameras ({{ num_available }} available)</h3>
       <div class="row justify-content-md-left">
         <div class="form-group col-md-4">
           <label for="Camera Name">Camera name</label>
@@ -40,12 +39,12 @@
     <div class="col">
       <h3>All Cameras</h3>
       <div class="d-flex justify-content-end" v-if="isSA">
-        <button class="btn btn-primary btn-lg custom-btn" @click="takePanorama()">
+        <button class="btn btn-primary btn-lg" @click="takePanorama()">
           Take Panorama
         </button>
       </div>
     </div>
-    <CameraDisplay :streamOrder="streamOrder" :mission="mission" :names="names" :qualities="qualities"></CameraDisplay>
+    <CameraDisplay :streamOrder="streamOrder" :mission="mission" :names="names"></CameraDisplay>
   </div>
 </template>
 
@@ -62,10 +61,6 @@ export default {
   },
 
   props: {
-    primary: {
-      type: Boolean,
-      required: true
-    },
     isSA: {
       type: Boolean,
       required: true
@@ -82,10 +77,7 @@ export default {
       cameraIdx: 0,
       cameraName: '',
       capacity: 4,
-      qualities: reactive(new Array(9).fill(-1)),
       streamOrder: reactive([]),
-
-      num_available: -1
     }
   },
 
@@ -123,19 +115,9 @@ export default {
     setCamIndex: function (index: number) {
       // every time a button is pressed, it changes cam status and adds/removes from stream
       this.camsEnabled[index] = !this.camsEnabled[index]
-      if (this.camsEnabled[index]) this.qualities[index] = 2 //if enabling camera, turn on medium quality
       this.changeStream(index)
     },
 
-    sendCameras: function (index: number) {
-      this.sendMessage({
-        type: 'sendCameras',
-        primary: this.primary,
-        device: index,
-        resolution: this.qualities[index]
-      })
-    },
-
     addCameraName: function () {
       this.names[this.cameraIdx] = this.cameraName
     },
@@ -145,9 +127,7 @@ export default {
       if (found) {
         this.streamOrder.splice(this.streamOrder.indexOf(index), 1)
         this.streamOrder.push(-1)
-        this.qualities[index] = -1 //close the stream when sending it to comms
       } else this.streamOrder[this.streamOrder.indexOf(-1)] = index
-      this.sendCameras(index)
     },
 
     takePanorama() {

src/teleoperation/frontend/src/components/DMESTask.vue

@@ -22,7 +22,7 @@
     </div>
 
     <div class="shadow p-3 rounded cameras">
-      <Cameras :primary="true" :isSA="false" :mission="'ik'" />
+      <Cameras :isSA="false" :mission="'ik'" />
     </div>
     <div v-if="type === 'DM'" class="shadow p-3 rounded odom">
       <OdometryReading :odom="odom" />

src/teleoperation/frontend/src/components/ISHTask.vue

@@ -25,7 +25,7 @@
       <SelectSite @site="onSiteChange" />
     </div>
     <div class="shadow p-3 rounded cameras">
-      <Cameras :primary="primary" :isSA="false" :mission="'sa'" />
+      <Cameras :isSA="false" :mission="'sa'" />
     </div>
     <div class="shadow p-3 rounded benedicts">
       <AminoBenedict :site="site" :isAmino="false" />

src/teleoperation/frontend/src/components/Menu.vue

@@ -13,8 +13,7 @@
         <MenuButton link="/ISHTask" name="ISH GUI" />
         <MenuButton link="/SATask" name="Sample Acquisition GUI" />
         <MenuButton link="/AutonTask" name="Autonomy Mission" />
-        <MenuButton link="/Control" name="Temp Controls GUI" />
-        <MenuButton link="/ROSDebug" name="ROS Debug Tools" />
+        <MenuButton link="/Cameras" name="Cameras" />
       </fieldset>
     </div>
   </div>

src/teleoperation/frontend/src/components/MenuButton.vue

@@ -16,7 +16,7 @@ export default defineComponent({
       type: String,
       required: true
     }
-  }
+  },
 })
 </script>
 

src/teleoperation/frontend/src/components/SATask.vue

@@ -28,7 +28,7 @@
       <BasicWaypointEditor :odom="odom" />
     </div>
     <div class="shadow p-3 rounded cameras">
-      <Cameras :primary="true" :isSA="true" :mission="'sa'" />
+      <Cameras :isSA="true" :mission="'sa'" />
     </div>
     <div class="shadow p-3 rounded soildata">
       <SoilData />

src/teleoperation/frontend/src/router/index.ts

@@ -4,6 +4,7 @@ import DMESTask from '../components/DMESTask.vue'
 import AutonTask from '../components/AutonTask.vue'
 import ISHTask from '../components/ISHTask.vue'
 import SATask from '../components/SATask.vue'
+import Cameras from '../components/Cameras.vue'
 import Rover3D from '../components/Rover3D.vue'
 
 const routes = [
@@ -43,12 +44,20 @@ const routes = [
     name: 'ISHTask',
     component: ISHTask
   },
+  {
+    path: '/Cameras',
+    name: 'Cameras',
+    component: Cameras,
+    props: {
+      isSA: false,
+      mission: 'other'
+    }
+  },
   {
     path: "/Control",
     name: "Control",
     component: Rover3D,
   },
-
 ]
 const router = createRouter({
   history: createWebHistory(),

src/teleoperation/gui_chromium.sh

@@ -4,4 +4,6 @@
 # Chromium currently only supports this when using VA-API hardware acceleration
 # It uses the WebCodecs API to decode
 # You can easily test if your setup works with this URL: https://w3c.github.io/webcodecs/samples/video-decode-display/
-chromium --enable-features=VaapiVideoDecodeLinuxGL --app=http://localhost:8080
+readonly FLAGS="--enable-features=VaapiVideoDecodeLinuxGL"
+readonly ADDRESS="http://localhost:8080"
+chromium ${FLAGS} --app=${ADDRESS}/$1

src/teleoperation/gui_chromium_cameras.sh

@@ -0,0 +1,3 @@
+#!/bin/bash
+
+$(dirname $0)/gui_chromium.sh Cameras

src/teleoperation/gui_chromium_menu.sh

@@ -0,0 +1,3 @@
+#!/bin/bash
+
+$(dirname $0)/gui_chromium.sh