From 403ea223a844b5d51901e7d67018dccd3080b6de Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?David=20N=C3=A9grier?= <d.negrier@thecodingmachine.com>
Date: Mon, 22 Jun 2020 16:10:18 +0200
Subject: [PATCH] Reconnecting also on socket error

---
 front/src/Connection.ts | 66 ++++++++++++++---------------------------
 1 file changed, 23 insertions(+), 43 deletions(-)

diff --git a/front/src/Connection.ts b/front/src/Connection.ts
index ea382365..1bd11948 100644
--- a/front/src/Connection.ts
+++ b/front/src/Connection.ts
@@ -148,10 +148,6 @@ export class Connection implements Connection {
             reconnection: false // Reconnection is handled by the application itself
         });
 
-        this.socket.on(EventMessage.CONNECT_ERROR, () => {
-            console.error("Connection failed")
-        });
-
         this.socket.on(EventMessage.MESSAGE_ERROR, (message: string) => {
             console.error(EventMessage.MESSAGE_ERROR, message);
         })
@@ -160,17 +156,31 @@ export class Connection implements Connection {
     public static createConnection(name: string, characterSelected: string): Promise<Connection> {
         return Axios.post(`${API_URL}/login`, {name: name})
             .then((res) => {
-                let connection = new Connection(gameManager, name, characterSelected, res.data.token);
 
-                // FIXME: we should wait for the complete connexion here (i.e. the "connected" message from socket.io)!
-                // Otherwise, the connection MAY fail and we will never know!
-                return connection.connectSocketServer();
+                return new Promise<Connection>((resolve, reject) => {
+                    let connection = new Connection(gameManager, name, characterSelected, res.data.token);
+
+                    connection.onConnectError((error: object) => {
+                        console.log('An error occurred while connecting to socket server. Retrying');
+                        reject(error);
+                    });
+
+                    connection.socket.emit(EventMessage.SET_PLAYER_DETAILS, {
+                        name: connection.name,
+                        character: connection.character
+                    } as SetPlayerDetailsMessage, (id: string) => {
+                        connection.userId = id;
+                    });
+
+                    resolve(connection);
+                });
             })
             .catch((err) => {
                 // Let's retry in 4-6 seconds
                 return new Promise<Connection>((resolve, reject) => {
                     setTimeout(() => {
-                        resolve(Connection.createConnection(name, characterSelected));
+                        Connection.createConnection(name, characterSelected).then((connection) => resolve(connection))
+                            .catch((error) => reject(error));
                     }, 4000 + Math.floor(Math.random() * 2000) );
                 });
 
@@ -185,40 +195,6 @@ export class Connection implements Connection {
         this.lastRoom = null;
     }
 
-    connectSocketServer(): Promise<Connection>{
-        return new Promise<Connection>((resolve, reject) => {
-            this.socket.emit(EventMessage.SET_PLAYER_DETAILS, {
-                name: this.name,
-                character: this.character
-            } as SetPlayerDetailsMessage, (id: string) => {
-                this.userId = id;
-            });
-
-            //if try to reconnect with last position
-            /*if(this.lastRoom) {
-                //join the room
-                this.joinARoom(this.lastRoom,
-                    this.lastPositionShared ? this.lastPositionShared.x : 0,
-                    this.lastPositionShared ? this.lastPositionShared.y : 0,
-                    this.lastPositionShared ? this.lastPositionShared.direction : PlayerAnimationNames.WalkDown,
-                    this.lastPositionShared ? this.lastPositionShared.moving : false);
-            }*/
-
-            /*if(this.lastPositionShared) {
-
-                //share your first position
-                this.sharePosition(
-                    this.lastPositionShared ? this.lastPositionShared.x : 0,
-                    this.lastPositionShared ? this.lastPositionShared.y : 0,
-                    this.lastPositionShared.direction,
-                    this.lastPositionShared.moving
-                );
-            }*/
-
-            resolve(this);
-        });
-    }
-
 
     joinARoom(roomId: string, startX: number, startY: number, direction: string, moving: boolean): Promise<MessageUserPositionInterface[]> {
         const point = new Point(startX, startY, direction, moving);
@@ -262,6 +238,10 @@ export class Connection implements Connection {
         this.socket.on(EventMessage.GROUP_DELETE, callback)
     }
 
+    public onConnectError(callback: (error: object) => void): void {
+        this.socket.on(EventMessage.CONNECT_ERROR, callback)
+    }
+
     sendWebrtcSignal(signal: unknown, roomId: string, userId? : string|null, receiverId? : string) {
         return this.socket.emit(EventMessage.WEBRTC_SIGNAL, {
             userId: userId ? userId : this.userId,