Show video poster

This commit is contained in:
Kieran 2023-06-22 19:27:50 +01:00
parent 870cdbc2f4
commit b4f18ba230
Signed by: Kieran
GPG Key ID: DE71CEB3925BE941
2 changed files with 10 additions and 1 deletions

View File

@ -10,6 +10,14 @@ export function LiveVideoPlayer(props: HTMLProps<HTMLVideoElement> & { stream?:
const hls = new Hls(); const hls = new Hls();
hls.loadSource(streamCached); hls.loadSource(streamCached);
hls.attachMedia(video.current); hls.attachMedia(video.current);
hls.on(Hls.Events.ERROR, (event, data) => {
console.debug(event, data);
const errorType = data.type;
if(errorType === Hls.ErrorTypes.NETWORK_ERROR) {
hls.stopLoad();
hls.detachMedia();
}
})
return () => hls.destroy(); return () => hls.destroy();
} }
}, [video, streamCached]); }, [video, streamCached]);

View File

@ -29,6 +29,7 @@ export function StreamPage() {
const stream = findTag(thisEvent.data, "streaming"); const stream = findTag(thisEvent.data, "streaming");
const status = findTag(thisEvent.data, "status"); const status = findTag(thisEvent.data, "status");
const image = findTag(thisEvent.data, "image");
const isLive = status === "live"; const isLive = status === "live";
const isMine = link.author === login?.pubkey; const isMine = link.author === login?.pubkey;
const zapTarget = profile?.lud16 ?? profile?.lud06; const zapTarget = profile?.lud16 ?? profile?.lud06;
@ -46,7 +47,7 @@ export function StreamPage() {
return ( return (
<div className="live-page"> <div className="live-page">
<div> <div>
<LiveVideoPlayer stream={stream} autoPlay={true} /> <LiveVideoPlayer stream={stream} autoPlay={true} poster={image} />
<div className="flex info"> <div className="flex info">
<div className="f-grow"> <div className="f-grow">
<h1>{findTag(thisEvent.data, "title")}</h1> <h1>{findTag(thisEvent.data, "title")}</h1>