From fc86745006a6e15e2221f4bab122a254d3e4a02a Mon Sep 17 00:00:00 2001
From: Richard Bowman <richard.bowman@cantab.net>
Date: Tue, 9 Feb 2021 10:19:56 +0000
Subject: [PATCH 1/9] Fix whitespace

---
 .../tabContentComponents/aboutComponents/devTools.vue       | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/openflexure_microscope/api/static/src/components/tabContentComponents/aboutComponents/devTools.vue b/openflexure_microscope/api/static/src/components/tabContentComponents/aboutComponents/devTools.vue
index f0372c94..fecf56de 100644
--- a/openflexure_microscope/api/static/src/components/tabContentComponents/aboutComponents/devTools.vue
+++ b/openflexure_microscope/api/static/src/components/tabContentComponents/aboutComponents/devTools.vue
@@ -24,9 +24,9 @@ export default {
   },
 
   mounted() {
-    if (localStorage.overrideOrigin){
+    if (localStorage.overrideOrigin) {
       this.newOrigin = localStorage.overrideOrigin;
-    }else{
+    } else {
       this.newOrigin = "http://microscope.local:5000";
     }
   },
@@ -34,7 +34,7 @@ export default {
   methods: {
     overrideAPIHost: function() {
       this.$store.commit("changeOrigin", this.newOrigin);
-      localStorage.overrideOrigin = this.newOrigin
+      localStorage.overrideOrigin = this.newOrigin;
     }
   }
 };

From 1f3ba2bff10e0228bbf4c8163d48dd5fd6083f1f Mon Sep 17 00:00:00 2001
From: Richard Bowman <richard.bowman@cantab.net>
Date: Tue, 23 Feb 2021 15:54:28 +0000
Subject: [PATCH 2/9] Allow origin to be overridden by query

Specifying overrideOrigin in the URL now
sets up the store with the modified origin.
This is intended for development, and makes it
much less annoying to develop with a Vue dev server.
---
 openflexure_microscope/api/static/src/store.js | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

diff --git a/openflexure_microscope/api/static/src/store.js b/openflexure_microscope/api/static/src/store.js
index 8b92ca38..31f1fd0a 100644
--- a/openflexure_microscope/api/static/src/store.js
+++ b/openflexure_microscope/api/static/src/store.js
@@ -3,9 +3,22 @@ import Vuex from "vuex";
 
 Vue.use(Vuex);
 
+function getOriginFromLocation(){
+  // This will default to the same origin that's serving
+  // the web app - but can be overridden by the URL.
+  // See also devTools.vue which can change the origin.
+  let url = new URL(window.location.href);
+  let origin = url.searchParams.get("overrideOrigin");
+  if(origin){
+    return origin;
+  }else{
+    return url.origin;
+  }
+}
+
 export default new Vuex.Store({
   state: {
-    origin: window.location.origin,
+    origin: getOriginFromLocation(),
     available: false,
     waiting: false,
     error: "",

From a7bb0f9423956a39ea5493d8b688cebb3f3c0ed3 Mon Sep 17 00:00:00 2001
From: Richard Bowman <richard.bowman@cantab.net>
Date: Tue, 23 Feb 2021 15:56:15 +0000
Subject: [PATCH 3/9] Reset tour button and URL origin

Reset tour button resets the local storage used to mark the tour
as done.

Overriding the origin can now be done with a query string.
This will load the store with the new origin from the start,
so might be better for testing some things.
I'm not worried about unexpected bugs, as it is quite obvious
from the URL what's going on.
---
 .../aboutComponents/devTools.vue              | 37 ++++++++++++++++---
 1 file changed, 32 insertions(+), 5 deletions(-)

diff --git a/openflexure_microscope/api/static/src/components/tabContentComponents/aboutComponents/devTools.vue b/openflexure_microscope/api/static/src/components/tabContentComponents/aboutComponents/devTools.vue
index fecf56de..08f47e9b 100644
--- a/openflexure_microscope/api/static/src/components/tabContentComponents/aboutComponents/devTools.vue
+++ b/openflexure_microscope/api/static/src/components/tabContentComponents/aboutComponents/devTools.vue
@@ -1,12 +1,26 @@
 <template>
   <div>
-    <form class="uk-form-stacked" @submit.prevent="overrideAPIHost">
+    <form 
+      class="uk-form-stacked" 
+      @submit="overrideAPIHost"
+      action=""
+      method="GET">
       <label class="uk-form-label">Override API origin</label>
-      <input v-model="newOrigin" class="uk-input" type="text" />
+      <input v-model="newOrigin" name="overrideOrigin" class="uk-input" type="text" />
+      <label class="uk-form-label" >
+        <input v-model="reloadWhenOverridingOrigin" class="uk-input uk-checkbox" type="checkbox" />
+        Reload web app with new origin
+      </label>
       <button class="uk-button uk-button-default uk-margin-small">
         Apply
       </button>
     </form>
+    <form class="uk-form-stacked" @submit.prevent="resetTour">
+      <label class="uk-form-label">Re-run tour on next load</label>
+      <button class="uk-button uk-button-default uk-margin-small">
+        Reset
+      </button>
+    </form>
   </div>
 </template>
 
@@ -19,7 +33,8 @@ export default {
 
   data: function() {
     return {
-      newOrigin: this.$store.state.origin
+      newOrigin: this.$store.state.origin,
+      reloadWhenOverridingOrigin: true
     };
   },
 
@@ -32,9 +47,21 @@ export default {
   },
 
   methods: {
-    overrideAPIHost: function() {
-      this.$store.commit("changeOrigin", this.newOrigin);
+    overrideAPIHost: function(event) {
+      // Save the origin override, so that if we reload the web app, you can easily
       localStorage.overrideOrigin = this.newOrigin;
+      
+      // If we have elected not to reload the interface, just update the origin
+      // in the store.  Otherwise, the form's default action will do the job for us.
+      // TODO: preserve other query parameters when reloading
+      if(!this.reloadWhenOverridingOrigin){
+        this.$store.commit("changeOrigin", this.newOrigin);
+        event.preventDefault();
+      }
+    },
+    resetTour: function() {
+      // Make the introduction tour run next time the app loads
+      this.setLocalStorageObj("completedTour", false);
     }
   }
 };

From 8624e45df49fedd8ec9224080c2bd0452fb7b048 Mon Sep 17 00:00:00 2001
From: Richard Bowman <richard.bowman@cantab.net>
Date: Tue, 23 Feb 2021 17:36:58 +0000
Subject: [PATCH 4/9] Axios version bump and vuex-map-fields

vuex-map-fields cleans up code when mapping
store state to local computed properties.
---
 .../api/static/package-lock.json              | 235 ++++++++----------
 .../api/static/package.json                   |   5 +-
 2 files changed, 110 insertions(+), 130 deletions(-)

diff --git a/openflexure_microscope/api/static/package-lock.json b/openflexure_microscope/api/static/package-lock.json
index f8a024be..1a855c5a 100644
--- a/openflexure_microscope/api/static/package-lock.json
+++ b/openflexure_microscope/api/static/package-lock.json
@@ -2917,16 +2917,6 @@
           "integrity": "sha512-bY6fj56OUQ0hU1KjFNDQuJFezqKdrAyFdIevADiqrWHwSlbmBNMHp5ak2f40Pm8JTFyM2mqxkG6ngkHO11f/lg==",
           "dev": true
         },
-        "ansi-styles": {
-          "version": "4.3.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
-          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "color-convert": "^2.0.1"
-          }
-        },
         "browserslist": {
           "version": "4.15.0",
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.15.0.tgz",
@@ -2972,36 +2962,12 @@
           "integrity": "sha512-8cEsSMwXfx7lWSUMA2s08z9dIgsnR5NAqjXP23stdsU3AUWkCr/rr4s4OFtHXn5XXr6+7kam3QFVoYyXNPdJPA==",
           "dev": true
         },
-        "color-convert": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
-          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "color-name": "~1.1.4"
-          }
-        },
-        "color-name": {
-          "version": "1.1.4",
-          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
-          "dev": true,
-          "optional": true
-        },
         "electron-to-chromium": {
           "version": "1.3.615",
           "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.615.tgz",
           "integrity": "sha512-fNYTQXoUhNc6RmHDlGN4dgcLURSBIqQCN7ls6MuQ741+NJyLNRz8DxAC+pZpOKfRs6cfY0lv2kWdy8Oxf9j4+A==",
           "dev": true
         },
-        "emojis-list": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-3.0.0.tgz",
-          "integrity": "sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==",
-          "dev": true,
-          "optional": true
-        },
         "fast-deep-equal": {
           "version": "3.1.3",
           "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
@@ -3035,35 +3001,6 @@
           "integrity": "sha512-WjKPNJF79dtJAVniUlGGWHYGz2jWxT6VhN/4m1NdkbZ2nOsEF+cI1Edgql5zCRhs/VsQYRvrXctxktVXZUkixw==",
           "dev": true
         },
-        "has-flag": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
-          "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
-          "dev": true,
-          "optional": true
-        },
-        "json5": {
-          "version": "2.1.3",
-          "resolved": "https://registry.npmjs.org/json5/-/json5-2.1.3.tgz",
-          "integrity": "sha512-KXPvOm8K9IJKFM0bmdn8QXh7udDh1g/giieX0NLCaMnb4hEiVFqnop2ImTXCc5e0/oHz3LTqmHGtExn5hfMkOA==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "minimist": "^1.2.5"
-          }
-        },
-        "loader-utils": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz",
-          "integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "big.js": "^5.2.2",
-            "emojis-list": "^3.0.0",
-            "json5": "^2.1.2"
-          }
-        },
         "locate-path": {
           "version": "5.0.0",
           "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
@@ -3197,16 +3134,6 @@
             "ansi-regex": "^5.0.0"
           }
         },
-        "supports-color": {
-          "version": "7.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
-          "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "has-flag": "^4.0.0"
-          }
-        },
         "terser-webpack-plugin": {
           "version": "2.3.8",
           "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-2.3.8.tgz",
@@ -3233,31 +3160,6 @@
             "psl": "^1.1.28",
             "punycode": "^2.1.1"
           }
-        },
-        "vue-loader-v16": {
-          "version": "npm:vue-loader@16.1.1",
-          "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.1.1.tgz",
-          "integrity": "sha512-wz/+HFg/3SBayHWAlZXARcnDTl3VOChrfW9YnxvAweiuyKX/7IGx1ad/4yJHmwhgWlOVYMAbTiI7GV8G33PfGQ==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "chalk": "^4.1.0",
-            "hash-sum": "^2.0.0",
-            "loader-utils": "^2.0.0"
-          },
-          "dependencies": {
-            "chalk": {
-              "version": "4.1.0",
-              "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.0.tgz",
-              "integrity": "sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A==",
-              "dev": true,
-              "optional": true,
-              "requires": {
-                "ansi-styles": "^4.1.0",
-                "supports-color": "^7.1.0"
-              }
-            }
-          }
         }
       }
     },
@@ -3917,38 +3819,12 @@
       "dev": true
     },
     "axios": {
-      "version": "0.19.2",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-0.19.2.tgz",
-      "integrity": "sha512-fjgm5MvRHLhx+osE2xoekY70AhARk3a6hkN+3Io1jc00jtquGvxYlKlsFUhmUET0V5te6CcZI7lcv2Ym61mjHA==",
+      "version": "0.21.1",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.1.tgz",
+      "integrity": "sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==",
       "dev": true,
       "requires": {
-        "follow-redirects": "1.5.10"
-      },
-      "dependencies": {
-        "debug": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
-          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
-          "dev": true,
-          "requires": {
-            "ms": "2.0.0"
-          }
-        },
-        "follow-redirects": {
-          "version": "1.5.10",
-          "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz",
-          "integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
-          "dev": true,
-          "requires": {
-            "debug": "=3.1.0"
-          }
-        },
-        "ms": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-          "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
-          "dev": true
-        }
+        "follow-redirects": "^1.10.0"
       }
     },
     "babel-eslint": {
@@ -13811,6 +13687,104 @@
         }
       }
     },
+    "vue-loader-v16": {
+      "version": "npm:vue-loader@16.1.2",
+      "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.1.2.tgz",
+      "integrity": "sha512-8QTxh+Fd+HB6fiL52iEVLKqE9N1JSlMXLR92Ijm6g8PZrwIxckgpqjPDWRP5TWxdiPaHR+alUWsnu1ShQOwt+Q==",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "chalk": "^4.1.0",
+        "hash-sum": "^2.0.0",
+        "loader-utils": "^2.0.0"
+      },
+      "dependencies": {
+        "ansi-styles": {
+          "version": "4.3.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "color-convert": "^2.0.1"
+          }
+        },
+        "chalk": {
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.0.tgz",
+          "integrity": "sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "ansi-styles": "^4.1.0",
+            "supports-color": "^7.1.0"
+          }
+        },
+        "color-convert": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "color-name": "~1.1.4"
+          }
+        },
+        "color-name": {
+          "version": "1.1.4",
+          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+          "dev": true,
+          "optional": true
+        },
+        "emojis-list": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-3.0.0.tgz",
+          "integrity": "sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==",
+          "dev": true,
+          "optional": true
+        },
+        "has-flag": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+          "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+          "dev": true,
+          "optional": true
+        },
+        "json5": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.0.tgz",
+          "integrity": "sha512-f+8cldu7X/y7RAJurMEJmdoKXGB/X550w2Nr3tTbezL6RwEE/iMcm+tZnXeoZtKuOq6ft8+CqzEkrIgx1fPoQA==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "minimist": "^1.2.5"
+          }
+        },
+        "loader-utils": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz",
+          "integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "big.js": "^5.2.2",
+            "emojis-list": "^3.0.0",
+            "json5": "^2.1.2"
+          }
+        },
+        "supports-color": {
+          "version": "7.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+          "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "has-flag": "^4.0.0"
+          }
+        }
+      }
+    },
     "vue-observe-visibility": {
       "version": "0.4.6",
       "resolved": "https://registry.npmjs.org/vue-observe-visibility/-/vue-observe-visibility-0.4.6.tgz",
@@ -13874,6 +13848,11 @@
       "integrity": "sha512-W74OO2vCJPs9/YjNjW8lLbj+jzT24waTo2KShI8jLvJW8OaIkgb3wuAMA7D+ZiUxDOx3ubwSZTaJBip9G8a3aQ==",
       "dev": true
     },
