# HG changeset patch
# User drewp@bigasterisk.com
# Date 2023-05-31 20:34:06
# Node ID a10f0f0e4dae5630dd9a8ec78238d4b363c4a0a7
# Parent  3d58c1c78f1f94192f727771eeeb063de76ff44a

update web ui with one SSE, not repeated requests

diff --git a/light9/ascoltami/main.py b/light9/ascoltami/main.py
--- a/light9/ascoltami/main.py
+++ b/light9/ascoltami/main.py
@@ -50,6 +50,7 @@ class Ascoltami:
 
 
 def main():
+    logging.getLogger('sse_starlette.sse').setLevel(logging.INFO)
     Gst.init(None)
 
     graph = showconfig.getGraph()
diff --git a/light9/ascoltami/main.ts b/light9/ascoltami/main.ts
--- a/light9/ascoltami/main.ts
+++ b/light9/ascoltami/main.ts
@@ -17,8 +17,15 @@ export interface TimingUpdate {
   let currentHighlightedSong = "";
   // let lastPlaying = false;
 
-  async function updateCurrent() {
-    const data: TimingUpdate = await (await fetch("api/time")).json();
+  
+  const events = new EventSource("api/time/stream");
+  events.addEventListener("message", (m)=>{
+    const update = JSON.parse(m.data) as TimingUpdate
+    updateCurrent(update)
+    markUpdateTiming();
+  })
+
+  async function updateCurrent(data:TimingUpdate) {
     byId("currentSong").innerText = data.song;
     if (data.song != currentHighlightedSong) {
       showCurrentSong(data.song);
@@ -30,6 +37,24 @@ export interface TimingUpdate {
     //   document.querySelector("#timeSlider").slider({ value: data.t, max: data.duration });
     timingUpdate(data);
   }
+  let recentUpdates: Array<number> = [];
+  function markUpdateTiming() {
+    recentUpdates.push(+new Date());
+    recentUpdates = recentUpdates.slice(Math.max(recentUpdates.length - 5, 0));
+  }
+
+  function refreshUpdateFreqs() {
+    if (recentUpdates.length > 1) {
+      if (+new Date() - recentUpdates[recentUpdates.length - 1] > 1000) {
+        byId("updateActual").innerText = "(stalled)";
+        return;
+      }
+
+      var avgMs = (recentUpdates[recentUpdates.length - 1] - recentUpdates[0]) / (recentUpdates.length - 1);
+      byId("updateActual").innerText = "" + Math.round(1000 / avgMs);
+    }
+  }
+  setInterval(refreshUpdateFreqs, 2000);
 
   function showCurrentSong(uri: string) {
     document.querySelectorAll(".songs div").forEach((row: Element, i: number) => {
@@ -72,50 +97,4 @@ export interface TimingUpdate {
     document.querySelector(".songs")!.appendChild(dv);
   });
 
-  //   var pendingSlide = false;
-  //   $("#timeSlider").slider({
-  //     step: 0.01,
-  //     slide: function (event, ui) {
-  //       if (pendingSlide) {
-  //         return;
-  //       }
-  //       pendingSlide = true;
-  //       $.post("time", '{"t" : ' + ui.value + "}", function (data, status, xhr) {
-  //         pendingSlide = false;
-  //       });
-  //     },
-  //   });
-
-  let recentUpdates: Array<number> = [];
-  function onUpdate() {
-    recentUpdates.push(+new Date());
-    recentUpdates = recentUpdates.slice(Math.max(recentUpdates.length - 5, 0));
-    refreshUpdateFreqs();
-  }
-
-  function refreshUpdateFreqs() {
-    if (recentUpdates.length > 1) {
-      if (+new Date() - recentUpdates[recentUpdates.length - 1] > 1000) {
-        byId("updateActual").innerText = "(stalled)";
-        document.querySelectorAll(".dimStalled").forEach((el) => el.classList.add("stalled"));
-        return;
-      }
-
-      var avgMs = (recentUpdates[recentUpdates.length - 1] - recentUpdates[0]) / (recentUpdates.length - 1);
-      byId("updateActual").innerText = "" + Math.round(1000 / avgMs);
-    }
-  }
-  setInterval(refreshUpdateFreqs, 2000);
-
-  async function updateLoop() {
-    var whenDone = function () {
-      setTimeout(function () {
-        requestAnimationFrame(updateLoop);
-      }, 1000 / updateFreq);
-    };
-    onUpdate();
-    await updateCurrent();
-    whenDone();
-  }
-  updateLoop();
 };
diff --git a/light9/ascoltami/webapp.py b/light9/ascoltami/webapp.py
--- a/light9/ascoltami/webapp.py
+++ b/light9/ascoltami/webapp.py
@@ -109,7 +109,7 @@ async def timeStream(request: Request):
                 last_sent = msg
                 last_sent_time = now
 
-            await asyncio.sleep(0.2)
+            await asyncio.sleep(0.1)
 
     return EventSourceResponse(event_generator())