Mercurial > code > home > repos > light9

annotate web/ascoltami/main.ts @ 2419:e3af0ac507c8

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
new exposure-finder algorithm
author drewp@bigasterisk.com
date Tue, 21 May 2024 14:08:17 -0700
parents 4556eebe5d73
children cc69faa87c27
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
2053
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
1 function byId(id: string): HTMLElement {
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
2 return document.getElementById(id)!;
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
3 }
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
4
2124
eb5d8349c871 pass timing updates in a simpler way
drewp@bigasterisk.com
parents: 2123
diff changeset
5 export interface TimingUpdate {
eb5d8349c871 pass timing updates in a simpler way
drewp@bigasterisk.com
parents: 2123
diff changeset
6 // GET /ascoltami/time response
eb5d8349c871 pass timing updates in a simpler way
drewp@bigasterisk.com
parents: 2123
diff changeset
7 duration: number;
eb5d8349c871 pass timing updates in a simpler way
drewp@bigasterisk.com
parents: 2123
diff changeset
8 next: string; // e.g. 'play'
eb5d8349c871 pass timing updates in a simpler way
drewp@bigasterisk.com
parents: 2123
diff changeset
9 playing: boolean;
eb5d8349c871 pass timing updates in a simpler way
drewp@bigasterisk.com
parents: 2123
diff changeset
10 song: string;
eb5d8349c871 pass timing updates in a simpler way
drewp@bigasterisk.com
parents: 2123
diff changeset
11 started: number; // unix sec
eb5d8349c871 pass timing updates in a simpler way
drewp@bigasterisk.com
parents: 2123
diff changeset
12 t: number; // seconds into song
eb5d8349c871 pass timing updates in a simpler way
drewp@bigasterisk.com
parents: 2123
diff changeset
13 state: { current: { name: string }; pending: { name: string } };
eb5d8349c871 pass timing updates in a simpler way
drewp@bigasterisk.com
parents: 2123
diff changeset
14 }
eb5d8349c871 pass timing updates in a simpler way
drewp@bigasterisk.com
parents: 2123
diff changeset
15
2360
6c6b29d21959 carefully rm parameter
drewp@bigasterisk.com
parents: 2311
diff changeset
16 (window as any).finishOldStyleSetup = async (times: { intro: number; post: number }, timingUpdate: (data: TimingUpdate) => void) => {
2053
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
17 let currentHighlightedSong = "";
2123
c4427fd59306 port some of ascoltami into lit
drewp@bigasterisk.com
parents: 2114
diff changeset
18 // let lastPlaying = false;
2050
7ed414bdaab9 wip porting asco to TS and not-jquery
drewp@bigasterisk.com
parents:
diff changeset
19
2311
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
20
2372
06bf6dae8e64 reorg tools into light9/web/ and a single vite instance
drewp@bigasterisk.com
parents: 2360
diff changeset
21 const events = new EventSource("../service/ascoltami/time/stream");
2311
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
22 events.addEventListener("message", (m)=>{
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
23 const update = JSON.parse(m.data) as TimingUpdate
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
24 updateCurrent(update)
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
25 markUpdateTiming();
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
26 })
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
27
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
28 async function updateCurrent(data:TimingUpdate) {
2053
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
29 byId("currentSong").innerText = data.song;
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
30 if (data.song != currentHighlightedSong) {
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
31 showCurrentSong(data.song);
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
32 }
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
33 byId("currentTime").innerText = data.t.toFixed(1);
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
34 byId("leftTime").innerText = (data.duration - data.t).toFixed(1);
2123
c4427fd59306 port some of ascoltami into lit
drewp@bigasterisk.com
parents: 2114
diff changeset
35 byId("leftAutoStopTime").innerText = Math.max(0, data.duration - times.post - data.t).toFixed(1);
2053
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
36 byId("states").innerText = JSON.stringify(data.state);
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
37 // document.querySelector("#timeSlider").slider({ value: data.t, max: data.duration });
2124
eb5d8349c871 pass timing updates in a simpler way
drewp@bigasterisk.com
parents: 2123
diff changeset
38 timingUpdate(data);
2053
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
39 }
2311
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
40 let recentUpdates: Array<number> = [];
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
41 function markUpdateTiming() {
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
42 recentUpdates.push(+new Date());
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
43 recentUpdates = recentUpdates.slice(Math.max(recentUpdates.length - 5, 0));
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
44 }
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
45
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
46 function refreshUpdateFreqs() {
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
47 if (recentUpdates.length > 1) {
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
48 if (+new Date() - recentUpdates[recentUpdates.length - 1] > 1000) {
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
49 byId("updateActual").innerText = "(stalled)";
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
50 return;
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
51 }
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
52
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
53 var avgMs = (recentUpdates[recentUpdates.length - 1] - recentUpdates[0]) / (recentUpdates.length - 1);
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
54 byId("updateActual").innerText = "" + Math.round(1000 / avgMs);
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
55 }
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
56 }
a10f0f0e4dae update web ui with one SSE, not repeated requests
drewp@bigasterisk.com
parents: 2124
diff changeset
57 setInterval(refreshUpdateFreqs, 2000);
2053
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
58
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
59 function showCurrentSong(uri: string) {
2123
c4427fd59306 port some of ascoltami into lit
drewp@bigasterisk.com
parents: 2114
diff changeset
60 document.querySelectorAll(".songs div").forEach((row: Element, i: number) => {
c4427fd59306 port some of ascoltami into lit
drewp@bigasterisk.com
parents: 2114
diff changeset
61 if (row.querySelector("button")!.dataset.uri == uri) {
c4427fd59306 port some of ascoltami into lit
drewp@bigasterisk.com
parents: 2114
diff changeset
62 row.classList.add("currentSong");
c4427fd59306 port some of ascoltami into lit
drewp@bigasterisk.com
parents: 2114
diff changeset
63 } else {
c4427fd59306 port some of ascoltami into lit
drewp@bigasterisk.com
parents: 2114
diff changeset
64 row.classList.remove("currentSong");
c4427fd59306 port some of ascoltami into lit
drewp@bigasterisk.com
parents: 2114
diff changeset
65 }
c4427fd59306 port some of ascoltami into lit
drewp@bigasterisk.com
parents: 2114
diff changeset
66 });
2053
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
67 currentHighlightedSong = uri;
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
68 }
b7a3dff5514d rough and untested port of asco from jquery to vanilla
drewp@bigasterisk.com
parents: 2050
diff changeset
69
2058
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
70 const data = await (await fetch("api/songs")).json();
2123
c4427fd59306 port some of ascoltami into lit
drewp@bigasterisk.com
parents: 2114
diff changeset
71 data.songs.forEach((song: { uri: string; label: string }) => {
2058
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
72 const button = document.createElement("button");
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
73 // link is just for dragging, not clicking
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
74 const link = document.createElement("a");
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
75 const n = document.createElement("span");
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
76 n.classList.add("num");
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
77 n.innerText = song.label.slice(0, 2);
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
78 link.appendChild(n);
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
79
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
80 const sn = document.createElement("span");
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
81 sn.classList.add("song-name");
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
82 sn.innerText = song.label.slice(2).trim();
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
83 link.appendChild(sn);
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
84 link.setAttribute("href", song.uri);
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
85 link.addEventListener("click", (ev) => {
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
86 ev.stopPropagation();
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
87 button.click();
2050
7ed414bdaab9 wip porting asco to TS and not-jquery
drewp@bigasterisk.com
parents:
diff changeset
88 });
2058
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
89 button.appendChild(link);
2114
758ce4dfbd2f asco layout
drewp@bigasterisk.com
parents: 2058
diff changeset
90 button.dataset.uri = song.uri;
2058
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
91 button.addEventListener("click", async (ev) => {
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
92 await fetch("api/song", { method: "POST", body: song.uri });
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
93 showCurrentSong(song.uri);
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
94 });
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
95 const dv = document.createElement("div");
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
96 dv.appendChild(button);
2123
c4427fd59306 port some of ascoltami into lit
drewp@bigasterisk.com
parents: 2114
diff changeset
97 document.querySelector(".songs")!.appendChild(dv);
2058
16c7dd543250 asco web: fix more porting bugs. UI might work (except for time slider)
drewp@bigasterisk.com
parents: 2053
diff changeset
98 });
2050
7ed414bdaab9 wip porting asco to TS and not-jquery
drewp@bigasterisk.com
parents:
diff changeset
99
2123
c4427fd59306 port some of ascoltami into lit
drewp@bigasterisk.com
parents: 2114
diff changeset
100 };