+    "vuex-map-fields": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/vuex-map-fields/-/vuex-map-fields-1.4.1.tgz",
+      "integrity": "sha512-jvIcpvoIPqwvJCOfRkPU9Rj0EbjWuk7GlNC5LXU9mCXVGZph6bWGHZssnoUzpLMxJtXQEHoVyZkKf7YQV+/bnQ=="
+    },
     "watchpack": {
       "version": "1.7.4",
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.7.4.tgz",
diff --git a/openflexure_microscope/api/static/package.json b/openflexure_microscope/api/static/package.json
index a0d8b116..c05324b1 100644
--- a/openflexure_microscope/api/static/package.json
+++ b/openflexure_microscope/api/static/package.json
@@ -13,14 +13,15 @@
   "dependencies": {
     "material-design-icons": "^3.0.1",
     "mousetrap": "^1.6.5",
-    "vue-observe-visibility": "^0.4.6"
+    "vue-observe-visibility": "^0.4.6",
+    "vuex-map-fields": "^1.4.1"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "^3.12.1",
     "@vue/cli-plugin-eslint": "^4.5.9",
     "@vue/cli-service": "^4.5.9",
     "@vue/eslint-config-prettier": "^6.0.0",
-    "axios": "^0.19.2",
+    "axios": "^0.21.1",
     "babel-eslint": "^10.1.0",
     "css-loader": "^3.6.0",
     "eslint": "^6.8.0",

From 03a4f36556814cecde20ab7e822446fc5e095ca7 Mon Sep 17 00:00:00 2001
From: Richard Bowman <richard.bowman@cantab.net>
Date: Mon, 1 Mar 2021 12:20:04 +0000
Subject: [PATCH 5/9] Remove spurious GPU preview event

---
 .../tabContentComponents/settingsComponents/featuresSettings.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/openflexure_microscope/api/static/src/components/tabContentComponents/settingsComponents/featuresSettings.vue b/openflexure_microscope/api/static/src/components/tabContentComponents/settingsComponents/featuresSettings.vue
index 8d2fbde2..581d7c0f 100644
--- a/openflexure_microscope/api/static/src/components/tabContentComponents/settingsComponents/featuresSettings.vue
+++ b/openflexure_microscope/api/static/src/components/tabContentComponents/settingsComponents/featuresSettings.vue
@@ -33,7 +33,6 @@ export default {
       },
       set(value) {
         this.$store.commit("changeIHIEnabled", value);
-        this.$root.$emit("globalSafeTogglePreview", value);
       }
     }
   },

From e14800b549040463c75a0989133b7d1670333816 Mon Sep 17 00:00:00 2001
From: Richard <richard.bowman@cantab.net>
Date: Tue, 27 Apr 2021 14:28:08 +0100
Subject: [PATCH 6/9] linter fixes

---
 .../aboutComponents/devTools.vue              | 28 +++++++++++++------
 .../api/static/src/store.js                   |  6 ++--
 2 files changed, 22 insertions(+), 12 deletions(-)

diff --git a/openflexure_microscope/api/static/src/components/tabContentComponents/aboutComponents/devTools.vue b/openflexure_microscope/api/static/src/components/tabContentComponents/aboutComponents/devTools.vue
index 08f47e9b..0bcc9cb5 100644
--- a/openflexure_microscope/api/static/src/components/tabContentComponents/aboutComponents/devTools.vue
+++ b/openflexure_microscope/api/static/src/components/tabContentComponents/aboutComponents/devTools.vue
@@ -1,14 +1,24 @@
 <template>
   <div>
-    <form 
-      class="uk-form-stacked" 
-      @submit="overrideAPIHost"
+    <form
+      class="uk-form-stacked"
       action=""
-      method="GET">
+      method="GET"
+      @submit="overrideAPIHost"
+    >
       <label class="uk-form-label">Override API origin</label>
-      <input v-model="newOrigin" name="overrideOrigin" class="uk-input" type="text" />
-      <label class="uk-form-label" >
-        <input v-model="reloadWhenOverridingOrigin" class="uk-input uk-checkbox" type="checkbox" />
+      <input
+        v-model="newOrigin"
+        name="overrideOrigin"
+        class="uk-input"
+        type="text"
+      />
+      <label class="uk-form-label">
+        <input
+          v-model="reloadWhenOverridingOrigin"
+          class="uk-input uk-checkbox"
+          type="checkbox"
+        />
         Reload web app with new origin
       </label>
       <button class="uk-button uk-button-default uk-margin-small">
