feat(login): possibility to switch between instances

closes #53

Signed-off-by: Lukas Mertens <git@lukas-mertens.de>

commit-id:21677a2f

src/modules/evbc/client.ts

@@ -9,10 +9,10 @@ import {
   EverestModuleDefinitionList,
 } from ".";
 import EVConfigModel from "./config_model";
-import EVBackendConnection, { ConnectionStatus } from "./connection";
+import EVBackendConnection, {ConnectionStatus} from "./connection";
 
 type ConnectionStateEvent = {
-  type: "INFO" | "INITIALIZED" | "FAILED" | "RECONNECT";
+  type: "INFO" | "INITIALIZED" | "FAILED" | "RECONNECT" | "IDLE";
   text: string;
 };
 
@@ -40,9 +40,18 @@ class EVBackendClient {
   };
 
   connect(url: string) {
+    if (this._cxn) {
+      this._cxn._disconnect();
+    }
     this._cxn = new EVBackendConnection(url, (msg) => this._connection_state_listener(msg));
   }
 
+  disconnect(): void {
+    this._cxn._disconnect();
+    this.initialized = false;
+    this._cxn = null;
+  }
+
   on<K extends keyof ClientEventMap>(event_name: K, handler: EventHandler<ClientEventMap[K]>) {
     if (!(event_name in this._event_handler_map)) {
       this._event_handler_map[event_name] = [];
@@ -100,9 +109,11 @@ class EVBackendClient {
         event = { type: "INITIALIZED", text: "Successfully reconnected" };
       }
     } else if (status.type === "ERROR") {
-      event = { type: "FAILED", text: `Connection failed` };
+      event = {type: "FAILED", text: `Connection failed. Trying to reconnect.`};
     } else if (status.type === "CLOSED") {
       event = { type: "RECONNECT", text: "Trying to reconnect" };
+    } else if (status.type === "DISCONNECTED") {
+      event = {type: "IDLE", text: "Disconnected"};
     }
 
     if (event) {

src/modules/evbc/connection.ts

@@ -26,11 +26,16 @@ type ConnectionErrorStatus = {
   error: string;
 };
 
+type ConnectionDisconnectedStatus = {
+  type: "DISCONNECTED";
+}
+
 export type ConnectionStatus =
   | ConnectionOpenStatus
   | ConnectionOpenedStatus
   | ConnectionClosedStatus
-  | ConnectionErrorStatus;
+    | ConnectionErrorStatus
+    | ConnectionDisconnectedStatus;
 
 export type ConnectionStatusListener = (status: ConnectionStatus) => void;
 
@@ -70,6 +75,13 @@ class EVBackendConnection {
     this._socket.onclose = () => this._handle_socket_close();
   }
 
+  _disconnect() {
+    this._socket.close();
+    this._publish_connection_state({type: "DISCONNECTED"});
+    this._listener = () => {
+    };
+  }
+
   _issue_rpc_loopback(method: string /* params: unknown, notification: boolean */) {
     if (method === "get_modules") {
       return new Promise((resolve) => {

src/pages/LoginPage.vue

@@ -282,7 +282,11 @@ export default defineComponent({
         }
         if ("connectAutomatically" in evbcLocalStorage) {
           connectAutomatically.value = evbcLocalStorage.connectAutomatically;
-          if (connectAutomatically.value && window.localStorage?.getItem("lastConnectedServer") !== null) {
+          if (
+              router.currentRoute.value.query.auto_connect !== 'false' &&
+              connectAutomatically.value &&
+              window.localStorage?.getItem("lastConnectedServer") !== null
+          ) {
             const lastServer = JSON.parse(window.localStorage.getItem("lastConnectedServer")!);
             connect(lastServer);
           }
@@ -300,6 +304,9 @@ export default defineComponent({
             connecting.value = false;
             error.active = true;
             error.status = ev.text;
+          } else if (ev.type === "IDLE") {
+            connecting.value = false;
+            connectionStatus.value = "";
           }
         });
       }

src/pages/MainPanel.vue

@@ -15,12 +15,9 @@
         <v-list-item to="config" append-icon="mdi-cog" link>
           <v-list-item-title>Config</v-list-item-title>
         </v-list-item>
-        <!--<v-list-item to="account" append-icon="mdi-account-multiple" link>
-          <v-list-item-title>Account</v-list-item-title>
-        </v-list-item>-->
-        <!--<v-list-item to="about" append-icon="mdi-ninja" link>
-          <v-list-item-title>Debug</v-list-item-title>
-        </v-list-item>-->
+        <v-list-item @click="changeInstance()" append-icon="mdi-image-filter-hdr" link>
+          <v-list-item-title>Change EVerest instance</v-list-item-title>
+        </v-list-item>
       </v-list>
       <v-list-item class="bottom-list d-flex flex-column">
         <span>Version {{ version }}</span>
@@ -70,9 +67,11 @@ import {defineComponent, inject} from "vue";
 import EVBackendClient from "@/modules/evbc/client";
 
 import {useMainStore} from "@/store/main";
+import {Router, useRouter} from "vue-router";
 
 let evbc: EVBackendClient;
 let mainStore: ReturnType<typeof useMainStore>;
+let router: Router;
 export default defineComponent({
   data: () => ({
     drawer: false,
@@ -92,10 +91,15 @@ export default defineComponent({
     close_snackbar() {
       mainStore.setSnackbarMessage(undefined);
     },
+    changeInstance() {
+      evbc.disconnect();
+      router.push({path: "/login", query: { auto_connect: "false" }});
+    },
   },
   created() {
     mainStore = useMainStore()
     evbc = inject<EVBackendClient>("evbc");
+    router = useRouter();
     evbc.on("connection_state", (ev) => {
       this.evbc_status = ev.text;
       if (ev.type === "RECONNECT") {