have a roster and a whoami

This commit is contained in:
2026-02-12 20:32:34 -08:00
parent db6d244cb6
commit 08c0119ae0
6 changed files with 102 additions and 17 deletions
+7 -1
View File
@@ -9,7 +9,13 @@
*
* @module
*/
type state = {
whoami: string;
roster: Array<string>;
};
declare let st: state;
declare function main(): Promise<void>;
type ws_msg = ["join", string] | ["down", string];
type ws_msg = ["whoami", string] | ["roster", Array<string>];
declare function handle_ws_msg(message: ws_msg): void;
declare function ws_send_json(ws: WebSocket, x: any): void;
declare function render_state(): void;
+28
View File
@@ -10,6 +10,8 @@
*
* @module
*/
let st = { whoami: "",
roster: [] };
main();
async function main() {
// start websocket immediately
@@ -19,6 +21,7 @@ async function main() {
// handle button click
init_join.addEventListener('click', function () {
init.hidden = true;
document.getElementById('run').hidden = false;
ws = new WebSocket('/ws/webrtc');
ws.onopen = function (e) { console.log('ws open'); };
ws.onclose = function (e) { console.warn('ws closed'); };
@@ -33,10 +36,35 @@ async function main() {
}
function handle_ws_msg(message) {
console.log('message from server:', message);
switch (message[0]) {
case "whoami":
st.whoami = message[1];
break;
case "roster":
st.roster = message[1];
break;
default:
console.warn("unknown message", message);
}
render_state();
}
function ws_send_json(ws, x) {
let s = JSON.stringify(x, undefined, 4);
console.log('sending:\n', s);
ws.send(s);
}
function render_state() {
console.log('st', st);
// whoami
document.getElementById('whoami').innerText = st.whoami;
//
let roster_ul = document.getElementById('roster-ul');
let newChildren = [];
for (let nick of st.roster) {
let li = document.createElement('li');
li.innerText = nick;
newChildren.push(li);
}
roster_ul.replaceChildren(...newChildren);
}
//# sourceMappingURL=webrtc.js.map
+1 -1
View File
@@ -1 +1 @@
{"version":3,"file":"webrtc.js","sourceRoot":"","sources":["../ts/webrtc.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;GAUG;AAEH,IAAI,EAAE,CAAC;AAEP,KAAK,UACL,IAAI;IAIA,8BAA8B;IAC9B,IAAI,EAAa,CAAC;IAClB,IAAI,IAAI,GAAG,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAmB,CAAC;IAC7D,IAAI,SAAS,GAAG,QAAQ,CAAC,cAAc,CAAC,WAAW,CAAsB,CAAC;IAE1E,sBAAsB;IACtB,SAAS,CAAC,gBAAgB,CAAC,OAAO,EAC9B;QACI,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;QACnB,EAAE,GAAG,IAAI,SAAS,CAAC,YAAY,CAAC,CAAC;QACjC,EAAE,CAAC,MAAM,GAAM,UAAS,CAAC,IAAI,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC;QACvD,EAAE,CAAC,OAAO,GAAK,UAAS,CAAC,IAAI,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;QAC1D,EAAE,CAAC,OAAO,GAAK,UAAS,CAAC,IAAI,OAAO,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC9D,EAAE,CAAC,SAAS;YACR,UAAS,CAAC;gBACN,sCAAsC;gBACtC,IAAI,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAW,CAAC;gBAC3C,aAAa,CAAC,OAAO,CAAC,CAAC;YAC3B,CAAC,CAAC;IACV,CAAC,CACJ,CAAC;AACN,CAAC;AAKD,SACA,aAAa,CACR,OAAe;IAGhB,OAAO,CAAC,GAAG,CAAC,sBAAsB,EAAE,OAAO,CAAC,CAAC;AACjD,CAAC;AAID,SACA,YAAY,CACP,EAAc,EACd,CAAQ;IAGT,IAAI,CAAC,GAAW,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,SAAS,EAAE,CAAC,CAAC,CAAC;IAChD,OAAO,CAAC,GAAG,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC;IAE7B,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;AACf,CAAC"}
{"version":3,"file":"webrtc.js","sourceRoot":"","sources":["../ts/webrtc.ts"],"names":[],"mappings":"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"}
+44 -2
View File
@@ -10,6 +10,14 @@
* @module
*/
type state =
{whoami: string,
roster: Array<string>};
let st: state =
{whoami: "",
roster: []};
main();
async function
@@ -26,6 +34,7 @@ main
init_join.addEventListener('click',
function() {
init.hidden = true;
document.getElementById('run')!.hidden = false;
ws = new WebSocket('/ws/webrtc');
ws.onopen = function(e) { console.log('ws open'); };
ws.onclose = function(e) { console.warn('ws closed'); };
@@ -40,8 +49,8 @@ main
);
}
type ws_msg = ["join", string]
| ["down", string];
type ws_msg = ["whoami", string]
| ["roster", Array<string>];
function
handle_ws_msg
@@ -49,6 +58,18 @@ handle_ws_msg
: void
{
console.log('message from server:', message);
switch(message[0]) {
case "whoami":
st.whoami = message[1];
break;
case "roster":
st.roster = (message[1] as Array<string>);
break;
default:
console.warn("unknown message", message);
}
render_state();
}
@@ -64,3 +85,24 @@ ws_send_json
ws.send(s);
}
function
render_state
()
: void
{
console.log('st', st);
// whoami
document.getElementById('whoami')!.innerText = st.whoami;
//
let roster_ul = document.getElementById('roster-ul') as HTMLUListElement;
let newChildren : Array<HTMLElement> = [];
for (let nick of st.roster) {
let li = document.createElement('li');
li.innerText = nick;
newChildren.push(li);
}
roster_ul.replaceChildren(...newChildren);
}
+1 -1
View File
@@ -20,7 +20,7 @@
</div>
<div id="roster" hidden>
<div id="run" hidden>
<h2>Whoami: <span id="whoami"></span></h2>
<h2>Roster</h2>