@@ -50,11 +60,11 @@ export default {
     overrideAPIHost: function(event) {
       // Save the origin override, so that if we reload the web app, you can easily
       localStorage.overrideOrigin = this.newOrigin;
-      
+
       // If we have elected not to reload the interface, just update the origin
       // in the store.  Otherwise, the form's default action will do the job for us.
       // TODO: preserve other query parameters when reloading
-      if(!this.reloadWhenOverridingOrigin){
+      if (!this.reloadWhenOverridingOrigin) {
         this.$store.commit("changeOrigin", this.newOrigin);
         event.preventDefault();
       }
diff --git a/openflexure_microscope/api/static/src/store.js b/openflexure_microscope/api/static/src/store.js
index 31f1fd0a..f8255fdc 100644
--- a/openflexure_microscope/api/static/src/store.js
+++ b/openflexure_microscope/api/static/src/store.js
@@ -3,15 +3,15 @@ import Vuex from "vuex";
 
 Vue.use(Vuex);
 
-function getOriginFromLocation(){
+function getOriginFromLocation() {
   // This will default to the same origin that's serving
   // the web app - but can be overridden by the URL.
   // See also devTools.vue which can change the origin.
   let url = new URL(window.location.href);
   let origin = url.searchParams.get("overrideOrigin");
-  if(origin){
+  if (origin) {
     return origin;
-  }else{
+  } else {
     return url.origin;
   }
 }

From 82a277b04c925ea5886836870140bb7a7eb9665b Mon Sep 17 00:00:00 2001
From: Richard <richard.bowman@cantab.net>
Date: Tue, 27 Apr 2021 16:36:55 +0100
Subject: [PATCH 7/9] Cache stream settings in local storage

GPU preview and MJPEG stream settings are now persisted
using localStorage.  The old code that disabled
the stream for local connections now
just sets the initial/default value.

The initialisation of stream settings is now done
in the created() method of streamContent.vue.

I've eliminated the "globalsafetogglepreview" event
in favour of watching the store.
---
 .../api/static/src/components/appContent.vue  | 40 ++++++------------
 .../settingsComponents/streamSettings.vue     | 41 ++++++++++++++++++-
 .../tabContentComponents/streamContent.vue    | 15 +++++--
 3 files changed, 63 insertions(+), 33 deletions(-)

diff --git a/openflexure_microscope/api/static/src/components/appContent.vue b/openflexure_microscope/api/static/src/components/appContent.vue
index 60713801..fbc12e8d 100644
--- a/openflexure_microscope/api/static/src/components/appContent.vue
+++ b/openflexure_microscope/api/static/src/components/appContent.vue
@@ -140,6 +140,8 @@ import loggingContent from "./tabContentComponents/loggingContent.vue";
 // Import modal components for device initialisation
 import calibrationModal from "./modalComponents/calibrationModal.vue";
 
+import { mapState } from "vuex";
+
 // Export main app
 export default {
   name: "AppContent",
@@ -241,21 +243,21 @@ export default {
 
     currentTabIndex: function() {
       return this.tabOrder.indexOf(this.currentTab);
+    },
+
+    // Map the setting for IHI's interface so we can watch it
+    ...mapState(["IHIEnabled"])
+  },
+
+  watch: {
+    // Update the interface when the IHI interface is enabled/disabled
+    IHIEnabled: function(newValue) {
+      this.updateTopTabs(newValue);
     }
   },
 
   created: function() {
     if (this.$store.getters.ready) {
-      // Detect local connection
-      if (
-        ["localhost", "0.0.0.0", "127.0.0.1", "[::1]"].includes(
-          window.location.hostname
-        )
-      ) {
-        this.$store.commit("changeDisableStream", true);
-        this.$store.commit("changeAutoGpuPreview", true);
-        this.$store.commit("changeTrackWindow", true);
-      }
       // Update top tabs
       this.updateTopTabs(this.$store.state.IHIEnabled);
       // Update plugins
@@ -264,16 +266,6 @@ export default {
         this.startModals();
       });
     }
-
-    // Watch for host 'ready', then update status
-    this.unwatchStoreFunction = this.$store.watch(
-      state => {
-        return state.IHIEnabled;
-      },
-      IHIEnabled => {
-        this.updateTopTabs(IHIEnabled);
-      }
-    );
   },
 
   mounted() {
@@ -291,14 +283,6 @@ export default {
     });
   },
 
-  beforeDestroy() {
-    // Then we call that function here to unwatch
-    if (this.unwatchStoreFunction) {
-      this.unwatchStoreFunction();
-      this.unwatchStoreFunction = null;
-    }
-  },
-
   methods: {
     updateTopTabs: function(IHIEnabled) {
       if (IHIEnabled) {
diff --git a/openflexure_microscope/api/static/src/components/tabContentComponents/settingsComponents/streamSettings.vue b/openflexure_microscope/api/static/src/components/tabContentComponents/settingsComponents/streamSettings.vue
index b21627a6..2136ad5a 100644
--- a/openflexure_microscope/api/static/src/components/tabContentComponents/settingsComponents/streamSettings.vue
+++ b/openflexure_microscope/api/static/src/components/tabContentComponents/settingsComponents/streamSettings.vue
@@ -73,8 +73,11 @@ export default {
         return this.$store.state.autoGpuPreview;
       },
       set(value) {
+        // NB the stream viewer watches the store, and is
+        // responsible for making the request that switches
+        // GPU preview on/off
+        // see streamContent.vue
         this.$store.commit("changeAutoGpuPreview", value);
-        this.$root.$emit("globalSafeTogglePreview", value);
       }
     },
 
@@ -86,6 +89,42 @@ export default {
         this.$store.commit("changeTrackWindow", value);
       }
     }
+  },
+
+  watch: {
+    // Cache the stream settings to local storage for persistence
+    // (the next 3 functions all relate to this)
+    disableStream: function(newValue) {
+      console.log(`disableStream updated to ${newValue} and saved in local storage`);
+    },
+    autoGpuPreview: function(newValue) {
+      console.log(`GPU preview updated to ${newValue} and saved in local storage`);
+    },
+    trackWindow: function(newValue) {
+      console.log(`trackWindow updated to ${newValue} and saved in local storage`);
+    }
+  },
+
+  created() {
+    // Apply sensible defaults for stream settings, depending on
+    // whether we're connecting locally or remotely, respecting
+    // the settings that were cached previously.
+    const localMode = ["localhost", "0.0.0.0", "127.0.0.1", "[::1]"].includes(
+      window.location.hostname
+    );
+    const localDefaults = {
+      disableStream: true,
+      autoGpuPreview: true,
+      trackWindow: true
+    };
+    for (let k in localDefaults) {
+      if (localStorage.getItem(k) !== null) {
+        this[k] = this.getLocalStorageObj(k);
+      } else if (localMode) {
+        console.log(`${k} set to default value for a local connection`);
+        this[k] = localDefaults[k];
+      }
+    }
   }
 };
 </script>
diff --git a/openflexure_microscope/api/static/src/components/tabContentComponents/streamContent.vue b/openflexure_microscope/api/static/src/components/tabContentComponents/streamContent.vue
index 2554d621..16fde3e1 100644
--- a/openflexure_microscope/api/static/src/components/tabContentComponents/streamContent.vue
+++ b/openflexure_microscope/api/static/src/components/tabContentComponents/streamContent.vue
@@ -69,6 +69,16 @@ export default {
     },
     settingsUri: function() {
       return `${this.$store.getters.baseUri}/api/v2/instrument/settings`;
+    },
+    autoGpuPreview: function() {
+      return this.$store.state.autoGpuPreview;
+    }
+  },
+
+  watch: {
+    autoGpuPreview: function(newValue) {
+      // When the GPU preview setting in the store changes, update the server
+      this.safePreviewRequest(newValue);
     }
   },
 
@@ -77,9 +87,6 @@ export default {
     this.$root.$on("globalTogglePreview", state => {
       this.previewRequest(state);
     });
-    this.$root.$on("globalSafeTogglePreview", state => {
-      this.safePreviewRequest(state);
-    });
     // A global signal listener to flash the stream element
     this.$root.$on("globalFlashStream", () => {
       this.flashStream();
@@ -97,7 +104,7 @@ export default {
 
   created: function() {
     // Send a request to start/stop GPU preview based on global setting
-    this.safePreviewRequest(this.$store.state.autoGpuPreview);
+    this.safePreviewRequest(this.autoGpuPreview);
   },
 
   beforeDestroy: function() {

From 0bdb5b4721b16c145871f177a8207a2734440475 Mon Sep 17 00:00:00 2001
From: Richard <richard.bowman@cantab.net>
Date: Wed, 5 May 2021 16:19:43 +0100
Subject: [PATCH 8/9] Actually save stream settings to local storage

After some refactoring, I lost the code that actually
saved stream settings to local storage.
This commit restores that functionality.
---
 .../settingsComponents/streamSettings.vue         | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/openflexure_microscope/api/static/src/components/tabContentComponents/settingsComponents/streamSettings.vue b/openflexure_microscope/api/static/src/components/tabContentComponents/settingsComponents/streamSettings.vue
index 2136ad5a..60b7cdb7 100644
--- a/openflexure_microscope/api/static/src/components/tabContentComponents/settingsComponents/streamSettings.vue
+++ b/openflexure_microscope/api/static/src/components/tabContentComponents/settingsComponents/streamSettings.vue
@@ -95,13 +95,22 @@ export default {
     // Cache the stream settings to local storage for persistence
     // (the next 3 functions all relate to this)
     disableStream: function(newValue) {
-      console.log(`disableStream updated to ${newValue} and saved in local storage`);
+      console.log(
+        `disableStream updated to ${newValue} and saved in local storage`
+      );
+      this.setLocalStorageObj("disableStream", newValue);
     },
     autoGpuPreview: function(newValue) {
-      console.log(`GPU preview updated to ${newValue} and saved in local storage`);
+      console.log(
+        `GPU preview updated to ${newValue} and saved in local storage`
+      );
+      this.setLocalStorageObj("autoGpuPreview", newValue);
     },
     trackWindow: function(newValue) {
-      console.log(`trackWindow updated to ${newValue} and saved in local storage`);
+      console.log(
+        `trackWindow updated to ${newValue} and saved in local storage`
+      );
+      this.setLocalStorageObj("trackWindow", newValue);
     }
   },
 

From 126766aa06f84e829012ad31efdccebc0b027612 Mon Sep 17 00:00:00 2001
From: Richard <richard.bowman@cantab.net>
Date: Wed, 5 May 2021 16:44:25 +0100
Subject: [PATCH 9/9] Removed unnecessary package

I'm not using vuex-map-fields, so have
removed it.
---
 .../api/static/package-lock.json              | 201 +++++++++---------
 .../api/static/package.json                   |   3 +-
 2 files changed, 99 insertions(+), 105 deletions(-)

diff --git a/openflexure_microscope/api/static/package-lock.json b/openflexure_microscope/api/static/package-lock.json
index 1a855c5a..364ee484 100644
--- a/openflexure_microscope/api/static/package-lock.json
+++ b/openflexure_microscope/api/static/package-lock.json
@@ -2917,6 +2917,16 @@
           "integrity": "sha512-bY6fj56OUQ0hU1KjFNDQuJFezqKdrAyFdIevADiqrWHwSlbmBNMHp5ak2f40Pm8JTFyM2mqxkG6ngkHO11f/lg==",
           "dev": true
         },
+        "ansi-styles": {
+          "version": "4.3.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "color-convert": "^2.0.1"
+          }
+        },
         "browserslist": {
           "version": "4.15.0",
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.15.0.tgz",
@@ -2962,12 +2972,36 @@
           "integrity": "sha512-8cEsSMwXfx7lWSUMA2s08z9dIgsnR5NAqjXP23stdsU3AUWkCr/rr4s4OFtHXn5XXr6+7kam3QFVoYyXNPdJPA==",
           "dev": true
         },
+        "color-convert": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "color-name": "~1.1.4"
+          }
+        },
+        "color-name": {
+          "version": "1.1.4",
+          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+          "dev": true,
+          "optional": true
+        },
         "electron-to-chromium": {
           "version": "1.3.615",
           "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.615.tgz",
           "integrity": "sha512-fNYTQXoUhNc6RmHDlGN4dgcLURSBIqQCN7ls6MuQ741+NJyLNRz8DxAC+pZpOKfRs6cfY0lv2kWdy8Oxf9j4+A==",
           "dev": true
         },
+        "emojis-list": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-3.0.0.tgz",
+          "integrity": "sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==",
+          "dev": true,
+          "optional": true
+        },
         "fast-deep-equal": {
           "version": "3.1.3",
           "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
@@ -3001,6 +3035,35 @@
           "integrity": "sha512-WjKPNJF79dtJAVniUlGGWHYGz2jWxT6VhN/4m1NdkbZ2nOsEF+cI1Edgql5zCRhs/VsQYRvrXctxktVXZUkixw==",
           "dev": true
         },
+        "has-flag": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+          "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+          "dev": true,
+          "optional": true
+        },
+        "json5": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.0.tgz",
+          "integrity": "sha512-f+8cldu7X/y7RAJurMEJmdoKXGB/X550w2Nr3tTbezL6RwEE/iMcm+tZnXeoZtKuOq6ft8+CqzEkrIgx1fPoQA==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "minimist": "^1.2.5"
+          }
+        },
+        "loader-utils": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz",
+          "integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "big.js": "^5.2.2",
+            "emojis-list": "^3.0.0",
+            "json5": "^2.1.2"
+          }
+        },
         "locate-path": {
           "version": "5.0.0",
           "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
@@ -3134,6 +3197,16 @@
             "ansi-regex": "^5.0.0"
           }
         },
+        "supports-color": {
+          "version": "7.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+          "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "has-flag": "^4.0.0"
+          }
+        },
         "terser-webpack-plugin": {
           "version": "2.3.8",
           "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-2.3.8.tgz",
@@ -3160,6 +3233,31 @@
             "psl": "^1.1.28",
             "punycode": "^2.1.1"
           }
+        },
+        "vue-loader-v16": {
+          "version": "npm:vue-loader@16.2.0",
+          "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.2.0.tgz",
+          "integrity": "sha512-TitGhqSQ61RJljMmhIGvfWzJ2zk9m1Qug049Ugml6QP3t0e95o0XJjk29roNEiPKJQBEi8Ord5hFuSuELzSp8Q==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "chalk": "^4.1.0",
+            "hash-sum": "^2.0.0",
+            "loader-utils": "^2.0.0"
+          },
+          "dependencies": {
+            "chalk": {
+              "version": "4.1.1",
+              "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.1.tgz",
+              "integrity": "sha512-diHzdDKxcU+bAsUboHLPEDQiw0qEe0qd7SYUn3HgcFlWgbDcfLGswOHYeGrHKzG9z6UYf01d9VFMfZxPM1xZSg==",
+              "dev": true,
+              "optional": true,
+              "requires": {
+                "ansi-styles": "^4.1.0",
+                "supports-color": "^7.1.0"
+              }
+            }
+          }
         }
       }
     },
@@ -13687,104 +13785,6 @@
         }
       }
     },
-    "vue-loader-v16": {
-      "version": "npm:vue-loader@16.1.2",
-      "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.1.2.tgz",
-      "integrity": "sha512-8QTxh+Fd+HB6fiL52iEVLKqE9N1JSlMXLR92Ijm6g8PZrwIxckgpqjPDWRP5TWxdiPaHR+alUWsnu1ShQOwt+Q==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "chalk": "^4.1.0",
-        "hash-sum": "^2.0.0",
-        "loader-utils": "^2.0.0"
-      },
-      "dependencies": {
-        "ansi-styles": {
-          "version": "4.3.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
-          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "color-convert": "^2.0.1"
-          }
-        },
-        "chalk": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.0.tgz",
-          "integrity": "sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "ansi-styles": "^4.1.0",
-            "supports-color": "^7.1.0"
-          }
-        },
-        "color-convert": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
-          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "color-name": "~1.1.4"
-          }
-        },
-        "color-name": {
-          "version": "1.1.4",
-          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
-          "dev": true,
-          "optional": true
-        },
-        "emojis-list": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-3.0.0.tgz",
-          "integrity": "sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==",
-          "dev": true,
-          "optional": true
-        },
-        "has-flag": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
-          "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
-          "dev": true,
-          "optional": true
-        },
-        "json5": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.0.tgz",
-          "integrity": "sha512-f+8cldu7X/y7RAJurMEJmdoKXGB/X550w2Nr3tTbezL6RwEE/iMcm+tZnXeoZtKuOq6ft8+CqzEkrIgx1fPoQA==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "minimist": "^1.2.5"
-          }
-        },
-        "loader-utils": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz",
-          "integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "big.js": "^5.2.2",
-            "emojis-list": "^3.0.0",
-            "json5": "^2.1.2"
-          }
-        },
-        "supports-color": {
-          "version": "7.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
-          "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "has-flag": "^4.0.0"
-          }
-        }
-      }
-    },
     "vue-observe-visibility": {
       "version": "0.4.6",
       "resolved": "https://registry.npmjs.org/vue-observe-visibility/-/vue-observe-visibility-0.4.6.tgz",
@@ -13848,11 +13848,6 @@
       "integrity": "sha512-W74OO2vCJPs9/YjNjW8lLbj+jzT24waTo2KShI8jLvJW8OaIkgb3wuAMA7D+ZiUxDOx3ubwSZTaJBip9G8a3aQ==",
       "dev": true
     },
-    "vuex-map-fields": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/vuex-map-fields/-/vuex-map-fields-1.4.1.tgz",
-      "integrity": "sha512-jvIcpvoIPqwvJCOfRkPU9Rj0EbjWuk7GlNC5LXU9mCXVGZph6bWGHZssnoUzpLMxJtXQEHoVyZkKf7YQV+/bnQ=="
-    },
     "watchpack": {
       "version": "1.7.4",
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.7.4.tgz",
diff --git a/openflexure_microscope/api/static/package.json b/openflexure_microscope/api/static/package.json
index c05324b1..af3524c4 100644
--- a/openflexure_microscope/api/static/package.json
+++ b/openflexure_microscope/api/static/package.json
@@ -13,8 +13,7 @@
   "dependencies": {
     "material-design-icons": "^3.0.1",
     "mousetrap": "^1.6.5",
-    "vue-observe-visibility": "^0.4.6",
-    "vuex-map-fields": "^1.4.1"
+    "vue-observe-visibility": "^0.4.6"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "^3.12.1",