Incremental improvements to photo mode

stephendade · Oct 15, 2024 · decb65e · decb65e
1 parent 9472865
commit decb65e
Show file tree

Hide file tree

Showing 4 changed files with 49 additions and 18 deletions.
diff --git a/server/index.js b/server/index.js
@@ -490,7 +490,7 @@ app.get('/api/videodevices', (req, res) => {
         enableCameraHeartbeat: useCameraHeartbeat,
         enableMavControl: useMavControl,
         mavStreamSelected: selMavURI,
-        mediaPathSelected: selMediaPath
+        mediaPath: selMediaPath
       }))
     } else {
       res.setHeader('Content-Type', 'application/json')
@@ -758,7 +758,7 @@ app.post('/api/startstopvideo', [check('active').isBoolean(),
   vManager.startStopStreaming(req.body.active, req.body.device, req.body.height, req.body.width, req.body.format,
     req.body.rotation, req.body.bitrate, req.body.fps, req.body.useUDP, req.body.usePhotoMode, req.body.useUDPIP,
     req.body.useUDPPort, req.body.useTimestamp, req.body.useCameraHeartbeat, req.body.useMavControl, req.body.mavStreamSelected,
-    req.body.mediaPathSelected, (err, status, addresses) => {
+    req.body.mediaPath, (err, status, addresses) => {
     if (!err) {
       res.setHeader('Content-Type', 'application/json')
       const ret = { streamingStatus: status, streamAddresses: addresses }

diff --git a/server/videostream.js b/server/videostream.js
@@ -30,20 +30,21 @@ class videoStream {
     // need to scan for video devices first though
     if (this.active) {
       this.active = false
-      this.getVideoDevices((error, devices, active, seldevice, selRes, selRot, selbitrate, selfps, selUDP, selPhotoMode, selUDPIP, selUDPPort, useTimestamp, useCameraHeartbeat, useMavControl, selMavURI) => {
+      this.getVideoDevices((error, devices, active, seldevice, selRes, selRot, selbitrate, selfps, selUDP, selPhotoMode, selUDPIP, selUDPPort, useTimestamp, useCameraHeartbeat, useMavControl, selMavURI, selMediaPath) => {
         if (!error) {
           this.startStopStreaming(true, this.savedDevice.device, this.savedDevice.height,
             this.savedDevice.width, this.savedDevice.format,
             this.savedDevice.rotation, this.savedDevice.bitrate, this.savedDevice.fps, this.savedDevice.useUDP, this.savedDevice.usePhotoMode,
-            this.savedDevice.useUDPIP, this.savedDevice.useUDPPort, this.savedDevice.useTimestamp, this.savedDevice.useCameraHeartbeat, this.savedDevice.useMavControl,
-            this.savedDevice.mavStreamSelected, this.savedDevice.mediaPath,
+            this.savedDevice.useUDPIP, this.savedDevice.useUDPPort, this.savedDevice.useTimestamp, this.savedDevice.useCameraHeartbeat,
+            this.savedDevice.useMavControl, this.savedDevice.mavStreamSelected, this.savedDevice.mediaPath,
             (err, status, addresses) => {
               if (err) {
                 // failed setup, reset settings
                 console.log('Reset video4')
                 this.resetVideo()
               }
             })
+          this.winston.info("Media path is: ", this.savedDevice.mediaPath)
         } else {
           // failed setup, reset settings
           console.log('Reset video3')
@@ -67,7 +68,8 @@ class videoStream {
   // video streaming
   getVideoDevices (callback) {
     // get all video device details
-    // callback is: err, devices, active, seldevice, selRes, selRot, selbitrate, selfps, SeluseUDP, SelusePhotoMode, SeluseUDPIP, SeluseUDPPort, timestamp, fps, FPSMax, vidres, cameraHeartbeat, mavControl, selMavURI
+    // callback is: err, devices, active, seldevice, selRes, selRot, selbitrate, selfps, SeluseUDP, SelusePhotoMode, SeluseUDPIP,
+    // SeluseUDPPort, timestamp, fps, FPSMax, vidres, cameraHeartbeat, mavControl, selMavURI, selMediaPath
     exec('python3 ./python/gstcaps.py', (error, stdout, stderr) => {
       const warnstrings = ['DeprecationWarning', 'gst_element_message_full_with_details', 'camera_manager.cpp', 'Unsupported V4L2 pixel format']
       if (stderr && !warnstrings.some(wrn => stderr.includes(wrn))) {
@@ -86,7 +88,7 @@ class videoStream {
           return callback(null, this.devices, this.active, this.devices[0], this.devices[0].caps[0],
             { label: '0°', value: 0 }, 1100, fpsSelected, false, false, '127.0.0.1', 5400, false,
             (this.devices[0].caps[0].fps !== undefined) ? this.devices[0].caps[0].fps : [],
-            this.devices[0].caps[0].fpsmax, this.devices[0].caps, false, false, { label: '127.0.0.1', value: 0 })
+            this.devices[0].caps[0].fpsmax, this.devices[0].caps, false, false, { label: '127.0.0.1', value: 0 }, '/home/pi/Rpanion-server/media/')
         } else {
           // format saved settings
           const seldevice = this.devices.filter(it => it.value === this.savedDevice.device)
@@ -98,7 +100,7 @@ class videoStream {
             return callback(null, this.devices, this.active, this.devices[0], this.devices[0].caps[0],
               { label: '0°', value: 0 }, 1100, fpsSelected, false, false, '127.0.0.1', 5400, false,
               (this.devices[0].caps[0].fps !== undefined) ? this.devices[0].caps[0].fps : [],
-              this.devices[0].caps[0].fpsmax, this.devices[0].caps, false, false, { label: '127.0.0.1', value: 0 }, '/home/Rpanion-server/')
+              this.devices[0].caps[0].fpsmax, this.devices[0].caps, false, false, { label: '127.0.0.1', value: 0 }, '/home/pi/Rpanion-server/media/')
           }
           const selRes = seldevice[0].caps.filter(it => it.value === this.savedDevice.width.toString() + 'x' + this.savedDevice.height.toString() + 'x' + this.savedDevice.format.toString().split('/')[1])
           let selFPS = this.savedDevice.fps
@@ -114,7 +116,7 @@ class videoStream {
               this.savedDevice.useUDPPort, this.savedDevice.useTimestamp, (selRes[0].fps !== undefined) ? selRes[0].fps : [],
               selRes[0].fpsmax, seldevice[0].caps, this.savedDevice.useCameraHeartbeat, this.savedDevice.useMavControl,
               { label: this.savedDevice.mavStreamSelected.toString(), value: this.savedDevice.mavStreamSelected },
-              '/home/Rpanion-server/',
+              this.savedDevice.mediaPath
             )
           } else {
             // bad settings
@@ -125,7 +127,7 @@ class videoStream {
               { label: '0°', value: 0 }, 1100, fpsSelected, false, false, '127.0.0.1', 5400, false,
               (this.devices[0].caps[0].fps !== undefined) ? this.devices[0].caps[0].fps : [],
               this.devices[0].caps[0].fpsmax, this.devices[0].caps, false, false, { label: '127.0.0.1', value: 0 },
-              '/home/Rpanion-server/')
+              '/home/pi/Rpanion-server/media/')
           }
         }
       }
@@ -217,6 +219,8 @@ class videoStream {
         mediaPath
       }
 
+      this.winston.info("from startStopStreamning(), media path is: ", this.savedDevice.mediaPath)
+
       // Don't start a video stream if we are in photo mode
       if (this.savedDevice.usePhotoMode){
         console.log("Started photo mode")
@@ -341,6 +345,7 @@ class videoStream {
       console.log('Video current same')
       this.winston.info('Video current same')
       return callback(null, this.active, this.deviceAddresses)
+      this.winston.info("From startstopstreaming, mediapath is: ", this.mediaPath)
     }
     // user wants to start or stop streaming
     if (active) {

diff --git a/server/videostream.test.js b/server/videostream.test.js
@@ -31,7 +31,9 @@ describe('Video Functions', function () {
     const vManager = new VideoStream(settings, winston)
 
     vManager.populateAddresses()
-    vManager.getVideoDevices(function (err, devices, active, seldevice, selRes, selRot, selbitrate, selfps, SeluseUDP, SelusePhotoMode, SeluseUDPIP, SeluseUDPPort, timestamp, fps, FPSMax, vidres, selMavURI) {
+    vManager.getVideoDevices(function (err, devices, active, seldevice, selRes, selRot, selbitrate, selfps,
+      SeluseUDP, SelusePhotoMode, SeluseUDPIP, SeluseUDPPort, timestamp, fps, FPSMax, vidres,
+      useCameraHeartbeat, useMavControl, selMavURI, selMediaPath) {
       assert.equal(err, null)
       assert.equal(active, false)
       assert.notEqual(seldevice, null)
@@ -47,7 +49,10 @@ describe('Video Functions', function () {
       assert.notEqual(fps, null)
       assert.notEqual(FPSMax, null)
       assert.notEqual(vidres, null)
+      assert.equal(useCameraHeartbeat, false)
+      assert.equal(useMavControl, false)
       assert.notEqual(selMavURI, null)
+      assert.equal(selMediaPath, '/home/pi/Rpanion-server/media/')
       done()
     })
   }).timeout(5000)
@@ -64,15 +69,26 @@ describe('Video Functions', function () {
     settings.clear()
     const vManager = new VideoStream(settings, winston)
 
-    vManager.startStopStreaming(true, 'testsrc', '1080', '1920', 'video/x-h264', '0', '1000', '5', false, false, false, false, true, false, false, '0', '~/Rpanion-server/media/', function (err, status, addresses) {
+    vManager.startStopStreaming(true, 'testsrc', '1080', '1920', 'video/x-h264', '0', '1000', '5', false, false, false, false, true, false, false, '0', '/home/pi/Rpanion-server/media/', function (err, status, addresses) {
       assert.equal(err, null)
       assert.equal(status, true)
       assert.notEqual(vManager.deviceStream.pid, null)
-      vManager.startStopStreaming(false, 'testsrc', '1080', '1920', 'video/x-h264', '0', '1000', '5', false, false, false, false, true, false, false, '0', '~/Rpanion-server/media/', function (err, status, addresses) {
+      vManager.startStopStreaming(false, 'testsrc', '1080', '1920', 'video/x-h264', '0', '1000', '5', false, false, false, false, true, false, false, '0', '/home/pi/Rpanion-server/media/', function (err, status, addresses) {
         assert.equal(err, null)
         assert.equal(status, false)
         done()
       })
     })
   })
+
+  // it('should fire a cameratrigger event', function(done) {
+  //   settings.clear()
+  //   const vManager = new VideoStream(settings, winston)
+
+  //   vManager.captureStillPhoto( function () {
+  //     //assert.equal(vManager.photoSeq, 1)
+  //     done()
+  //   })
+  // })
+
 })
diff --git a/src/video.js b/src/video.js
@@ -132,11 +132,16 @@ class VideoPage extends basePage {
     // Allow MAVLink-connected devices to control the camera
     this.setState({ enableMavControl: !this.state.enableMavControl });
   }
+
   handleMavStreamChange = (value) => {
     //new value for selected stream IP
     this.setState({ mavStreamSelected: value });
   }
 
+  handleMediaPathChange = (event) => {
+    this.setState({ mediaPath: event.target.value});
+  }
+
   handleCaptureStill = (event) => {
     fetch('/api/capturestillphoto', {
       method: 'POST',
@@ -199,7 +204,7 @@ class VideoPage extends basePage {
                 </div>
                 <div className="form-check">
                   <input className="form-check-input" type="radio" name="cameramode" value="photo" disabled={this.state.streamingStatus} onChange={this.handleUsePhotoModeChange} checked={this.state.photoMode} />
-                  <label className="form-check-label">Photography Mode</label>
+                  <label className="form-check-label">Still Photo Capture</label>
                 </div>
               </div>
         </div>
@@ -275,11 +280,16 @@ class VideoPage extends basePage {
           </div>
         </div>
 
-        <div className = "photomode" style = {{display: (this.state.streamingStatus && this.state.photoMode ? "block" : "none")}}>
-          <p><i>Photo mode stuff goes here</i></p>
+        <div className = "photomode" style = {{display: (this.state.photoMode ? "block" : "none")}}>
           <div className="form-group row" style={{ marginBottom: '5px' }}>
-            <div className="col-sm-8">
-              <Button onClick={this.handleCaptureStill} className="btn btn-primary">Take Photo Now</Button>
+          <label className="col-sm-4 col-form-label ">Media Storage Path</label>
+              <div className="col-sm-8">
+                <input type="text" size="35" name="mediastoragepath" disabled={this.state.streamingStatus} value={this.state.mediaPath} onChange={this.handleMediaPathChange} />
+                <br/>
+                <br/>
+              </div>
+            <div className="col-sm-8" style={{ display: (this.state.streamingStatus) ? "block" : "none" }}>
+              <Button onClick={this.handleCaptureStill} className="btn btn-primary" >Take Photo Now</Button>
             </div>
           </div>
           <br/>