From e6649e41d864ee697017b1ebbb0f93c4e5253c95 Mon Sep 17 00:00:00 2001
From: Richard Bowman <richard.bowman@cantab.net>
Date: Mon, 8 Apr 2019 22:44:51 +0100
Subject: [PATCH] Added gain/exposure controls

Also refactored settings pane slightly.
---
 src/components/paneSettings.vue               |   7 +
 .../paneSettingsComponents/cameraSettings.vue | 139 ++++++++++++++++++
 .../microscopeSettings.vue                    |  45 +-----
 3 files changed, 148 insertions(+), 43 deletions(-)
 create mode 100644 src/components/paneSettingsComponents/cameraSettings.vue

diff --git a/src/components/paneSettings.vue b/src/components/paneSettings.vue
index f75a2fee..b963108f 100644
--- a/src/components/paneSettings.vue
+++ b/src/components/paneSettings.vue
@@ -7,6 +7,11 @@
         <div class="uk-accordion-content"><streamSettings/></div>
       </li>
 
+      <li v-if="$store.getters.ready">
+        <a class="uk-accordion-title" href="#">Camera settings</a>
+        <div class="uk-accordion-content"><cameraSettings/></div>
+      </li>
+      
       <li v-if="$store.getters.ready">
         <a class="uk-accordion-title" href="#">Microscope settings</a>
         <div class="uk-accordion-content"><microscopeSettings/></div>
@@ -20,6 +25,7 @@
 <script>
 import streamSettings from './paneSettingsComponents/streamSettings.vue'
 import microscopeSettings from './paneSettingsComponents/microscopeSettings.vue'
