mirror of
https://github.com/cesanta/mongoose.git
synced 2024-12-14 08:39:23 +08:00
32 lines
1.5 KiB
HTML
32 lines
1.5 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<body>
|
||
|
|
<h1>JSON-RPC over Websocket demo</h1>
|
||
|
|
<input id="url" type="text" placeholder="Type URL" value="ws://localhost:8000/websocket" style="width:20em;" />
|
||
|
|
<button id="connect">connect</button>
|
||
|
|
<div style="height: 0.3em;"> </div>
|
||
|
|
<button id="btn1">Calculate 1 + 2</button>
|
||
|
|
<button id="btn2">Calculate 2 * 3</button>
|
||
|
|
<div style="margin-top: 1em;">Event log:</div>
|
||
|
|
<div id="log" style="background: #eee; height: 10em; padding: 0.5em; overflow:auto;"><div>
|
||
|
|
</body>
|
||
|
|
<script src="rpc-over-websocket.js"></script>
|
||
|
|
<script>
|
||
|
|
var rpc, E = function(id) { return document.getElementById(id); };
|
||
|
|
var url = E('url'), connect = E('connect'), btn1 = E('btn1'), btn2 = E('btn2'), msglog = E('log');
|
||
|
|
var enable = function(en) { btn1.disabled = btn2.disabled = !en; url.disabled = en; connect.innerHTML = en ? 'disconnect' : 'connect'; };
|
||
|
|
var log = text => msglog.innerHTML += text + '<br/>\n';
|
||
|
|
enable(false);
|
||
|
|
connect.onclick = function() {
|
||
|
|
console.log(rpc);
|
||
|
|
if (rpc) { rpc.close(); rpc = null; return; }
|
||
|
|
rpc = jsonrpc(url.value,
|
||
|
|
() => enable(true),
|
||
|
|
() => enable(false),
|
||
|
|
msg => log('NOTIFICATION: ' + JSON.stringify(msg)));
|
||
|
|
};
|
||
|
|
btn1.onclick = ev => rpc.call('sum', [1, 2]).then(res => log('SUM:' + JSON.stringify(res)));
|
||
|
|
btn2.onclick = ev => rpc.call('mul', [2, 3]).then(res => log('MUL:' + JSON.stringify(res)));
|
||
|
|
</script>
|
||
|
|
</html>
|