From aa7aca882302f1e1e8f0a0ca5183e25ee0a74b03 Mon Sep 17 00:00:00 2001 From: kieran Date: Tue, 19 Nov 2024 17:15:36 +0000 Subject: [PATCH] chore: Update translations --- src/element/stream/live-video-player.tsx | 8 +- src/element/stream/n94-player.tsx | 261 ++++++++++++----------- src/hooks/useLiveStreams.ts | 4 +- src/pages/stream-page.tsx | 5 +- src/utils.ts | 2 +- 5 files changed, 144 insertions(+), 136 deletions(-) diff --git a/src/element/stream/live-video-player.tsx b/src/element/stream/live-video-player.tsx index 11b6c03..eb49133 100644 --- a/src/element/stream/live-video-player.tsx +++ b/src/element/stream/live-video-player.tsx @@ -35,10 +35,12 @@ type VideoPlayerProps = { export default function LiveVideoPlayer({ title, stream, status, poster, link, ...props }: VideoPlayerProps) { function innerPlayer() { if (stream === "nip94") { - return + return ; } - {/* @ts-ignore Web Componenet */ } - return + { + /* @ts-ignore Web Componenet */ + } + return ; } return ( = new Map(); - #status: LoaderStatus = LoaderStatus.kIdle; - #bytes = 0; + #system!: SystemInterface; + #query?: QueryLike; + #mediaChunks: Map = new Map(); + #status: LoaderStatus = LoaderStatus.kIdle; + #bytes = 0; - constructor(_seekHandler: mpegts.SeekHandler, config: mpegts.Config) { - if ("system" in config) { - this.#system = config.system as SystemInterface; - } else { - throw "Invalid config, missing system" - } + constructor(_seekHandler: mpegts.SeekHandler, config: mpegts.Config) { + if ("system" in config) { + this.#system = config.system as SystemInterface; + } else { + throw "Invalid config, missing system"; + } + } + + // @ts-expect-error + onContentLengthKnown: (contentLength: number) => void; + // @ts-expect-error + onURLRedirect: (redirectedURL: string) => void; + // @ts-expect-error + onDataArrival: (chunk: ArrayBuffer, byteStart: number, receivedLength?: number | undefined) => void; + // @ts-expect-error + onError: (errorType: mpegts.LoaderErrors, errorInfo: mpegts.LoaderErrorMessage) => void; + // @ts-expect-error + onComplete: (rangeFrom: number, rangeTo: number) => void; + + get _status() { + return this.#status; + } + get status() { + return this.#status; + } + + destroy(): void { + throw new Error("Method not implemented."); + } + + isWorking(): boolean { + throw new Error("Method not implemented."); + } + + type = "nip94"; + get needStashBuffer() { + return false; + } + get _needStash() { + return this.needStashBuffer; + } + + open(dataSource: mpegts.MediaSegment, range: mpegts.Range) { + const link = parseNostrLink(dataSource.url); + if (!link) { + throw new Error("Datasource.url is invalid"); } - // @ts-expect-error - onContentLengthKnown: (contentLength: number) => void; - // @ts-expect-error - onURLRedirect: (redirectedURL: string) => void; - // @ts-expect-error - onDataArrival: (chunk: ArrayBuffer, byteStart: number, receivedLength?: number | undefined) => void; - // @ts-expect-error - onError: (errorType: mpegts.LoaderErrors, errorInfo: mpegts.LoaderErrorMessage) => void; - // @ts-expect-error - onComplete: (rangeFrom: number, rangeTo: number) => void; + const rb = new RequestBuilder(`n94-stream-${link.encode()}`); + rb.withOptions({ + leaveOpen: true, + }); + rb.withFilter().replyToLink([link]).kinds([EventKind.FileHeader]); - get _status() { return this.#status } - get status() { return this.#status } + this.#status = LoaderStatus.kConnecting; + this.#query = this.#system.Query(rb); + this.#query.on("event", evs => { + for (const ev of evs) { + const seg = { + created: ev.created_at, + url: findTag(ev, "url")!, + sha256: findTag(ev, "x")!, + } as MediaSegment; + this.#addSegment(seg); + } + this.#loadNext(); + }); + } - destroy(): void { - throw new Error("Method not implemented."); + abort() { + this.#query?.cancel(); + } + + #addSegment(seg: MediaSegment) { + if (!this.#mediaChunks.has(seg.sha256)) { + this.#mediaChunks.set(seg.sha256, seg); } + } - isWorking(): boolean { - throw new Error("Method not implemented."); + async #loadNext() { + if (this.#status === LoaderStatus.kConnecting || this.#status === LoaderStatus.kIdle) { + this.#status = LoaderStatus.kBuffering; } - - type = "nip94" - get needStashBuffer() { - return false; + if (this.#status !== LoaderStatus.kBuffering) { + return; } - get _needStash() { return this.needStashBuffer } + const orderedLoad = [...this.#mediaChunks.values()].sort((a, b) => a.created - b.created).filter(a => !a.loaded); + for (const s of orderedLoad) { + const result = await fetch(s.url); + const buf = await result.arrayBuffer(); - open(dataSource: mpegts.MediaSegment, range: mpegts.Range) { - const link = parseNostrLink(dataSource.url); - if (!link) { - throw new Error("Datasource.url is invalid") - } + this.onDataArrival(buf, this.#bytes, buf.byteLength); + console.debug("pushing bytes", this.#bytes, buf.byteLength); + this.#bytes += buf.byteLength; - const rb = new RequestBuilder(`n94-stream-${link.encode()}`); - rb.withOptions({ - leaveOpen: true, - }); - rb.withFilter() - .replyToLink([link]) - .kinds([EventKind.FileHeader]); - - this.#status = LoaderStatus.kConnecting; - this.#query = this.#system.Query(rb); - this.#query.on("event", (evs) => { - for (const ev of evs) { - const seg = { - created: ev.created_at, - url: findTag(ev, "url")!, - sha256: findTag(ev, "x")!, - } as MediaSegment; - this.#addSegment(seg); - } - this.#loadNext(); - }); - } - - abort() { - this.#query?.cancel(); - } - - #addSegment(seg: MediaSegment) { - if (!this.#mediaChunks.has(seg.sha256)) { - this.#mediaChunks.set(seg.sha256, seg); - } - } - - async #loadNext() { - if (this.#status === LoaderStatus.kConnecting || this.#status === LoaderStatus.kIdle) { - this.#status = LoaderStatus.kBuffering; - } - if (this.#status !== LoaderStatus.kBuffering) { - return; - } - const orderedLoad = [...this.#mediaChunks.values()].sort((a, b) => a.created - b.created).filter(a => !a.loaded); - for (const s of orderedLoad) { - const result = await fetch(s.url); - const buf = await result.arrayBuffer(); - - this.onDataArrival(buf, this.#bytes, buf.byteLength); - console.debug("pushing bytes", this.#bytes, buf.byteLength); - this.#bytes += buf.byteLength; - - this.#mediaChunks.set(s.sha256, { - ...s, - loaded: true - }); - } - this.#status = LoaderStatus.kIdle; + this.#mediaChunks.set(s.sha256, { + ...s, + loaded: true, + }); } + this.#status = LoaderStatus.kIdle; + } } export default function Nip94Player({ link }: { link: NostrLink }) { - const ref = useRef(null); - const system = useContext(SnortContext); + const ref = useRef(null); + const system = useContext(SnortContext); - useEffect(() => { - if (ref.current) { - const player = ref.current as HTMLVideoElement & { - __streamer?: mpegts.Player - }; + useEffect(() => { + if (ref.current) { + const player = ref.current as HTMLVideoElement & { + __streamer?: mpegts.Player; + }; - if (!player.__streamer) { - player.__streamer = new mpegts.MSEPlayer({ - type: "mse", - isLive: true, - url: link.encode() - }, { - system, - customLoader: Nip94Loader - } as unknown as mpegts.Config); + if (!player.__streamer) { + player.__streamer = new mpegts.MSEPlayer( + { + type: "mse", + isLive: true, + url: link.encode(), + }, + { + system, + customLoader: Nip94Loader, + } as unknown as mpegts.Config, + ); - player.__streamer.attachMediaElement(player); - player.__streamer.load(); - player.__streamer.play(); - } - } - }, [ref]); + player.__streamer.attachMediaElement(player); + player.__streamer.load(); + player.__streamer.play(); + } + } + }, [ref]); - return -} \ No newline at end of file + return ; +} diff --git a/src/hooks/useLiveStreams.ts b/src/hooks/useLiveStreams.ts index 08b6f8a..b37558a 100644 --- a/src/hooks/useLiveStreams.ts +++ b/src/hooks/useLiveStreams.ts @@ -36,9 +36,7 @@ export function useSortedStreams(feed: Array, oldest?: number) const live = feedSorted .filter(a => { try { - return ( - findTag(a, "status") === StreamState.Live && canPlayEvent(a) - ); + return findTag(a, "status") === StreamState.Live && canPlayEvent(a); } catch { return false; } diff --git a/src/pages/stream-page.tsx b/src/pages/stream-page.tsx index b6abfce..b19617a 100644 --- a/src/pages/stream-page.tsx +++ b/src/pages/stream-page.tsx @@ -56,7 +56,7 @@ export function StreamPage({ link, evPreload }: { evPreload?: TaggedNostrEvent;
- {ev?.kind === LIVE_STREAM && + {ev?.kind === LIVE_STREAM && ( } + /> + )}
diff --git a/src/utils.ts b/src/utils.ts index 29c2bd3..16f0b6e 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -115,7 +115,7 @@ export interface StreamInfo { host?: string; gameId?: string; gameInfo?: GameInfo; - streams: Array + streams: Array; } const gameTagFormat = /^[a-z-]+:[a-z0-9-]+$/i;