From 57840ab97949a8d73a908e9d751532bd7d1716d9 Mon Sep 17 00:00:00 2001
From: jaknapper <jaknapper@hotmail.com>
Date: Thu, 22 May 2025 15:10:16 +0100
Subject: [PATCH 1/4] Force OK to be capitalised in confirmation modals

---
 webapp/src/main.js | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/webapp/src/main.js b/webapp/src/main.js
index ed49dbc1..7844a302 100644
--- a/webapp/src/main.js
+++ b/webapp/src/main.js
@@ -86,6 +86,9 @@ Vue.mixin({
       // Stop GPU preview to show modal
       context.$root.$emit("globalTogglePreview", false);
 
+      // force OK to be capitalised
+      UIkit.modal.i18n = { ok: "OK", cancel: "Cancel" };
+
       var showModal = function(resolve, reject) {
         UIkit.modal
           .confirm(modalText, { stack: true })
@@ -150,7 +153,7 @@ Vue.mixin({
           return `${error.response.data.detail}`;
         }
         // If the response is just some generic error response
-        if (error.response.data){
+        if (error.response.data) {
           return `${error.response.data}`;
         }
         return `${error.response}`;

From 27ed10e27fce4fbc836f6e9ee9fae6e46609b983 Mon Sep 17 00:00:00 2001
From: jaknapper <jaknapper@hotmail.com>
Date: Thu, 22 May 2025 15:11:25 +0100
Subject: [PATCH 2/4] Move shutdown and restart to settings tab, hard set
 server version to prealpha

---
 .../aboutComponents/statusPane.vue            | 41 +----------------
 .../tabContentComponents/settingsContent.vue  | 46 +++++++++++++++++++
 2 files changed, 47 insertions(+), 40 deletions(-)

diff --git a/webapp/src/components/tabContentComponents/aboutComponents/statusPane.vue b/webapp/src/components/tabContentComponents/aboutComponents/statusPane.vue
index e3ca4f35..2d215f06 100644
--- a/webapp/src/components/tabContentComponents/aboutComponents/statusPane.vue
+++ b/webapp/src/components/tabContentComponents/aboutComponents/statusPane.vue
@@ -25,7 +25,7 @@
 
       <div>
         <b>Server Version:</b> <br />
-        TODO
+        V3 (pre-alpha)
       </div>
 
       <hr />
@@ -48,28 +48,6 @@
       </div>
 
       <hr />
-
-      <div class="uk-grid-small uk-child-width-1-2" uk-grid>
-        <div>
-          <button
-            v-show="'shutdown' in things.system_control.actions"
-            class="uk-button uk-button-danger uk-float-right uk-margin uk-margin-remove-top uk-width-1-1"
-            @click="systemRequest('shutdown')"
-          >
-            Shutdown
-          </button>
-        </div>
-
-        <div>
-          <button
-            v-show="'reboot' in things.system_control.actions"
-            class="uk-button uk-button-danger uk-float-right uk-margin uk-margin-remove-top uk-width-1-1"
-            @click="systemRequest('reboot')"
-          >
-            Restart
-          </button>
-        </div>
-      </div>
     </div>
     <div v-else-if="$store.state.waiting">
       Loading...
@@ -82,7 +60,6 @@
 </template>
 
 <script>
-import axios from "axios";
 import ActionButton from "../../labThingsComponents/actionButton.vue";
 
 export default {
@@ -94,22 +71,6 @@ export default {
       return this.$store.getters["wot/thingDescriptions"];
     }
   },
-
-  methods: {
-    systemRequest: function(action) {
-      this.modalConfirm("Restart microscope?").then(
-        () => {
-          this.$store.commit("resetState");
-          this.$store.commit("wot/deleteAllThingDescriptions");
-          // Post and silence errors
-          axios
-            .post(this.thingActionUrl("system_control", action))
-            .catch(() => {});
-        },
-        () => {}
-      );
-    }
-  }
 };
 </script>
 
diff --git a/webapp/src/components/tabContentComponents/settingsContent.vue b/webapp/src/components/tabContentComponents/settingsContent.vue
index 8ccc315d..ec5a0025 100644
--- a/webapp/src/components/tabContentComponents/settingsContent.vue
+++ b/webapp/src/components/tabContentComponents/settingsContent.vue
@@ -63,6 +63,25 @@
         action="save_all_thing_settings"
         submit-label="Save All Settings"
       />
+    <div>
+      <button
+        v-show="'shutdown' in things.system_control.actions"
+        class="uk-button uk-button-primary uk-margin uk-margin-remove-top uk-width-1-1"
+        @click="systemRequest('shutdown')"
+      >
+        Shutdown
+      </button>
+    </div>
+
+    <div>
+      <button
+        v-show="'reboot' in things.system_control.actions"
+        class="uk-button uk-button-primary uk-margin uk-margin-remove-top uk-width-1-1"
+        @click="systemRequest('reboot')"
+      >
+        Restart
+      </button>
+    </div>
     </div>
     <div class="view-component uk-width-expand uk-padding-small">
       <tabContent
@@ -110,6 +129,7 @@
 </template>
 
 <script>
+import axios from "axios";
 import streamSettings from "./settingsComponents/streamSettings.vue";
 import cameraSettings from "./settingsComponents/cameraSettings.vue";
 import appSettings from "./settingsComponents/appSettings.vue";
@@ -135,6 +155,12 @@ export default {
     ActionButton
   },
 
+  computed: {
+    things: function() {
+      return this.$store.getters["wot/thingDescriptions"];
+    }
+  },
+
   data: function() {
     return {
       selected: "display",
@@ -147,6 +173,26 @@ export default {
       if (!(this.currentTab == tab)) {
         this.currentTab = tab;
       }
+    },
+    systemRequest: function(action) {
+      let message = "";
+      if (action == "reboot") {
+        message = "Restart microscope?"
+      }
+      else {
+        message = "Shutdown microscope?"
+      }
+      this.modalConfirm(message).then(
+        () => {
+          this.$store.commit("resetState");
+          this.$store.commit("wot/deleteAllThingDescriptions");
+          // Post and silence errors
+          axios
+            .post(this.thingActionUrl("system_control", action))
+            .catch(() => {});
+        },
+        () => {}
+      );
     }
   }
 };

From 14672c260f6662ce42e9aa2e841e53f1d5e049b1 Mon Sep 17 00:00:00 2001
From: jaknapper <jaknapper@hotmail.com>
Date: Thu, 22 May 2025 16:41:50 +0100
Subject: [PATCH 3/4] Dedicated power menu

---
 webapp/src/components/appContent.vue          |  7 ++
 .../tabContentComponents/powerContent.vue     | 84 +++++++++++++++++++
 .../tabContentComponents/settingsContent.vue  | 46 ----------
 3 files changed, 91 insertions(+), 46 deletions(-)
 create mode 100644 webapp/src/components/tabContentComponents/powerContent.vue

diff --git a/webapp/src/components/appContent.vue b/webapp/src/components/appContent.vue
index fcbf7296..bc292f88 100644
--- a/webapp/src/components/appContent.vue
+++ b/webapp/src/components/appContent.vue
@@ -138,6 +138,7 @@ import viewContent from "./tabContentComponents/viewContent.vue";
 import settingsContent from "./tabContentComponents/settingsContent.vue";
 import aboutContent from "./tabContentComponents/aboutContent.vue";
 import loggingContent from "./tabContentComponents/loggingContent.vue";
+import powerContent from "./tabContentComponents/powerContent.vue";
 // ImJoy is loaded asynchronously to allow it to be disabled if needed
 const imjoyContent = () =>
   import(
@@ -164,6 +165,7 @@ export default {
     aboutContent,
     loggingContent,
     TabIcon,
+    powerContent,
     imjoyContent
   },
   data: function() {
@@ -185,6 +187,11 @@ export default {
           id: "about",
           icon: "info",
           component: aboutContent
+        },
+        {
+          id: "power",
+          icon: "power_settings_new",
+          component: powerContent
         }
       ]
     };
diff --git a/webapp/src/components/tabContentComponents/powerContent.vue b/webapp/src/components/tabContentComponents/powerContent.vue
new file mode 100644
index 00000000..855174d8
--- /dev/null
+++ b/webapp/src/components/tabContentComponents/powerContent.vue
@@ -0,0 +1,84 @@
+<template>
+  <!-- Grid managing tab content -->
+  <div class="center">
+  <h1 style="text-align: center;"> Power</h1>
+  <p style="text-align: center;"> It's essential to turn off your OpenFlexure Microscope here before unplugging it.
+  <br>
+  <br>
+  Unplugging the microscope unexpectedly can damage the SD card or onboard computer.
+  </p>
+    <div class="buttons">
+      <button
+        v-show="'shutdown' in things.system_control.actions"
+        class="uk-button uk-button-primary uk-width-1-3"
+        @click="systemRequest('shutdown')"
+      >
+        Shutdown
+      </button>
+      <button
+        v-show="'reboot' in things.system_control.actions"
+        class="uk-button uk-button-primary uk-width-1-3"
+        @click="systemRequest('reboot')"
+      >
+        Restart
+      </button>
+    </div>
+  </div>
+</template>
+
+<script>
+import axios from "axios";
+
+export default {
+  name: "PowerContent",
+
+  components: {},
+  
+  computed: {
+    things: function() {
+      return this.$store.getters["wot/thingDescriptions"];
+    }
+  },
+
+  methods: {
+  systemRequest: function(action) {
+      let message = "";
+      if (action == "reboot") {
+        message = "Restart microscope?"
+      }
+      else {
+        message = "Shutdown microscope?"
+      }
+      this.modalConfirm(message).then(
+        () => {
+          this.$store.commit("resetState");
+          this.$store.commit("wot/deleteAllThingDescriptions");
+          // Post and silence errors
+          axios
+            .post(this.thingActionUrl("system_control", action))
+            .catch(() => {});
+        },
+        () => {}
+      );
+    }
+  }
+};
+</script>
+
+<style lang="less" scoped>
+// Custom UIkit CSS modifications
+@import "../../assets/less/theme.less";
+
+.center {
+    right: 50%;
+    bottom: 50%;
+    transform: translate(50%,50%);
+    position: absolute;
+}
+
+.uk-button {
+  display: inline;
+  text-align:center;
+  margin: 30px 30px 30px 30px;
+}
+</style>
\ No newline at end of file
diff --git a/webapp/src/components/tabContentComponents/settingsContent.vue b/webapp/src/components/tabContentComponents/settingsContent.vue
index ec5a0025..e7deeca4 100644
--- a/webapp/src/components/tabContentComponents/settingsContent.vue
+++ b/webapp/src/components/tabContentComponents/settingsContent.vue
@@ -63,25 +63,6 @@
         action="save_all_thing_settings"
         submit-label="Save All Settings"
       />
-    <div>
-      <button
-        v-show="'shutdown' in things.system_control.actions"
-        class="uk-button uk-button-primary uk-margin uk-margin-remove-top uk-width-1-1"
-        @click="systemRequest('shutdown')"
-      >
-        Shutdown
-      </button>
-    </div>
-
-    <div>
-      <button
-        v-show="'reboot' in things.system_control.actions"
-        class="uk-button uk-button-primary uk-margin uk-margin-remove-top uk-width-1-1"
-        @click="systemRequest('reboot')"
-      >
-        Restart
-      </button>
-    </div>
     </div>
     <div class="view-component uk-width-expand uk-padding-small">
       <tabContent
@@ -129,7 +110,6 @@
 </template>
 
 <script>
-import axios from "axios";
 import streamSettings from "./settingsComponents/streamSettings.vue";
 import cameraSettings from "./settingsComponents/cameraSettings.vue";
 import appSettings from "./settingsComponents/appSettings.vue";
@@ -155,12 +135,6 @@ export default {
     ActionButton
   },
 
-  computed: {
-    things: function() {
-      return this.$store.getters["wot/thingDescriptions"];
-    }
-  },
-
   data: function() {
     return {
       selected: "display",
@@ -174,26 +148,6 @@ export default {
         this.currentTab = tab;
       }
     },
-    systemRequest: function(action) {
-      let message = "";
-      if (action == "reboot") {
-        message = "Restart microscope?"
-      }
-      else {
-        message = "Shutdown microscope?"
-      }
-      this.modalConfirm(message).then(
-        () => {
-          this.$store.commit("resetState");
-          this.$store.commit("wot/deleteAllThingDescriptions");
-          // Post and silence errors
-          axios
-            .post(this.thingActionUrl("system_control", action))
-            .catch(() => {});
-        },
-        () => {}
-      );
-    }
   }
 };
 </script>

From 69acc8a0ea398dccf956cd577269c549bd11cd08 Mon Sep 17 00:00:00 2001
From: Joe Knapper <joe.knapper@glasgow.ac.uk>
Date: Thu, 22 May 2025 15:56:25 +0000
Subject: [PATCH 4/4] Edit settingsContent.vue

---
 webapp/src/components/tabContentComponents/settingsContent.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/webapp/src/components/tabContentComponents/settingsContent.vue b/webapp/src/components/tabContentComponents/settingsContent.vue
index e7deeca4..8ccc315d 100644
--- a/webapp/src/components/tabContentComponents/settingsContent.vue
+++ b/webapp/src/components/tabContentComponents/settingsContent.vue
@@ -147,7 +147,7 @@ export default {
       if (!(this.currentTab == tab)) {
         this.currentTab = tab;
       }
-    },
+    }
   }
 };
 </script>