diff --git a/src/components/viewComponents/connectDisplay.vue b/src/components/viewComponents/connectDisplay.vue
index e8fe3f2b..b3f4071e 100644
--- a/src/components/viewComponents/connectDisplay.vue
+++ b/src/components/viewComponents/connectDisplay.vue
@@ -138,6 +138,8 @@ if (isElectron()) {
var mdns = require("mdns-js");
}
+import axios from "axios";
+
import hostCard from "./connectComponents/hostCard.vue";
// Export main app
@@ -262,18 +264,37 @@ export default {
this.port = host.port;
// Commit the hostname and port to store
+ this.$store.commit("resetState");
this.$store.commit("changeHost", [host.hostname, host.port]);
- // Try to get config and state JSON from the newly submitted host
- this.$store
- .dispatch("firstConnect")
- .then(() => {
- console.log("Connected!");
- // Check client and server match
- this.checkServerVersion();
- // Switch to live view tab
- this.$root.$emit("globalTogglePanelRightTab", "preview");
+ this.$store.commit("changeWaiting", true);
+ // Try to get list of available routes
+ axios
+ .get(`${this.$store.getters.baseUri}/routes`)
+ .then(response => {
+ console.log(response.data);
+ // If the /api/v2 route is available
+ if (Object.keys(response.data).includes("/api/v2/")) {
+ console.log("API v2 available");
+ // Tell Vuex store that we're connected
+ this.$store.commit("setConnected");
+ // Check client and server match
+ this.checkServerVersion();
+ // Switch to live view tab
+ // TODO: Not working for some reason?
+ this.$root.$emit("globalTogglePanelRightTab", "preview");
+ } else {
+ // Error and no-connect if API v2 is missing
+ var ApiVersionError = Error(`Your microscope is running an old API version.\
+ You must update your microscope software to continue.\
+
\n
+ For API upgrades, burning the latest Raspbian-OpenFlexure is often easiest.\
+
\n
+ Alternatively, you can run 'ofm upgrade' on your microscope.`);
+ this.modalError(ApiVersionError);
+ }
})
.catch(error => {
+ this.$store.commit("setError");
this.modalError(error); // Let mixin handle error
});
},
@@ -307,14 +328,15 @@ export default {
},
checkServerVersion: function() {
- this.$store
- .dispatch("updateState")
- .then(() => {
+ var versionUri = `${this.$store.getters.baseUri}/api/v2/status/version`;
+ axios
+ .get(versionUri)
+ .then(response => {
+ var serverVersion = response.data;
var clientVersion = process.env.PACKAGE.version;
var clientVersionMajor = clientVersion.substring(0, 3);
console.log(clientVersionMajor);
- var serverVersion = this.$store.state.apiState.version;
if (serverVersion != undefined) {
var serverVersionMajor = serverVersion.substring(0, 3);
}
@@ -362,12 +384,23 @@ export default {
},
saveHost: function() {
- // We use unshift instead of push to add the entry to the beginning of the array
- this.savedHosts.unshift({
- name: this.$store.state.apiConfig.name,
- hostname: this.$store.state.host,
- port: this.$store.state.port
- });
+ // URI to get hostname directly from settings
+ var hostnameUri = `${this.$store.getters.baseUri}/api/v2/settings/name`;
+ axios
+ .get(hostnameUri)
+ .then(response => {
+ // Get device name from response
+ var deviceName = response.data;
+ // We use unshift instead of push to add the entry to the beginning of the array
+ this.savedHosts.unshift({
+ name: deviceName,
+ hostname: this.$store.state.host,
+ port: this.$store.state.port
+ });
+ })
+ .catch(error => {
+ this.modalError(error); // Let mixin handle error
+ });
}
}
};
diff --git a/src/store.js b/src/store.js
index df46a7c7..45ecd47f 100644
--- a/src/store.js
+++ b/src/store.js
@@ -1,6 +1,5 @@
import Vue from "vue";
import Vuex from "vuex";
-import axios from "axios";
Vue.use(Vuex);
@@ -8,13 +7,9 @@ export default new Vuex.Store({
state: {
host: "",
port: 5000,
- apiVer: "v1",
- available: true,
+ available: false,
waiting: false,
error: "",
- apiConfig: {},
- apiState: {},
- apiPlugins: [],
globalSettings: {
disableStream: false,
autoGpuPreview: false,
@@ -24,33 +19,20 @@ export default new Vuex.Store({
},
mutations: {
- changeHost(state, [host, port, apiVer = "v1"]) {
+ changeHost(state, [host, port]) {
state.host = host;
state.port = port;
- state.apiVer = apiVer;
},
changeWaiting(state, waiting) {
state.waiting = waiting;
},
- commitConfig(state, configData) {
- state.apiConfig = configData;
- },
- commitState(state, stateData) {
- state.apiState = stateData;
- },
- commitPlugins(state, pluginData) {
- state.apiPlugins = pluginData;
- },
changeSetting(state, [key, value]) {
state.globalSettings[key] = value;
},
resetState(state) {
state.waiting = false;
- state.available = true;
+ state.available = false;
state.error = null;
- state.apiConfig = {};
- state.apiState = {};
- state.apiPlugins = [];
},
setConnected(state) {
state.waiting = false;
@@ -62,142 +44,11 @@ export default new Vuex.Store({
}
},
- actions: {
- firstConnect(context) {
- // Reset the state when reconnecting starts
- context.commit("resetState");
- // Mark as loading
- context.commit("changeWaiting", true);
-
- var sendRequest = function(resolve, reject) {
- // Do requests
- context
- .dispatch("updateConfig")
- .then(() => context.dispatch("updateState"))
- .then(() => context.dispatch("updatePlugins"))
- .then(() => {
- console.log("Finished first connect");
- resolve();
- })
- .catch(error => {
- reject(error);
- });
- };
- return new Promise(sendRequest);
- },
-
- updateConfig(context, uri = `${context.getters.uri}/config`) {
- console.log("Updating config");
- context.commit("changeWaiting", true);
-
- var sendRequest = function(resolve, reject) {
- axios
- .get(uri)
- .then(response => {
- context.commit("commitConfig", response.data);
- context.commit("setConnected");
- console.log("Updating config finished");
- resolve();
- })
- .catch(error => {
- reject(new Error(error));
- });
- };
- return new Promise(sendRequest);
- },
-
- updateState(context, uri = `${context.getters.uri}/state`) {
- console.log("Updating state");
- context.commit("changeWaiting", true);
-
- var sendRequest = function(resolve, reject) {
- axios
- .get(uri)
- .then(response => {
- context.commit("commitState", response.data);
- context.commit("setConnected");
- console.log("Updating state finished");
- resolve();
- })
- .catch(error => {
- reject(new Error(error));
- });
- };
- return new Promise(sendRequest);
- },
-
- updatePlugins(context, uri = `${context.getters.uri}/plugin`) {
- console.log("Updating plugins");
- context.commit("changeWaiting", true);
-
- var sendRequest = function(resolve, reject) {
- axios
- .get(uri)
- .then(response => {
- console.log("PLUGINS");
- console.log(response.data);
- context.commit("commitPlugins", response.data);
- context.commit("setConnected");
- console.log("Updating plugins finished");
- resolve();
- })
- .catch(error => {
- reject(new Error(error));
- });
- };
- return new Promise(sendRequest);
- },
-
- pollTask(context, [taskId, timeout, interval]) {
- var endTime = Number(new Date()) + (timeout * 1000 || 30000);
- interval = interval * 1000 || 500;
-
- var checkCondition = function(resolve, reject) {
- // If the condition is met, we're done!
- axios.get(`${context.getters.uri}/task/${taskId}`).then(response => {
- console.log(response.data.status);
- var result = response.data.status;
- // If the task ends with success
- if (result == "success") {
- resolve(response.data);
- }
- // If task ends with an error
- else if (result == "error") {
- // Pass the error string back with reject
- reject(new Error(response.data.return));
- }
- // If task ends with termination
- else if (result == "terminated") {
- // Pass a generic termination error back with reject
- reject(new Error("Task terminated"));
- }
- // If task ends in any other way
- else if (result != "running") {
- // Pass status string as error
- reject(new Error(result));
- }
- // If the condition isn't met but the timeout hasn't elapsed, go again
- else if (Number(new Date()) < endTime) {
- setTimeout(checkCondition, interval, resolve, reject);
- }
- // Didn't match and too much time, reject!
- else {
- reject(new Error("Polling timed out"));
- }
- });
- };
-
- return new Promise(checkCondition);
- }
- },
+ actions: {},
getters: {
- uri: state => `http://${state.host}:${state.port}/api/${state.apiVer}`,
uriV2: state => `http://${state.host}:${state.port}/api/v2`,
baseUri: state => `http://${state.host}:${state.port}`,
- ready: state =>
- state.available &&
- Object.keys(state.apiConfig).length !== 0 &&
- Object.keys(state.apiState).length !== 0
+ ready: state => state.available
}
});