diff options
Diffstat (limited to 'web/script')
| -rw-r--r-- | web/script/player/jhls.d.ts | 2 | ||||
| -rw-r--r-- | web/script/player/mediacaps.ts | 3 | ||||
| -rw-r--r-- | web/script/player/mod.ts | 15 | ||||
| -rw-r--r-- | web/script/player/player.ts | 16 | ||||
| -rw-r--r-- | web/script/player/popup.ts | 7 |
5 files changed, 29 insertions, 14 deletions
diff --git a/web/script/player/jhls.d.ts b/web/script/player/jhls.d.ts index a8fc3ac..b38f1b1 100644 --- a/web/script/player/jhls.d.ts +++ b/web/script/player/jhls.d.ts @@ -26,7 +26,7 @@ export interface SourceTrackKind { sample_rate: number, bit_depth: number, }, - subtitles?: boolean, + subtitles?: boolean, // incorrect but lazy rn } export interface EncodingProfile { video?: { diff --git a/web/script/player/mediacaps.ts b/web/script/player/mediacaps.ts index 33682be..607f4b2 100644 --- a/web/script/player/mediacaps.ts +++ b/web/script/player/mediacaps.ts @@ -100,6 +100,7 @@ export type TrackKind = "audio" | "video" | "subtitles" export function get_track_kind(track: SourceTrackKind): TrackKind { if (track.audio) return "audio" if (track.video) return "video" - if (track.subtitles) return "subtitles" + //@ts-ignore // TODO clean this mess up please + if (track == "subtitles") return "subtitles" throw new Error("invalid track"); } diff --git a/web/script/player/mod.ts b/web/script/player/mod.ts index 11690b6..4e4a4cc 100644 --- a/web/script/player/mod.ts +++ b/web/script/player/mod.ts @@ -7,7 +7,7 @@ import { OVar, show } from "../jshelper/mod.ts"; import { e } from "../jshelper/mod.ts"; import { Logger } from "../jshelper/src/log.ts"; import { EncodingProfile } from "./jhls.d.ts"; -import { TrackKind } from "./mediacaps.ts"; +import { TrackKind, get_track_kind } from "./mediacaps.ts"; import { Player } from "./player.ts"; import { Popup } from "./popup.ts"; @@ -53,7 +53,14 @@ function initialize_player(el: HTMLElement, node_id: string) { } }) new Popup(button, popups, () => - e("div", { class: "jsp-track-select-popup" }, "This is some text") + e("div", { class: "jsp-track-select-popup" }, + ...(player.tracks ?? []) + .filter(t => get_track_kind(t.info.kind) == kind) + .map(t => e("div", + e("span", { class: "jsp-track-name" }, t.info.name), " ", + e("span", { class: "jsp-track-lang" }, t.info.language) + )) + ) ) return button } @@ -68,7 +75,7 @@ function initialize_player(el: HTMLElement, node_id: string) { ), pri = e("div", { class: "jsp-pri" }, pri_current = e("div", { class: "jsp-pri-current" }), - player.tracks.map( + player.active_tracks.map( tracks => e("div", ...tracks.map((t, i) => t.buffered.map( ranges => e("div", ...ranges.map( r => e("div", { @@ -101,7 +108,7 @@ function initialize_player(el: HTMLElement, node_id: string) { const pel = e("div", { class: "jsp" }, player.video, - show_stats.map(do_show => e("div", player.tracks.map(tracks => + show_stats.map(do_show => e("div", player.active_tracks.map(tracks => !do_show ? e("div") : e("div", { class: "jsp-stats" }, player.downloader.bandwidth.map(b => e("pre", `estimated bandwidth: ${show.metric(b, "B/s")} | ${show.metric(b * 8, "b/s")}`)), ...tracks.map((t, i) => t.profile.map(p => diff --git a/web/script/player/player.ts b/web/script/player/player.ts index 81a315e..9151a2a 100644 --- a/web/script/player/player.ts +++ b/web/script/player/player.ts @@ -1,5 +1,5 @@ import { OVar, e } from "../jshelper/mod.ts"; -import { JhlsMetadata, TimeRange } from "./jhls.d.ts"; +import { JhlsMetadata, JhlsTrack, TimeRange } from "./jhls.d.ts"; import { SegmentDownloader } from "./download.ts"; import { PlayerTrack } from "./track.ts"; import { ProfileSelector } from "./profiles.ts"; @@ -9,7 +9,8 @@ export interface BufferRange extends TimeRange { status: "buffered" | "loading" export class Player { public video = e("video") public media_source = new MediaSource(); - public tracks = new OVar<PlayerTrack[]>([]); + public tracks?: JhlsTrack[]; + public active_tracks = new OVar<PlayerTrack[]>([]); public downloader: SegmentDownloader = new SegmentDownloader(); public profile_selector!: ProfileSelector @@ -79,6 +80,7 @@ export class Player { if (!res.ok) return this.error.value = "Cannot download JHLS metadata" const metadata = await res.json() as JhlsMetadata this.set_pers() + this.tracks = metadata.tracks this.profile_selector = new ProfileSelector(this, this.downloader.bandwidth, metadata) this.set_pers("Checking codec support...") @@ -88,17 +90,17 @@ export class Player { this.video.src = URL.createObjectURL(this.media_source) this.media_source.addEventListener("sourceopen", async () => { this.set_pers("Initializing Media Extensions...") - this.tracks.value.push(await PlayerTrack.new(this, this.node_id, 0, metadata.tracks[0])) - this.tracks.value.push(await PlayerTrack.new(this, this.node_id, 1, metadata.tracks[1])) - this.tracks.change() - this.set_pers("Fetching initial segments...") + this.active_tracks.value.push(await PlayerTrack.new(this, this.node_id, 0, metadata.tracks[0])) + this.active_tracks.value.push(await PlayerTrack.new(this, this.node_id, 1, metadata.tracks[1])) + this.active_tracks.change() + this.set_pers("Downloading initial segments...") this.update() await this.canplay.wait_for(true) this.set_pers() }) } async update(newt?: number) { - await Promise.all(this.tracks.value.map(t => t.update(newt ?? this.video.currentTime))) + await Promise.all(this.active_tracks.value.map(t => t.update(newt ?? this.video.currentTime))) } play() { diff --git a/web/script/player/popup.ts b/web/script/player/popup.ts index fb596b0..39b5b0f 100644 --- a/web/script/player/popup.ts +++ b/web/script/player/popup.ts @@ -32,9 +32,14 @@ export class Popup { this.content_hov = false; this.update_hov() }) + this.content.classList.add("jsp-popup") this.container.append(this.content) } else { - this.container.removeChild(this.content!) + const content = this.content! + content.classList.add("jsp-popup-out") + setTimeout(() => { + this.container.removeChild(content) + }, 100) this.content = undefined } this.shown = s |