X-Git-Url: https://git.auder.net/?p=vchess.git;a=blobdiff_plain;f=client%2Fsrc%2Fviews%2FMyGames.vue;fp=client%2Fsrc%2Fviews%2FMyGames.vue;h=ad330aec802c2454a4d4377dac8ad5961b4c0015;hp=d12fff480f845d1e031cc98926e24b89da124ce7;hb=16d06164d56332bd00fb22acc5b2b2997b942d73;hpb=be4b9421603ea763010b01b853363a1bda93ce36 diff --git a/client/src/views/MyGames.vue b/client/src/views/MyGames.vue index d12fff48..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 = () => { @@ -182,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; },