From cbe1945f5deea177a75c15d5319d95d487d39ec4 Mon Sep 17 00:00:00 2001
From: Alberto Xamin <alberto@xamin.it>
Date: Thu, 9 Feb 2023 14:40:11 +0000
Subject: [PATCH] add possibility to use a different backend

---
 frontend/src/App.vue | 10 ++++++++++
 frontend/src/main.js | 15 +++++++++++----
 2 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index b6f2df5..b464a74 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -9,6 +9,7 @@
 		</div>
 		<help v-if="showHelp"/>
 		<div style="position:fixed;bottom:4pt;right:4pt;display:flex;z-index:10">
+			<input v-if="connect_dev" type=button class="btn" style="min-width:28pt;cursor:pointer;" @click="resetConnection" :value="'💚'+connect_dev" />
 			<input type=button class="btn" style="min-width:28pt;cursor:pointer;" @click="()=>{sending_report = true}" :value=" $t('report') " />
 			<input type="button" class="btn" value="" style="min-width:28pt;cursor:pointer;background-position:center;background-image:url('https://img.icons8.com/color/48/discord-logo.png');background-size:1.5em;background-repeat: no-repeat;" @click="joinDiscord"/>
 			<input type="button" class="btn" :value="(showHelp?'X':'?')" style="min-width:28pt;border-radius:100%;cursor:pointer;" @click="getHelp"/>
@@ -63,6 +64,7 @@ export default {
 		theme: 'light',
 		report: '',
 		sending_report: false,
+		connect_dev: undefined,
 	}),
 	computed: {
 	},
@@ -98,6 +100,11 @@ export default {
 			// Send message to SW to skip the waiting and activate the new SW
 			this.registration.waiting.postMessage({ type: 'SKIP_WAITING' })
 		},
+		resetConnection() {
+			this.$socket.disconnect();
+			window.localStorage.removeItem('connect-dev');
+			window.navigation.reload();
+		},
 		detectColorScheme() {
 			if(localStorage.getItem("theme")){
 				this.theme = localStorage.getItem("theme")
@@ -146,6 +153,9 @@ export default {
 				userLang = 'en';
 			this.$i18n.locale = userLang.split('-')[0]
 		}
+		if (window.localStorage.getItem('connect-dev')) {
+			this.connect_dev = window.localStorage.getItem('connect-dev')
+		}
 		this.detectColorScheme()
 		if (window.location.origin.indexOf('localhost') !== -1) return;
 		datadogRum.init({
diff --git a/frontend/src/main.js b/frontend/src/main.js
index 38ee88c..e2a945a 100644
--- a/frontend/src/main.js
+++ b/frontend/src/main.js
@@ -3,10 +3,17 @@ import App from './App.vue'
 
 Vue.config.productionTip = false
 import VueSocketIO from 'bang-vue-socket.io'
-Vue.use(new VueSocketIO({
-	debug: Vue.config.devtools,
-	connection: Vue.config.devtools ? `http://${window.location.hostname}:5001` : window.location.origin,
-}))
+if (window.localStorage.getItem('connect-dev')) {
+	Vue.use(new VueSocketIO({
+		debug: true,
+		connection: window.localStorage.getItem('connect-dev'),
+	}))
+}	else {
+	Vue.use(new VueSocketIO({
+		debug: Vue.config.devtools,
+		connection: (Vue.config.devtools) ? `http://${window.location.hostname}:5001` : window.location.origin,
+	}))
+}
 
 import PrettyCheckbox from 'pretty-checkbox-vue';
 Vue.use(PrettyCheckbox)