">import { CaptionsRenderer } from 'react-srv3';

<CaptionsRenderer
srv3=" // SRV3 XML string
currentTime={0} // Current video time in seconds
/>

{ const [currentTime, setCurrentTime] = React.useState(0); const [captionsText, setCaptionsText] = React.useState(''); React.useEffect(() => { fetch('') .then(res => res.text()) .then(setCaptionsText) }, []); return (

) }">import React from 'react';
import { CaptionsRenderer } from 'react-srv3';

const VideoPlayer = () => {
const [currentTime, setCurrentTime] = React.useState(0);
const [captionsText, setCaptionsText] = React.useState('');

React.useEffect(() => {
fetch('')
.then(res => res.text())
.then(setCaptionsText)
}, []);

return (
<div style={{ position: 'relative', width: 640, height: 360 }}>
<video
src="video.mp4"
style={{ position: 'absolute', width: '100%', height: '100%' }}
onTimeUpdate={(e) => setCurrentTime(e.target.currentTime)}
/>
<CaptionsRenderer srv3={captionsText} currentTime={currentTime} />
div>
)
}