RLG-Web client: implement watching.
It is now possible to watch games currently being played through RLG-Web, but not dgamelaunch. Also, there are some deficiencies, like getting chaos until an absolute cursor addressing happens.
This commit is contained in:
John "Elwin" Edwards
parent
553f07360c
commit
67f187700c
2 changed files with 91 additions and 41 deletions
|
|
@ -88,7 +88,7 @@
|
|||
<div class="modal" id="current">
|
||||
<div id="gametable" class="formtable">
|
||||
<div class="tcapt">Games in Progress</div>
|
||||
<div><div>Player</div><div>Game</div></div>
|
||||
<div><div>Player</div><div>Game</div><div>Actions</div></div>
|
||||
</div>
|
||||
<div id="nogames">There are no games to watch.</div>
|
||||
</div>
|
||||
|
|
|
|||
124
rlgterm.js
124
rlgterm.js
|
|
@ -68,11 +68,15 @@ var games = {
|
|||
}
|
||||
};
|
||||
|
||||
/* Login name and key */
|
||||
var lname = null;
|
||||
var lcred = null;
|
||||
var session = {
|
||||
/* The session id assigned by the server. */
|
||||
var sessid = null;
|
||||
id: null,
|
||||
/* Login name and key */
|
||||
lname: null,
|
||||
lcred: null,
|
||||
/* Whether the game is being played or just watched. */
|
||||
playing: false
|
||||
};
|
||||
|
||||
function writeData(hexstr) {
|
||||
var codenum;
|
||||
|
|
@ -213,10 +217,10 @@ function processMsg(msg) {
|
|||
}
|
||||
|
||||
function getData() {
|
||||
if (sessid == null)
|
||||
if (session.id == null)
|
||||
return;
|
||||
var datareq = new XMLHttpRequest();
|
||||
var msg = JSON.stringify({"id": sessid, "t": "n"});
|
||||
var msg = JSON.stringify({"id": session.id, "t": "n"});
|
||||
datareq.onreadystatechange = function () {
|
||||
if (datareq.readyState == 4 && datareq.status == 200) {
|
||||
var wasdata = processMsg(datareq.responseText);
|
||||
|
|
@ -245,7 +249,7 @@ function postResponseHandler() {
|
|||
|
||||
function sendback(str) {
|
||||
/* For responding to terminal queries. */
|
||||
var msgDict = {"id": sessid, "t": "d", "n": nsend++, "d": str};
|
||||
var msgDict = {"id": session.id, "t": "d", "n": nsend++, "d": str};
|
||||
var datareq = new XMLHttpRequest();
|
||||
datareq.onreadystatechange = postResponseHandler;
|
||||
datareq.open('POST', '/feed', true);
|
||||
|
|
@ -254,7 +258,7 @@ function sendback(str) {
|
|||
}
|
||||
|
||||
function sendkey(ev) {
|
||||
if (sessid == null)
|
||||
if (!session.playing)
|
||||
return;
|
||||
var keynum = ev.keyCode;
|
||||
var code;
|
||||
|
|
@ -291,11 +295,9 @@ function sendkey(ev) {
|
|||
debug(1, "Ignoring keycode " + keynum);
|
||||
return;
|
||||
}
|
||||
// Isn't this check redundant?
|
||||
if (sessid != null)
|
||||
ev.preventDefault();
|
||||
var datareq = new XMLHttpRequest();
|
||||
var msgDict = {"id": sessid, "t": "d", "n": nsend++, "d": code};
|
||||
var msgDict = {"id": session.id, "t": "d", "n": nsend++, "d": code};
|
||||
datareq.onreadystatechange = postResponseHandler;
|
||||
datareq.open('POST', '/feed', true);
|
||||
datareq.send(JSON.stringify(msgDict));
|
||||
|
|
@ -307,7 +309,7 @@ var charshifts = { '-': "5f", '=': "2b", '[': "7b", ']': "7d", '\\': "7c",
|
|||
}
|
||||
|
||||
function vkey(c) {
|
||||
if (sessid == null)
|
||||
if (!session.playing)
|
||||
return;
|
||||
var keystr;
|
||||
if (c.match(/^[a-z]$/)) {
|
||||
|
|
@ -345,7 +347,7 @@ function vkey(c) {
|
|||
else
|
||||
return;
|
||||
var datareq = new XMLHttpRequest();
|
||||
var msgDict = {"id": sessid, "t": "d", "n": nsend++, "d": keystr};
|
||||
var msgDict = {"id": session.id, "t": "d", "n": nsend++, "d": keystr};
|
||||
datareq.onreadystatechange = postResponseHandler;
|
||||
datareq.open('POST', '/feed', true);
|
||||
datareq.send(JSON.stringify(msgDict));
|
||||
|
|
@ -382,7 +384,7 @@ function togglectrl() {
|
|||
|
||||
function formlogin(ev) {
|
||||
ev.preventDefault();
|
||||
if (sessid != null)
|
||||
if (session.id != null)
|
||||
return;
|
||||
var loginmsg = {};
|
||||
loginmsg["name"] = document.getElementById("input_name").value;
|
||||
|
|
@ -394,8 +396,8 @@ function formlogin(ev) {
|
|||
var reply = JSON.parse(req.responseText);
|
||||
if (reply.t == 'l') {
|
||||
/* Success */
|
||||
lcred = reply.k;
|
||||
lname = reply.u;
|
||||
session.lcred = reply.k;
|
||||
session.lname = reply.u;
|
||||
setTitle("Logged in as " + reply.u);
|
||||
debug(1, "Logged in as " + reply.u + " with id " + reply.k);
|
||||
setmode("choose");
|
||||
|
|
@ -412,7 +414,7 @@ function formlogin(ev) {
|
|||
}
|
||||
|
||||
function getcurrent() {
|
||||
if (sessid)
|
||||
if (session.id)
|
||||
return;
|
||||
var req = new XMLHttpRequest();
|
||||
req.onreadystatechange = function () {
|
||||
|
|
@ -430,7 +432,7 @@ function getcurrent() {
|
|||
}
|
||||
var gamediv = document.getElementById("gametable");
|
||||
while (gamediv.children.length > 2)
|
||||
gamediv.removeChild(optdiv.children[2]);
|
||||
gamediv.removeChild(gamediv.children[2]);
|
||||
if (reply.g.length === 0) {
|
||||
gamediv.style.display = "none";
|
||||
document.getElementById("nogames").style.display = "block";
|
||||
|
|
@ -443,10 +445,17 @@ function getcurrent() {
|
|||
var row = document.createElement("div");
|
||||
var cell1 = document.createElement("div");
|
||||
var cell2 = document.createElement("div");
|
||||
var cell3 = document.createElement("div");
|
||||
cell1.appendChild(document.createTextNode(reply.g[i].p));
|
||||
cell2.appendChild(document.createTextNode(reply.g[i].g));
|
||||
var button = document.createElement("span");
|
||||
button.appendChild(document.createTextNode("Watch"));
|
||||
button.onclick = makeWatcher(reply.g[i].n);
|
||||
button.className = "ibutton";
|
||||
cell3.appendChild(button);
|
||||
row.appendChild(cell1);
|
||||
row.appendChild(cell2);
|
||||
row.appendChild(cell3);
|
||||
gamediv.appendChild(row);
|
||||
}
|
||||
};
|
||||
|
|
@ -456,7 +465,7 @@ function getcurrent() {
|
|||
}
|
||||
|
||||
function getchoices() {
|
||||
if (sessid != null || !lcred)
|
||||
if (session.id != null || !session.lcred)
|
||||
return;
|
||||
var req = new XMLHttpRequest();
|
||||
req.onreadystatechange = function () {
|
||||
|
|
@ -469,7 +478,8 @@ function getchoices() {
|
|||
if (e instanceof SyntaxError)
|
||||
return;
|
||||
}
|
||||
if (!("name" in reply) || reply["name"] != lname || !("stat" in reply))
|
||||
if (!("name" in reply) || reply["name"] != session.lname ||
|
||||
!("stat" in reply))
|
||||
return;
|
||||
var optdiv = document.getElementById("opttable");
|
||||
/* Don't remove the first child, it's the header. */
|
||||
|
|
@ -503,7 +513,7 @@ function getchoices() {
|
|||
optdiv.appendChild(rowdiv);
|
||||
}
|
||||
};
|
||||
req.open('GET', '/pstatus/' + lname, true);
|
||||
req.open('GET', '/pstatus/' + session.lname, true);
|
||||
req.send();
|
||||
return;
|
||||
}
|
||||
|
|
@ -523,10 +533,10 @@ function makeStarter(gname) {
|
|||
}
|
||||
|
||||
function startgame(game) {
|
||||
if (sessid != null || !lcred)
|
||||
if (session.id != null || !session.lcred)
|
||||
return;
|
||||
var smsg = {};
|
||||
smsg["key"] = lcred;
|
||||
smsg["key"] = session.lcred;
|
||||
smsg["game"] = game.uname;
|
||||
smsg["h"] = 24;
|
||||
smsg["w"] = 80;
|
||||
|
|
@ -537,10 +547,11 @@ function startgame(game) {
|
|||
var reply = JSON.parse(req.responseText);
|
||||
if (reply.t == 's') {
|
||||
/* Success */
|
||||
sessid = reply.id;
|
||||
session.id = reply.id;
|
||||
session.playing = true;
|
||||
termemu.resize(reply.h, reply.w);
|
||||
setTitle("Playing as " + lname);
|
||||
debug(1, "Playing with id " + sessid);
|
||||
setTitle("Playing as " + session.lname);
|
||||
debug(1, "Playing with id " + session.id);
|
||||
setmode("play");
|
||||
getData();
|
||||
}
|
||||
|
|
@ -556,9 +567,44 @@ function startgame(game) {
|
|||
return;
|
||||
}
|
||||
|
||||
function startwatching(gamenumber) {
|
||||
if (session.id != null)
|
||||
return;
|
||||
var wmsg = {"n": Number(gamenumber)};
|
||||
var req = new XMLHttpRequest();
|
||||
req.onreadystatechange = function () {
|
||||
if (req.readyState != 4 || req.status != 200)
|
||||
return;
|
||||
var reply = JSON.parse(req.responseText);
|
||||
if (reply.t == 'w') {
|
||||
/* Success */
|
||||
session.id = reply.id;
|
||||
session.playing = false;
|
||||
termemu.resize(reply.h, reply.w);
|
||||
setTitle("Watching");
|
||||
debug(1, "Watching with id " + session.id);
|
||||
setmode("play");
|
||||
getData();
|
||||
}
|
||||
else if (reply.t == 'E') {
|
||||
debug(1, "Could not watch game " + gamenumber + ": " + reply.s);
|
||||
}
|
||||
};
|
||||
req.open('POST', '/watch', true);
|
||||
req.send(JSON.stringify(wmsg));
|
||||
return;
|
||||
}
|
||||
|
||||
function makeWatcher(n) {
|
||||
function watcher(ev) {
|
||||
startwatching(n);
|
||||
}
|
||||
return watcher;
|
||||
}
|
||||
|
||||
function formreg(ev) {
|
||||
ev.preventDefault();
|
||||
if (sessid != null)
|
||||
if (session.id != null)
|
||||
return;
|
||||
var regmsg = {};
|
||||
regmsg["name"] = document.getElementById("regin_name").value;
|
||||
|
|
@ -572,10 +618,10 @@ function formreg(ev) {
|
|||
if (reply.t == 'r') {
|
||||
/* Success */
|
||||
debug(1, "Registered account: " + reply.d);
|
||||
lcred = reply.k;
|
||||
lname = reply.u;
|
||||
setTitle("Logged in as " + lname);
|
||||
debug(1, "Logged in as " + lname + "with id " + lcred);
|
||||
session.lcred = reply.k;
|
||||
session.lname = reply.u;
|
||||
setTitle("Logged in as " + session.lname);
|
||||
debug(1, "Logged in as " + session.lname + "with id " + session.lcred);
|
||||
setmode("choose");
|
||||
}
|
||||
else if (reply.t == 'E') {
|
||||
|
|
@ -591,27 +637,31 @@ function formreg(ev) {
|
|||
}
|
||||
|
||||
function gameover() {
|
||||
if (sessid == null)
|
||||
if (session.id == null)
|
||||
return;
|
||||
/* TODO IFACE2 If the end was unexpected, tell player the game was saved. */
|
||||
sessid = null;
|
||||
session.id = null;
|
||||
session.playing = false;
|
||||
ajaxstate.clear();
|
||||
setTitle("Game over.");
|
||||
nsend = 0;
|
||||
nrecv = 0;
|
||||
msgQ = [];
|
||||
if (session.lcred != null)
|
||||
setmode("choose");
|
||||
else
|
||||
setmode("login");
|
||||
return;
|
||||
}
|
||||
|
||||
function logout() {
|
||||
lcred = null;
|
||||
lname = null;
|
||||
session.lcred = null;
|
||||
session.lname = null;
|
||||
setmode("login");
|
||||
}
|
||||
|
||||
function stop() {
|
||||
if (!sessid)
|
||||
if (!session.id)
|
||||
return;
|
||||
var req = new XMLHttpRequest();
|
||||
req.onreadystatechange = function () {
|
||||
|
|
@ -621,7 +671,7 @@ function stop() {
|
|||
}
|
||||
};
|
||||
req.open('POST', '/feed', true);
|
||||
req.send(JSON.stringify({"id": sessid, "t": "q"}));
|
||||
req.send(JSON.stringify({"id": session.id, "t": "q"}));
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue