1 files changed, 19 insertions, 13 deletions

diff --git a/web/script/player/player.ts b/web/script/player/player.ts
index 9365658..ff43ce2 100644
--- a/web/script/player/player.ts
+++ b/web/script/player/player.ts
@@ -3,6 +3,7 @@ import { JhlsMetadata, TimeRange } from "./jhls.d.ts";
 import { SegmentDownloader } from "./download.ts";
 import { PlayerTrack } from "./track.ts";
 import { ProfileSelector } from "./profiles.ts";
+import { Logger } from "../jshelper/src/log.ts";
 
 export interface BufferRange extends TimeRange { status: "buffered" | "loading" | "queued" }
 export class Player {
@@ -16,10 +17,15 @@ export class Player {
     public duration = new OVar(1)
     public playing = new OVar(false)
     public canplay = new OVar(false)
-    public buffering_status = new OVar<string | undefined>(undefined)
     public error = new OVar<string | undefined>(undefined)
 
-    constructor(private node_id: string) {
+    private cancel_buffering_pers: undefined | (() => void)
+    set_pers(s?: string) {
+        if (this.cancel_buffering_pers) this.cancel_buffering_pers()
+        if (s) this.cancel_buffering_pers = this.logger?.log_persistent(s)
+    }
+
+    constructor(private node_id: string, public logger?: Logger<string>) {
         this.video.onloadedmetadata = () => { }
         this.video.ondurationchange = () => { }
         this.video.ontimeupdate = () => {
@@ -28,17 +34,17 @@ export class Player {
         }
         this.video.onplay = () => {
             console.log("play");
-            this.buffering_status.value = "Resuming playback...";
+            this.set_pers("Resuming playback...")
         }
         this.video.onwaiting = () => {
             console.log("waiting");
-            this.buffering_status.value = "Buffering...";
+            this.set_pers("Buffering...")
             this.canplay.value = false;
         }
         this.video.onplaying = () => {
             console.log("playing");
             this.playing.value = true;
-            this.buffering_status.value = undefined;
+            this.set_pers()
         }
         this.video.onpause = () => {
             console.log("pause");
@@ -46,16 +52,16 @@ export class Player {
         }
         this.video.oncanplay = () => {
             console.log("canplay");
-            this.buffering_status.value = undefined
+            this.set_pers()
             this.canplay.value = true
         }
         this.video.onseeking = () => {
             console.log("seeking");
-            this.buffering_status.value = "Seeking..."
+            this.set_pers("Seeking...")
         }
         this.video.onseeked = () => {
             console.log("seeked");
-            this.buffering_status.value = undefined
+            this.set_pers()
         }
         this.video.onerror = e => {
             console.error("video element error:", e);
@@ -67,12 +73,12 @@ export class Player {
     }
 
     async fetch_meta() {
-        this.buffering_status.value = "Loading JHLS metadata..."
+        this.set_pers("Fetching initial segments...")
         const res = await fetch(`/n/${encodeURIComponent(this.node_id)}/stream?format=jhls`)
         if (!res.ok) return this.error.value = "Cannot download JHLS metadata"
         const metadata = await res.json() as JhlsMetadata
+        this.set_pers()
 
-        this.buffering_status.value = undefined
         this.duration.value = metadata.duration
         this.video.src = URL.createObjectURL(this.media_source)
         this.profile_selector = new ProfileSelector(this.downloader.bandwidth, metadata)
@@ -81,10 +87,10 @@ export class Player {
             this.tracks.value.push(new PlayerTrack(this, this.node_id, 0, metadata.tracks[0]))
             this.tracks.value.push(new PlayerTrack(this, this.node_id, 1, metadata.tracks[1]))
             this.tracks.change()
-            this.buffering_status.value = "Fetching initial segments..."
+            this.set_pers("Fetching initial segments...")
             this.update()
             await this.canplay.wait_for(true)
-            this.buffering_status.value = undefined
+            this.set_pers()
         })
     }
     async update(newt?: number) {
@@ -102,7 +108,7 @@ export class Player {
         this.video["seekToNextFrame"]()
     }
     async seek(p: number) {
-        this.buffering_status.value = "Buffering at target..."
+        this.set_pers("Buffering at target...")
         await this.update(p)
         this.video.currentTime = p
     }