diff --git a/webapp/package-lock.json b/webapp/package-lock.json
index 2e28b858..7484584c 100644
--- a/webapp/package-lock.json
+++ b/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",
diff --git a/webapp/package.json b/webapp/package.json
index 7c3e4b7c..277bb2bf 100644
--- a/webapp/package.json
+++ b/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"
},
diff --git a/webapp/src/App.vue b/webapp/src/App.vue
index b972bec4..311dca83 100644
--- a/webapp/src/App.vue
+++ b/webapp/src/App.vue
@@ -5,7 +5,6 @@
:class="handleTheme"
>
-
-
@@ -79,12 +71,7 @@ export default {
arrowKeysDown: {},
keyboardManual: [],
systemDark: undefined,
- themeObserver: undefined,
- tourCallbacks: {
- onStop: () => {
- this.setLocalStorageObj("completedTour", true);
- }
- }
+ themeObserver: undefined
};
},
@@ -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;
diff --git a/webapp/src/components/tabContentComponents/aboutComponents/devTools.vue b/webapp/src/components/tabContentComponents/aboutComponents/devTools.vue
index 0c17a105..6542fa8c 100644
--- a/webapp/src/components/tabContentComponents/aboutComponents/devTools.vue
+++ b/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);
}
}
};
diff --git a/webapp/src/main.js b/webapp/src/main.js
index 4e1b9baf..2b6053ac 100644
--- a/webapp/src/main.js
+++ b/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);