+import cameraSettings from './paneSettingsComponents/cameraSettings.vue'
 
 // Export main app
 export default {
@@ -27,6 +33,7 @@ export default {
 
   components: {
     streamSettings,
+    cameraSettings,
     microscopeSettings
   }
 
diff --git a/src/components/paneSettingsComponents/cameraSettings.vue b/src/components/paneSettingsComponents/cameraSettings.vue
new file mode 100644
index 00000000..bca9a316
--- /dev/null
+++ b/src/components/paneSettingsComponents/cameraSettings.vue
@@ -0,0 +1,139 @@
+<template>
+<div id="cameraSettings">
+  <form @submit.prevent="applyConfigRequest">
+      <div>
+        <label class="uk-form-label" for="form-stacked-text">Exposure time</label>
+        <div class="uk-form-controls">
+          <input v-model="shutterSpeed" class="uk-input uk-form-small" type="number">
+        </div>
+      </div>
+
+      <div>
+        <label class="uk-form-label" for="form-stacked-text">Analogue gain</label>
+        <div class="uk-form-controls">
+          <input v-model="analogGain" class="uk-input uk-form-small" type="number">
+        </div>
+      </div>
+
+      <div>
+        <label class="uk-form-label" for="form-stacked-text">Digital gain</label>
+        <div class="uk-form-controls">
+          <input v-model="digitalGain" class="uk-input uk-form-small" type="number">
+        </div>
+      </div>
+
+    <button type="submit" class="uk-button uk-button-primary uk-form-small uk-float-right uk-margin-small uk-width-1-1">Apply Settings</button>
+    
+    <div class="uk-text-center uk-container" v-if="isCalibrating">
+      <div class="center-spinner" uk-spinner></div>
+    </div>
+    <div v-else>
+      <button type="button" v-on:click="recalibrateConfirm()" class="uk-button uk-button-default uk-form-small uk-float-right uk-margin-small uk-width-1-1">Auto-Calibrate</button>
+    </div>
+
+
+  </form>
+
+</div>
+
+</template>
+
+<script>
+import axios from 'axios'
+import UIkit from 'uikit';
+
+// Export main app
+export default {
+  name: 'microscopeSettings',
+
+  data: function () {
+    return {
+      shutterSpeed: this.$store.state.apiConfig.picamera_settings.shutter_speed,
+      analogGain: this.$store.state.apiConfig.picamera_settings.analog_gain,
+      digitalGain: this.$store.state.apiConfig.picamera_settings.digital_gain,
+      isCalibrating: false
+    }
+  },
+
+  methods: {
+    updateInputValues: function () {
+      this.shutterSpeed = this.$store.state.apiConfig.picamera_settings.shutter_speed
+      this.digitalGain = this.$store.state.apiConfig.picamera_settings.digital_gain
+      this.analogGain = this.$store.state.apiConfig.picamera_settings.analog_gain
+    },
+
+    applyConfigRequest: function() {
+      console.log("Applying config to the microscope")
+      var payload = {picamera_settings:{}}
+
+      //if (this.shutterSpeed != this.$store.state.apiConfig.picamera_settings.shutter_speed) {
+      payload.picamera_settings.shutter_speed = this.shutterSpeed
+      payload.picamera_settings.analog_gain = this.analogGain
+      payload.picamera_settings.digital_gain = this.digitalGain
+      //};
+
+      // Send request
+      axios.post(this.configApiUri, payload)
+        .then(response => { return new Promise(r => setTimeout(r, 500))}) // why is there no built-in for this??!
+        .then(response => { 
+          return this.$store.dispatch('updateConfig');
+        })
+        .then(this.updateInputValues)
+        .then(r=>{console.log("Updated Config: ", payload.picamera_settings)})
+        .catch(error => {
+          this.$store.dispatch('handleHTTPError', error);  // Let store handle error
+        })
+    },
+    recalibrateConfirm: function() {
+      var context = this
+      this.modalConfirm('Start recalibration? This may take a while, and the microscope will be locked during this time.')
+        .then(function() {
+          context.recalibrateRequest()
+        }, function () {
+          console.log('Rejected recalibration.')
+        })
+    },
+    recalibrateRequest: function() {
+      // Send move request
+      axios.post(this.recalibrateApiUri)
+        .then(response => { 
+          console.log("Task ID: " + response.data.id)
+          this.isCalibrating = true
+          return this.$store.dispatch('pollTask', [response.data.id, null, null])
+        })
+        .then(() => {
+          UIkit.notification({message: "Finished recalibration.", status: 'success'})
+          return new Promise(r => setTimeout(r, 500)) // wait 500ms before updating config, so it's fresh
+        })
+        .then(() => {
+          return this.$store.dispatch('updateConfig');
+        })
+        .then(this.updateInputValues)
+        .catch(error => {
+          this.$store.dispatch('handleHTTPError', error);  // Let store handle error
+        })
+        .finally(() => {
+          this.isCalibrating = false
+        })
+    }
+
+  },
+
+  computed: {
+    recalibrateApiUri: function () {
+      return this.$store.getters.uri + "/plugin/default/camera_calibration/recalibrate"
+    },
+    configApiUri: function () {
+      return this.$store.getters.uri + "/config"
+    }
+  }
+
+}
+</script>
+
+<style lang="less">
+.center-spinner {
+  margin-left: auto;
+  margin-right: auto
+}
+</style>
diff --git a/src/components/paneSettingsComponents/microscopeSettings.vue b/src/components/paneSettingsComponents/microscopeSettings.vue
index 199d492c..cbe944c2 100644
--- a/src/components/paneSettingsComponents/microscopeSettings.vue
+++ b/src/components/paneSettingsComponents/microscopeSettings.vue
@@ -1,14 +1,6 @@
 <template>
 <div id="microscopeSettings">
   <form @submit.prevent="applyConfigRequest">
-    <h4>Camera</h4>
-    <div class="uk-text-center uk-container" v-if="isCalibrating">
-      <div class="center-spinner" uk-spinner></div>
-    </div>
-    <div v-else>
-      <button type="button" v-on:click="recalibrateConfirm()" class="uk-button uk-button-default uk-form-small uk-float-right uk-margin-small uk-width-1-1">Auto-Calibrate</button>
-    </div>
-
     <h4>Stage</h4>
 
     <label class="uk-form-label" for="form-stacked-text">Backlash compensation</label>
@@ -61,8 +53,7 @@ export default {
   data: function () {
     return {
       microscopeName: this.$store.state.apiConfig.name,
-      stageBacklash: this.$store.state.apiConfig.backlash,
-      isCalibrating: false
+      stageBacklash: this.$store.state.apiConfig.backlash
     }
   },
 
@@ -72,35 +63,6 @@ export default {
       this.stageBacklash = this.$store.state.apiConfig.backlash
     },
 
-    recalibrateConfirm: function() {
-      var context = this
-      this.modalConfirm('Start recalibration? This may take a while, and the microscope will be locked during this time.')
-        .then(function() {
-          context.recalibrateRequest()
-        }, function () {
-          console.log('Rejected recalibration.')
-        })
-    },
-
-    recalibrateRequest: function() {
-      // Send move request
-      axios.post(this.recalibrateApiUri)
-        .then(response => { 
-          console.log("Task ID: " + response.data[0].id)
-          this.isCalibrating = true
-          return this.$store.dispatch('pollTask', [response.data[0].id, null, null])
-        })
-        .then(() => {
-          UIkit.notification({message: "Finished recalibration.", status: 'success'})
-        })
-        .catch(error => {
-          this.$store.dispatch('handleHTTPError', error);  // Let store handle error
-        })
-        .finally(() => {
-          this.isCalibrating = false
-        })
-    },
-
     applyConfigRequest: function() {
       var payload = {}
 
@@ -112,7 +74,7 @@ export default {
         payload.backlash = this.stageBacklash
       }
 
-      // Send move request
+      // Send request to update config
       axios.post(this.configApiUri, payload)
         .then(response => { 
           this.$store.dispatch('updateConfig');
@@ -127,9 +89,6 @@ export default {
   },
 
   computed: {
-    recalibrateApiUri: function () {
-      return this.$store.getters.uri + "/plugin/default/camera_calibration/recalibrate"
-    },
     configApiUri: function () {
       return this.$store.getters.uri + "/config"
     }