several player fixes

5 files changed, 21 insertions, 16 deletions

diff --git a/ui/client-scripts/src/player/mod.ts b/ui/client-scripts/src/player/mod.ts
index 9b32c26..bb615dd 100644
--- a/ui/client-scripts/src/player/mod.ts
+++ b/ui/client-scripts/src/player/mod.ts
@@ -10,18 +10,16 @@ import { Logger } from "../jshelper/src/log.ts";
 import { Player } from "./player.ts";
 import { Popup } from "./popup.ts";
 import { Playersync, playersync_controls } from "./sync.ts"
-import { Chapter } from "./types_node.ts";
 import { FormatInfo, TrackKind } from "./types_stream.ts";
 
 globalThis.addEventListener("DOMContentLoaded", () => {
-    if (document.getElementById("player")) {
+    const video = document.getElementById("player");
+    if (video) {
         if (globalThis.location.search.search("nojsp") != -1) return
         if (!globalThis.MediaSource) return alert("Media Source Extension API required")
         const node_id = globalThis.location.pathname.split("/")[2];
-        document.getElementById("player")?.remove();
-        // document.getElementsByClassName("playerconf").item(0)?.remove()
         globalThis.dispatchEvent(new Event("navigationrequiresreload"))
-        document.getElementById("main")!.prepend(initialize_player(node_id))
+        document.getElementById("main")!.prepend(initialize_player(node_id, video as HTMLVideoElement))
     }
 })
 
@@ -50,10 +48,12 @@ function get_query_start_time() {
     return x
 }
 
-function initialize_player(node_id: string): HTMLElement {
+type Chapter = { time_start: number, time_end: number, labels: string[][] }
+
+function initialize_player(node_id: string, video: HTMLVideoElement): HTMLElement {
     const logger = new Logger<string>(s => e("p", s))
     const start_time = get_query_start_time() ?? 0 // TODO  get_continue_time(ndata.userdata.watched);
-    const player = new Player(`/n/${encodeURIComponent(node_id)}/stream`, `/n/${encodeURIComponent(node_id)}/poster`, start_time, logger)
+    const player = new Player(video, `/n/${node_id}/stream`, start_time, logger)
     const show_stats = new OVar(false);
     const idle_inhibit = new OVar(false)
     const sync_state = new OVar<Playersync | undefined>(undefined)
@@ -339,9 +339,9 @@ function send_player_progress(node_id: string, player: Player) {
             const start = nt < 1 * 60
             const end = nt > player.duration.value - 5 * 60
 
-            if (!start) fetch(`/n/${encodeURIComponent(node_id)}/progress?t=${nt}`, { method: "POST" })
+            // if (!start && !send_watched) fetch(`/n/${node_id}/progress?t=${nt}`, { method: "POST" })
             if (end && !sent_watched) {
-                fetch(`/n/${encodeURIComponent(node_id)}/watched?state=watched`, { method: "POST" })
+                // fetch(`/n/${node_id}/watched?state=watched`, { method: "POST" })
                 sent_watched = true;
             }
         }
diff --git a/ui/client-scripts/src/player/player.ts b/ui/client-scripts/src/player/player.ts
index 4f59f8a..ab0313f 100644
--- a/ui/client-scripts/src/player/player.ts
+++ b/ui/client-scripts/src/player/player.ts
@@ -4,7 +4,7 @@
     Copyright (C) 2026 metamuffin <metamuffin.org>
 */
 /// <reference lib="dom" />
-import { OVar, e } from "../jshelper/mod.ts";
+import { OVar } from "../jshelper/mod.ts";
 import { SegmentDownloader } from "./download.ts";
 import { PlayerTrack } from "./track/mod.ts";
 import { Logger } from "../jshelper/src/log.ts";
@@ -13,7 +13,6 @@ import { StreamInfo, TimeRange, TrackInfo } from "./types_stream.ts";
 
 export interface BufferRange extends TimeRange { status: "buffered" | "loading" | "queued" }
 export class Player {
-    public video = e("video")
     public media_source = new MediaSource();
     public streaminfo?: StreamInfo;
     public tracks?: TrackInfo[];
@@ -33,8 +32,7 @@ export class Player {
         if (s) this.cancel_buffering_pers = this.logger?.log_persistent(s)
     }
 
-    constructor(public base_url: string, poster: string, private start_time: number, public logger?: Logger<string>) {
-        this.video.poster = poster
+    constructor(public video: HTMLVideoElement, public base_url: string, private start_time: number, public logger?: Logger<string>) {
         this.volume.value = this.video.volume
         let skip_change = false;
         this.volume.onchange(v => {
diff --git a/ui/client-style/src/player.css b/ui/client-style/src/player.css
index 4998ca2..9ca1ec6 100644
--- a/ui/client-style/src/player.css
+++ b/ui/client-style/src/player.css
@@ -67,7 +67,8 @@ video::cue {
     background-color: transparent;
     /* TODO this is inefficient */
     /* print(", ".join([f"{x/19}em {y/19}em black" for x in range(-5,6) for y in range(-5,6) if x*x+y*y < 5*5])) */
-    text-shadow: 0em 0.1em black,
+    text-shadow:
+        0em 0.1em black,
         0.02079116908177593em 0.09781476007338058em black,
         0.040673664307580015em 0.0913545457642601em black,
         0.058778525229247314em 0.08090169943749476em black,
diff --git a/ui/src/components/node_page.rs b/ui/src/components/node_page.rs
index 26ab7f9..38d82ba 100644
--- a/ui/src/components/node_page.rs
+++ b/ui/src/components/node_page.rs
@@ -164,7 +164,9 @@ markup::define! {
     }
 
     Player<'a>(ri: &'a RenderInfo<'a>, nku: Object<'a>) {
-        video[id="player"] {}
+        @let node = nku.get(NKU_NODE).unwrap_or_default();
+        @let pics = node.get(NO_PICTURES).unwrap_or_default();
+        video[id="player", poster=pics.get(PICT_COVER).map(|p| u_image(p, 2048))] {}
     }
 
 }
diff --git a/ui/src/lib.rs b/ui/src/lib.rs
index 5b23ee2..63a2d07 100644
--- a/ui/src/lib.rs
+++ b/ui/src/lib.rs
@@ -36,7 +36,11 @@ pub fn render_view(ri: RenderInfo<'_>, view: Object<'_>) -> String {
         ri: &ri,
         main: View { ri: &ri, view },
         title: view.get(VIEW_TITLE).unwrap_or_default(),
-        class: "theme-purple",
+        class: if view.has(VIEW_PLAYER.0) {
+            "theme-purple player"
+        } else {
+            "theme-purple"
+        },
     }
     .to_string()
 }