Kieran/zap.stream
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Set src directly when HLS not supported

Browse Source
This commit is contained in:
Kieran
2023-07-04 19:02:19 +01:00
parent 6e90e79ad9
commit cf19bb2f1e
1 changed files with 34 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
src/element/live-video-player.tsx
View File

@ -13,43 +13,54 @@ export function LiveVideoPlayer(
const video = useRef<HTMLVideoElement>(null); const video = useRef<HTMLVideoElement>(null);
const streamCached = useMemo(() => props.stream, [props.stream]); const streamCached = useMemo(() => props.stream, [props.stream]);
const [status, setStatus] = useState<VideoStatus>(); const [status, setStatus] = useState<VideoStatus>();
const [src, setSrc] = useState(props.src);
useEffect(() => { useEffect(() => {
if ( if (
streamCached && streamCached &&
video.current && video.current &&
!video.current.src && !video.current.src
Hls.isSupported()
) { ) {
try { if (Hls.isSupported()) {
const hls = new Hls(); try {
hls.loadSource(streamCached); const hls = new Hls();
hls.attachMedia(video.current); hls.loadSource(streamCached);
hls.on(Hls.Events.ERROR, (event, data) => { hls.attachMedia(video.current);
console.debug(event, data); hls.on(Hls.Events.ERROR, (event, data) => {
const errorType = data.type; console.debug(event, data);
if (errorType === Hls.ErrorTypes.NETWORK_ERROR && data.fatal) { const errorType = data.type;
hls.stopLoad(); if (errorType === Hls.ErrorTypes.NETWORK_ERROR && data.fatal) {
hls.detachMedia(); hls.stopLoad();
setStatus(VideoStatus.Offline); hls.detachMedia();
} setStatus(VideoStatus.Offline);
}); }
hls.on(Hls.Events.MANIFEST_PARSED, () => { });
setStatus(VideoStatus.Online); hls.on(Hls.Events.MANIFEST_PARSED, () => {
}); setStatus(VideoStatus.Online);
return () => hls.destroy(); });
} catch (e) { return () => hls.destroy();
console.error(e); } catch (e) {
setStatus(VideoStatus.Offline); console.error(e);
setStatus(VideoStatus.Offline);
}
} else {
setSrc(streamCached);
setStatus(VideoStatus.Online);
video.current.muted = true;
video.current.load();
} }
} }
}, [video, streamCached]); }, [video, streamCached]);
return ( return (
<> <>
<div className={status}> <div className={status}>
<div>{status}</div> <div>{status}</div>
</div> </div>
<video ref={video} {...props} controls={status === VideoStatus.Online} /> <video ref={video} {...{
...props,
stream: undefined
}} src={src} controls={status === VideoStatus.Online} />
</> </>
); );
} }