view web/websocket.js @ 2405:69ca2b2fc133

overcomplicated attempt at persisting the pane layout in the rdf graph this was hard because we have to somehow wait for the graph to load before config'ing the panes
author drewp@bigasterisk.com
date Fri, 17 May 2024 16:58:26 -0700
parents 4556eebe5d73
children
line wrap: on
line source

/*
  url is now relative to the window location. Note that nginx may drop
  the connection after 60sec of inactivity.
*/

class ReconnectingWebsocket {
    
    constructor(url, onMessage) {
        this.onMessage = onMessage;
        this.ws = null;
        this.connectTimer = null
        this.pong = 0;
        
        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);
        };
        this.ws.onmessage = (evt) => {
            this.onMessage(JSON.parse(evt.data));
        };
    }
    disconnect() {
        this.reconnect = false;
        this.ws.close();
    }
}



function reconnectingWebSocket(url, onMessage) {
    return new ReconnectingWebsocket(url, onMessage);
}