X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=client%2Fsrc%2Fviews%2FMyGames.vue;h=ad330aec802c2454a4d4377dac8ad5961b4c0015;hb=16d06164d56332bd00fb22acc5b2b2997b942d73;hp=76879bced1536f94c031f6b66c6608b76bb2035a;hpb=3aa0c7783242b063c9a2890bdd4cf2767859dfca;p=vchess.git

diff --git a/client/src/views/MyGames.vue b/client/src/views/MyGames.vue
index 76879bce..ad330aec 100644
--- a/client/src/views/MyGames.vue
+++ b/client/src/views/MyGames.vue
@@ -78,7 +78,8 @@ export default {
       },
       conn: null,
       connexionString: "",
-      socketCloseListener: 0
+      reopenTimeout: 0,
+      reconnectTimeout: 0
     };
   },
   watch: {
@@ -96,7 +97,6 @@ export default {
   },
   created: function() {
     window.addEventListener("beforeunload", this.cleanBeforeDestroy);
-    // Initialize connection
     this.connexionString =
       params.socketUrl +
       "/?sid=" + this.st.user.sid +
@@ -104,19 +104,7 @@ export default {
       "&tmpId=" + getRandString() +
       "&page=" +
       encodeURIComponent(this.$route.path);
-    this.conn = new WebSocket(this.connexionString);
-    this.conn.onmessage = this.socketMessageListener;
-    this.socketCloseListener = setInterval(
-      () => {
-        if (this.conn.readyState == 3) {
-          // Connexion is closed: re-open
-          this.conn.removeEventListener("message", this.socketMessageListener);
-          this.conn = new WebSocket(this.connexionString);
-          this.conn.addEventListener("message", this.socketMessageListener);
-        }
-      },
-      1000
-    );
+    this.openConnection();
   },
   mounted: function() {
     const adjustAndSetDisplay = () => {
@@ -157,6 +145,7 @@ export default {
               this.corrGames.forEach(g => {
                 g.type = "corr";
                 g.score = "*";
+                g.options = JSON.parse(g.options);
               });
               this.decorate(this.corrGames);
               // Now ask completed games (partial list)
@@ -181,10 +170,26 @@ export default {
     this.cleanBeforeDestroy();
   },
   methods: {
+    openConnection: function() {
+      // Initialize connection
+      this.conn = new WebSocket(this.connexionString);
+      this.conn.onopen = () => { this.reconnectTimeout = 250; };
+      this.conn.onmessage = this.socketMessageListener;
+      const closeConnection = () => {
+        this.reopenTimeout = setTimeout(
+          () => {
+            this.openConnection();
+            this.reconnectTimeout = Math.min(2*this.reconnectTimeout, 30000);
+          },
+          this.reconnectTimeout
+        );
+      };
+      this.conn.onerror = closeConnection;
+      this.conn.onclose = closeConnection;
+    },
     cleanBeforeDestroy: function() {
-      clearInterval(this.socketCloseListener);
       window.removeEventListener("beforeunload", this.cleanBeforeDestroy);
-      this.conn.removeEventListener("message", this.socketMessageListener);
+      clearTimeout(this.reopenTimeout);
       this.conn.send(JSON.stringify({code: "disconnect"}));
       this.conn = null;
     },
@@ -279,6 +284,8 @@ export default {
         case "notifynewgame": {
           let gameInfo = data.data;
           this.setVname(gameInfo);
+          // TODO: remove patch on next line (options || "{}")
+          gameInfo.options = JSON.parse(gameInfo.options || "{}");
           const type = (gameInfo.cadence.indexOf('d') >= 0 ? "corr": "live");
           let game = Object.assign(
             {
@@ -368,7 +375,10 @@ export default {
               if (L > 0) {
                 this.cursor["corr"] = res.games[L - 1].created;
                 let moreGames = res.games;
-                moreGames.forEach(g => g.type = "corr");
+                moreGames.forEach(g => {
+                  g.type = "corr";
+                  g.options = JSON.parse(g.options);
+                });
                 this.decorate(moreGames);
                 this.corrGames = this.corrGames.concat(moreGames);
               }
@@ -386,7 +396,8 @@ export default {
             this.cursor["live"] = localGames[L - 1].created - 1;
             localGames.forEach(g => {
               g.type = "live";
-              if (!g.options) g.options = {}; //TODO: remove patch
+              // TODO: remove patch on next line (options || "{}")
+              g.options = JSON.parse(g.options || "{}");
             });
             this.decorate(localGames);
             this.liveGames = this.liveGames.concat(localGames);
@@ -403,7 +414,8 @@ export default {
             this.cursor["import"] = importGames[L - 1].created - 1;
             importGames.forEach(g => {
               g.type = "import";
-              if (!g.options) g.options = {}; //TODO: remove patch
+              // TODO: remove following patch (options || "{}")
+              g.options = JSON.parse(g.options || "{}");
               this.setVname(g);
             });
             this.importGames = this.importGames.concat(importGames);