From 6ae2da54b22b1a7c153cadc598bbde65a9ac09ca Mon Sep 17 00:00:00 2001
From: Choco <94597336+ChocoMeow@users.noreply.github.com>
Date: Sun, 26 Mar 2023 18:12:10 +0800
Subject: [PATCH] Add reconnection in dashboard

---
 web/ipc/client.py        | 21 ++++++++++++++++-----
 web/static/css/main.css  |  8 +++-----
 web/static/js/objects.js |  2 +-
 web/webapp.py            |  2 +-
 4 files changed, 21 insertions(+), 12 deletions(-)

diff --git a/web/ipc/client.py b/web/ipc/client.py
index e782e25..2b12c5b 100644
--- a/web/ipc/client.py
+++ b/web/ipc/client.py
@@ -1,4 +1,4 @@
-import websockets, json
+import websockets, json, asyncio
 from uuid import uuid4
 
 class IPCClient:
@@ -17,13 +17,23 @@ class IPCClient:
         self.callback = callback
         self.id = uuid4()
 
-    async def connect(self):
-        self.websocket = await websockets.connect(f"ws://{self.host}:{self.port}", extra_headers={"Client-Id": str(self.id)})
-        await self.start_receiver()
+    async def connect_and_reconnect(self):
+        while True:
+            await self.connect()
+            print("Reconnect in next 10s!")
+            await asyncio.sleep(10)
 
+    async def connect(self):
+        try:
+            self.websocket = await websockets.connect(f"ws://{self.host}:{self.port}", extra_headers={"Client-Id": str(self.id)})
+            await self.start_receiver()
+        except:
+            pass
+            
     async def send(self, message, user):
         if not self.websocket:
-            await self.connect()
+            return
+        
         data = json.loads(message)
 
         payload = {
@@ -34,6 +44,7 @@ class IPCClient:
         await self.websocket.send(json.dumps(payload))
 
     async def receive(self):
+        print("Connected ipc server!")
         async for message in self.websocket:
             if self.callback:
                 data = json.loads(message)
diff --git a/web/static/css/main.css b/web/static/css/main.css
index b1bf3d1..e5f64d0 100644
--- a/web/static/css/main.css
+++ b/web/static/css/main.css
@@ -516,17 +516,15 @@ a {
     position: absolute;
     right: 0;
     background-color: rgb(37, 37, 37);
-    width: 350px;
-    max-width: 400px;
+    width: 0px;
     height: 100%;
     overflow: hidden;
-    padding: 1.5rem 1rem;
-    transform: translateX(100%);
     transition: all .5s ease-in-out;
 }
 
 .users-bar.active {
-    transform: translateX(0);
+    width: 350px;
+    padding: 1.5rem 1rem;
 }
 
 .users-bar .info {
diff --git a/web/static/js/objects.js b/web/static/js/objects.js
index f94bcba..c62f6c5 100644
--- a/web/static/js/objects.js
+++ b/web/static/js/objects.js
@@ -225,7 +225,7 @@ class Track {
 
 class Player {
     constructor(userId) {
-        this.socket = new Socket('http://127.0.0.1:5000');
+        this.socket = new Socket(`http://${window.location.hostname}:${window.location.port}`);
         this.socket.connect(this);
         this.socket.addMessageListener((msg) => this.handleMessage(msg));
         this.timer = new Timer(() => this.updateTime(), 1000);
diff --git a/web/webapp.py b/web/webapp.py
index 28f862b..4f4ec56 100644
--- a/web/webapp.py
+++ b/web/webapp.py
@@ -28,7 +28,7 @@ USERS = {}
 def start_ipc_client(loop):
     client = IPCClient(secret_key=app.secret_key)
     asyncio.set_event_loop(loop)
-    loop.run_until_complete(client.connect())
+    loop.run_until_complete(client.connect_and_reconnect())
 
 def create_ipc_client():
     loop = asyncio.new_event_loop()