Remove tour that was already disabled.

webapp/package-lock.json

@@ -34,7 +34,6 @@
         "uikit": "^3.17",
         "vue": "^2.7",
         "vue-template-compiler": "^2.7",
-        "vue-tour": "^1.6",
         "vuejs-paginate": "^2.1",
         "vuex": "^3.6"
       }
@@ -9160,12 +9159,6 @@
         "node": ">=0.6.0"
       }
     },
-    "node_modules/jump.js": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/jump.js/-/jump.js-1.0.2.tgz",
-      "integrity": "sha512-oUkJJ/Y4ATU5qjkXBntCZSKctbSyS3ewe2jrLaUu/cc9jsQiAn0fnTUxQnZz3mJdDdem1Q279zrD6h3n+Cgxtg==",
-      "dev": true
-    },
     "node_modules/killable": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/killable/-/killable-1.0.1.tgz",
@@ -11084,17 +11077,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/popper.js": {
-      "version": "1.16.1",
-      "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz",
-      "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==",
-      "deprecated": "You can find the new Popper v2 at @popperjs/core, this package is dedicated to the legacy v1",
-      "dev": true,
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/popperjs"
-      }
-    },
     "node_modules/portfinder": {
       "version": "1.0.32",
       "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.32.tgz",
@@ -15162,18 +15144,6 @@
       "integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
       "dev": true
     },
-    "node_modules/vue-tour": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/vue-tour/-/vue-tour-1.6.0.tgz",
-      "integrity": "sha512-INVkuv3kIqulM3R90W1EF4XzFzOt34y6F0BEOunH+DcIwRVrWvBT/HXBu+Dq0RDJswxYbak2JQto58ep3rULRw==",
-      "dev": true,
-      "dependencies": {
-        "hash-sum": "^2.0.0",
-        "jump.js": "^1.0.2",
-        "popper.js": "^1.16.0",
-        "vue": "^2.6.10"
-      }
-    },
     "node_modules/vue/node_modules/@vue/compiler-sfc": {
       "version": "2.7.16",
       "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-2.7.16.tgz",

webapp/package.json

@@ -37,7 +37,6 @@
     "uikit": "^3.17",
     "vue": "^2.7",
     "vue-template-compiler": "^2.7",
-    "vue-tour": "^1.6",
     "vuejs-paginate": "^2.1",
     "vuex": "^3.6"
   },

webapp/src/App.vue

@@ -5,7 +5,6 @@
     :class="handleTheme"
   >
     <loadingContent v-if="!$store.getters.ready" />
-    <div v-if="$store.getters.ready" id="tour-header"></div>
     <appContent v-if="$store.getters.ready" />
     <!-- Runtime modals -->
     <div
@@ -27,13 +26,6 @@
         </div>
       </div>
     </div>
-    <v-tour
-      v-show="$store.getters.ready"
-      name="guidedTour"
-      :steps="tourSteps"
-      :callbacks="tourCallbacks"
-      :options="{ highlight: true }"
-    ></v-tour>
   </div>
 </template>
 
@@ -79,12 +71,7 @@ export default {
       arrowKeysDown: {},
       keyboardManual: [],
       systemDark: undefined,
-      themeObserver: undefined,
+      themeObserver: undefined
-      tourCallbacks: {
-        onStop: () => {
-          this.setLocalStorageObj("completedTour", true);
-        }
-      }
     };
   },
 
@@ -112,68 +99,6 @@ export default {
         "uk-light": isDark,
         "uk-background-secondary": isDark
       };
-    },
-    tourSteps: function() {
-      let tabPopperParams = {
-        modifiers: {
-          preventOverflow: {
-            boundariesElement: "window"
-          }
-        },
-        placement: "right"
-      };
-      return [
-        {
-          target: "#tour-header", // We're using document.querySelector() under the hood
-          header: {
-            title: "Welcome to the OpenFlexure Microscope"
-          },
-          content: `Click Next to learn how to use your microscope`,
-          params: {
-            placement: "bottom"
-          }
-        },
-        {
-          target: "#gallery-tab-icon",
-          header: {
-            title: "Capture gallery"
-          },
-          content: `View and download your microscope images from the gallery tab`,
-          params: tabPopperParams
-        },
-        {
-          target: "#navigate-tab-icon",
-          header: {
-            title: "Navigate around your sample"
-          },
-          content: `Move your microscope stage and perform autofocus from the navigate tab`,
-          params: tabPopperParams
-        },
-        {
-          target: "#capture-tab-icon",
-          header: {
-            title: "Capture microscope images"
-          },
-          content: `Take images and simple tile scans from the capture tab`,
-          params: tabPopperParams
-        },
-        {
-          target: "#settings-tab-icon",
-          header: {
-            title: "Change settings"
-          },
-          content: `Change app and microscope settings, including microscope calibration, from the settings tab`,
-          params: tabPopperParams
-        },
-        {
-          target: "#extension-tab-divider",
-          header: {
-            title: "Microscope extensions"
-          },
-          content: `Extensions installed on your microscope will appear below this line`,
-          params: tabPopperParams
-        }
-      ];
     }
   },
 
@@ -194,12 +119,6 @@ export default {
     });
     // Check connection to API
     this.checkConnection();
-    // Handle guided tour
-    // If the user has already completed or skipped the guided tour
-    var completedTour = this.getLocalStorageObj("completedTour") || true;
-    if (!completedTour) {
-      this.$tours["guidedTour"].start();
-    }
   },
 
   created: function() {
@@ -443,14 +362,7 @@ html {
   overflow-y: hidden;
 }
 
-// Style tour
+
-.v-tour__target--highlighted {
-  box-shadow: 0px 40px 200px 30px rgba(0, 0, 0, 0.5),
-    0px 0px 0px 4px rgba(128, 128, 128, 0.5) !important;
-  border-radius: 5px;
-  opacity: 100% !important;
-  pointer-events: none !important;
-}
 
 .v-step {
   background: @global-primary-background !important;

webapp/src/components/tabContentComponents/aboutComponents/devTools.vue

@@ -62,10 +62,6 @@ export default {
         this.$store.commit("changeOrigin", this.newOrigin);
         event.preventDefault();
       }
-    },
-    resetTour: function() {
-      // Make the introduction tour run next time the app loads
-      this.setLocalStorageObj("completedTour", false);
     }
   }
 };

webapp/src/main.js

@@ -3,10 +3,9 @@ import App from "./App.vue";
 import store from "./store";
 import axios from "axios";
 import UIkit from "uikit";
-import VueTour from "vue-tour";
+
 import VueObserveVisibility from "vue-observe-visibility";
 
-require("vue-tour/dist/vue-tour.css");
 
 // Import MD icons
 import "material-symbols/outlined.css";
@@ -22,9 +21,6 @@ UIkit.mixin(
   "accordion"
 );
 
-// Use vue-tour module
-Vue.use(VueTour);
-
 // Use visibility observer
 Vue.use(VueObserveVisibility);