diff options
Diffstat (limited to 'test')
-rw-r--r-- | test/monitoring/monitor.js | 4 | ||||
-rw-r--r-- | test/tic-tac-toe.html | 87 |
2 files changed, 89 insertions, 2 deletions
diff --git a/test/monitoring/monitor.js b/test/monitoring/monitor.js index ec4821cc..1bdfcb43 100644 --- a/test/monitoring/monitor.js +++ b/test/monitoring/monitor.js @@ -454,12 +454,12 @@ function gottraceevent(obj) { x.className = x.className + " " + type; get(".time", x).textContent = data.time; get(".tag", x).textContent = ({ - request: function(r) { return r.api + "/" + r.verb + " [" + r.index + "] " + r.action; }, + request: function(r,d) { return r.api + "/" + r.verb + " [" + r.index + "] " + r.action + (r.action == 'reply' ? ' '+d.data.error : ''); }, service: function(r) { return r.api + "@" + r.action; }, daemon: function(r) { return r.api + ":" + r.action; }, event: function(r) { return r.name + "!" + r.action; }, global: function(r) { return "$" + r.action; }, - })[type](desc); + })[type](desc,data); var tab = makeobj(desc, 4); if ("data" in data) makeobjitem(tab, 2, "data", data.data); diff --git a/test/tic-tac-toe.html b/test/tic-tac-toe.html new file mode 100644 index 00000000..d9ea664c --- /dev/null +++ b/test/tic-tac-toe.html @@ -0,0 +1,87 @@ +<html> +<head> + <title>tic tac toe</title> + <style> + td { + border: 1px solid black; + width: 3em; + height: 3em; + font-weight: bolder; + text-align: center; + align-content: center; + } + .button { + border: 1px solid black; + border-radius: 5px; + } + .button:hover { + border-width: 2px; + font-weight: bolder; + } + </style> + <script type="text/javascript" src="AFB.js"></script> + <script type="text/javascript"> + var afb = new AFB("api", "HELLO"); + var ws; + + function $(x) { return document.getElementById(x); } + + + function replyok(obj) { + $("id").innerHTML = obj.response.boardid; + var i; + for (var i = 0 ; i < 9 ; i++) + $("cell-" + i).innerHTML = obj.response.board[i]; + } + function replyerr(obj) { + } + function gotevent(obj) { + ws.call("tictactoe/board").then(replyok, replyerr); + } + + function onopen() { + $("main").style.visibility = "visible"; + $("connected").innerHTML = "Connected to WebSocket server"; + ws.onevent("tictactoe/board", gotevent); + ws.call("tictactoe/new").then(gotevent, replyerr); + } + function onabort() { + $("main").style.visibility = "hidden"; + $("connected").innerHTML = "Connected Closed"; + } + + function init() { + ws = new afb.ws(onopen, onabort); + } + + </script> + +<body onload="init();"> + <h1>Tic Tac Toe</h1> + <div id="connected">Not Connected</div> + <div id="main" style="visibility:hidden"> + <div>board id <span id="id"></span></div> + <div> + <table> + <tr> + <td id="cell-0" onclick="javascript: ws.call('tictactoe/move',{'index':0})"> </td> + <td id="cell-1" onclick="javascript: ws.call('tictactoe/move',{'index':1})"> </td> + <td id="cell-2" onclick="javascript: ws.call('tictactoe/move',{'index':2})"> </td> + </tr> + <tr> + <td id="cell-3" onclick="javascript: ws.call('tictactoe/move',{'index':3})"> </td> + <td id="cell-4" onclick="javascript: ws.call('tictactoe/move',{'index':4})"> </td> + <td id="cell-5" onclick="javascript: ws.call('tictactoe/move',{'index':5})"> </td> + </tr> + <tr> + <td id="cell-6" onclick="javascript: ws.call('tictactoe/move',{'index':6})"> </td> + <td id="cell-7" onclick="javascript: ws.call('tictactoe/move',{'index':7})"> </td> + <td id="cell-8" onclick="javascript: ws.call('tictactoe/move',{'index':8})"> </td> + </tr> + </table> + </div> + <div><span class="button" id="play" onclick="javascript: ws.call('tictactoe/play')">play</span></div> + <div><span class="button" id="undo" onclick="javascript: ws.call('tictactoe/undo')">undo</span></div> + <div><span class="button" id="new" onclick="javascript: ws.call('tictactoe/new')">new</span></div> + </div> + |