# HG changeset patch # User Drew Perttula # Date 2019-06-06 00:07:07 # Node ID 19c2e6216cf8acb40b5731161aa36ec09b389e28 # Parent 88ca10c9e31a22d5eb7f4f1a0ebffd0cf906a5ef support disconnect() on a reconnectingWebSocket to make it stop connecting Ignore-this: db2fa6ff2ccdeadecf1fc7a1d144535c diff --git a/light9/web/websocket.js b/light9/web/websocket.js --- a/light9/web/websocket.js +++ b/light9/web/websocket.js @@ -2,30 +2,61 @@ url is now relative to the window location. Note that nginx may drop the connection after 60sec of inactivity. */ -function reconnectingWebSocket(url, onMessage) { - var pong = 0; + +class ReconnectingWebsocket { - var fullUrl = ( - "ws://" - + window.location.host - + window.location.pathname - + (window.location.pathname.match(/\/$/) ? "" : "/") - + url); - function connect() { - var ws = new WebSocket(fullUrl); + constructor(url, onMessage) { + this.onMessage = onMessage; + this.ws = null; + this.connectTimer = null + this.pong = 0; - ws.onopen = function() { $("#status").text("connected"); }; - ws.onerror = function(e) { $("#status").text("error: "+e); }; - ws.onclose = function() { - pong = 1 - pong; - $("#status").text("disconnected (retrying "+(pong ? "😼":"😺")+")"); - // this should be under a requestAnimationFrame to - // save resources - setTimeout(connect, 2000); + this.fullUrl = ( + "ws://" + + window.location.host + + window.location.pathname + + (window.location.pathname.match(/\/$/) ? "" : "/") + + url); + this.connect(); + } + setStatus(txt) { + const docStatus = document.querySelector('#status') + if (docStatus) { + docStatus.innerText = txt; + } + } + connect() { + this.reconnect = true; + this.ws = new WebSocket(this.fullUrl); + + this.ws.onopen = () => { this.setStatus("connected"); }; + this.ws.onerror = (e) => { this.setStatus("error: "+e); }; + this.ws.onclose = () => { + this.pong = 1 - this.pong; + this.setStatus("disconnected (retrying "+(this.pong ? "😼":"😺")+")"); + this.ws = null; + + this.connectTimer = setTimeout(() => { + this.connectTimer = null; + requestAnimationFrame(() => { + if (this.reconnect) { + this.connect(); + } + }); + }, 2000); }; - ws.onmessage = function (evt) { - onMessage(JSON.parse(evt.data)); + this.ws.onmessage = (evt) => { + this.onMessage(JSON.parse(evt.data)); }; } - connect(); + disconnect() { + this.reconnect = false; + this.ws.close(); + } } + + + +function reconnectingWebSocket(url, onMessage) { + return new ReconnectingWebsocket(url, onMessage); +}