RLG-Web client: use WebSockets for game lists.
Use the WebSocket connection to /status to create the list of current games.
This commit is contained in:
parent
bec02aea9e
commit
1ef1b16014
1 changed files with 84 additions and 40 deletions
124
rlgterm.js
124
rlgterm.js
|
|
@ -75,6 +75,8 @@ var games = {
|
|||
}
|
||||
};
|
||||
|
||||
var wsHost = "localhost:8080";
|
||||
|
||||
var session = {
|
||||
/* The session id assigned by the server. */
|
||||
id: null,
|
||||
|
|
@ -91,6 +93,8 @@ var session = {
|
|||
var statInterval = null;
|
||||
/* How frequently to check. */
|
||||
var statDelta = 8000;
|
||||
/* A WebSocket to listen for status events. */
|
||||
var statsock = null;
|
||||
|
||||
function writeData(hexstr) {
|
||||
var codenum;
|
||||
|
|
@ -466,6 +470,78 @@ function formlogin(ev) {
|
|||
return;
|
||||
}
|
||||
|
||||
function tableCurrent(gamelist) {
|
||||
var gamediv = document.getElementById("gametable");
|
||||
while (gamediv.children.length > 2)
|
||||
gamediv.removeChild(gamediv.children[2]);
|
||||
if (gamelist.length === 0) {
|
||||
gamediv.style.display = "none";
|
||||
document.getElementById("nogames").style.display = "block";
|
||||
}
|
||||
else {
|
||||
gamediv.style.display = "table";
|
||||
document.getElementById("nogames").style.display = "none";
|
||||
}
|
||||
for (var i = 0; i < gamelist.length; i++) {
|
||||
var row = document.createElement("div");
|
||||
var cell1 = document.createElement("div");
|
||||
var cell2 = document.createElement("div");
|
||||
var cell3 = document.createElement("div");
|
||||
var cell4 = document.createElement("div");
|
||||
cell1.appendChild(document.createTextNode(gamelist[i].p));
|
||||
var uname = gamelist[i].g;
|
||||
if (uname in games)
|
||||
cell2.appendChild(document.createTextNode(games[uname].name));
|
||||
else {
|
||||
continue;
|
||||
}
|
||||
cell3.appendChild(document.createTextNode(idlestr(gamelist[i].i)));
|
||||
var button = document.createElement("span");
|
||||
button.appendChild(document.createTextNode("Watch"));
|
||||
button.onclick = makeWatcher(gamelist[i].n);
|
||||
button.className = "ibutton";
|
||||
cell4.appendChild(button);
|
||||
row.appendChild(cell1);
|
||||
row.appendChild(cell2);
|
||||
row.appendChild(cell3);
|
||||
row.appendChild(cell4);
|
||||
gamediv.appendChild(row);
|
||||
}
|
||||
}
|
||||
|
||||
/* Handles the status socket, opening and closing it when necessary. */
|
||||
function wsCurrent() {
|
||||
if (!WebSocket)
|
||||
return;
|
||||
if (session.id) {
|
||||
/* Don't bother with status if already playing/watching. */
|
||||
if (statsock) {
|
||||
statsock.close();
|
||||
statsock = null;
|
||||
}
|
||||
return;
|
||||
}
|
||||
if (statsock)
|
||||
return;
|
||||
statsock = new WebSocket("ws://" + wsHost + "/status");
|
||||
statsock.onmessage = function (ev) {
|
||||
var msg;
|
||||
try {
|
||||
msg = JSON.parse(ev.data);
|
||||
} catch (e) {
|
||||
if (e instanceof SyntaxError)
|
||||
return;
|
||||
}
|
||||
if (msg.t != "t") {
|
||||
return;
|
||||
}
|
||||
tableCurrent(msg.g);
|
||||
};
|
||||
statsock.onclose = function (ev) {
|
||||
statsock = null;
|
||||
}
|
||||
}
|
||||
|
||||
function getcurrent(clear) {
|
||||
if (session.id || clear) {
|
||||
if (statInterval) {
|
||||
|
|
@ -477,6 +553,11 @@ function getcurrent(clear) {
|
|||
if (!statInterval) {
|
||||
statInterval = window.setInterval(getcurrent, statDelta);
|
||||
}
|
||||
if (session.lcred)
|
||||
getchoices();
|
||||
if (WebSocket) {
|
||||
return;
|
||||
}
|
||||
var req = new XMLHttpRequest();
|
||||
req.onerror = errHandler;
|
||||
req.onreadystatechange = function () {
|
||||
|
|
@ -492,48 +573,10 @@ function getcurrent(clear) {
|
|||
if (!reply.s) {
|
||||
return;
|
||||
}
|
||||
var gamediv = document.getElementById("gametable");
|
||||
while (gamediv.children.length > 2)
|
||||
gamediv.removeChild(gamediv.children[2]);
|
||||
if (reply.g.length === 0) {
|
||||
gamediv.style.display = "none";
|
||||
document.getElementById("nogames").style.display = "block";
|
||||
}
|
||||
else {
|
||||
gamediv.style.display = "table";
|
||||
document.getElementById("nogames").style.display = "none";
|
||||
}
|
||||
for (var i = 0; i < reply.g.length; i++) {
|
||||
var row = document.createElement("div");
|
||||
var cell1 = document.createElement("div");
|
||||
var cell2 = document.createElement("div");
|
||||
var cell3 = document.createElement("div");
|
||||
var cell4 = document.createElement("div");
|
||||
cell1.appendChild(document.createTextNode(reply.g[i].p));
|
||||
var uname = reply.g[i].g;
|
||||
if (uname in games)
|
||||
cell2.appendChild(document.createTextNode(games[uname].name));
|
||||
else {
|
||||
debug(1, "Unrecognized game: " + uname);
|
||||
continue;
|
||||
}
|
||||
cell3.appendChild(document.createTextNode(idlestr(reply.g[i].i)));
|
||||
var button = document.createElement("span");
|
||||
button.appendChild(document.createTextNode("Watch"));
|
||||
button.onclick = makeWatcher(reply.g[i].n);
|
||||
button.className = "ibutton";
|
||||
cell4.appendChild(button);
|
||||
row.appendChild(cell1);
|
||||
row.appendChild(cell2);
|
||||
row.appendChild(cell3);
|
||||
row.appendChild(cell4);
|
||||
gamediv.appendChild(row);
|
||||
}
|
||||
tableCurrent(reply.g);
|
||||
};
|
||||
req.open('GET', '/status', true);
|
||||
req.send();
|
||||
if (session.lcred)
|
||||
getchoices();
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -699,7 +742,7 @@ function makeWatcher(n) {
|
|||
}
|
||||
|
||||
function wsWatch(gamenumber) {
|
||||
var sockurl = "ws://localhost:8080/watch/" + String(gamenumber);
|
||||
var sockurl = "ws://" + wsHost + "/watch/" + String(gamenumber);
|
||||
var ws = new WebSocket(sockurl);
|
||||
ws.onopen = function (event) {
|
||||
session.id = true;
|
||||
|
|
@ -871,6 +914,7 @@ function setmode(mode, ev) {
|
|||
document.getElementById("register").style.display = "block";
|
||||
document.getElementById("current").style.display = "none";
|
||||
}
|
||||
wsCurrent();
|
||||
}
|
||||
|
||||
function toggleBlock(id) {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue