|
|
|
@ -7,7 +7,12 @@ import unique_ident from "@/hooks/unique_ident"; |
|
|
|
|
const deviation: number = 1 |
|
|
|
|
|
|
|
|
|
const HVideo: FC<HVideoOptions> = (opt: HVideoOptions) => { |
|
|
|
|
const video = Taro.createVideoContext('myVideo') |
|
|
|
|
let video |
|
|
|
|
try { |
|
|
|
|
video = Taro.createVideoContext('myVideo') |
|
|
|
|
} catch (e) { |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
const [currentTime, setCurrentTime] = useState(0) |
|
|
|
|
|
|
|
|
|
function onTimeUpdate(event: BaseEventOrig<VideoProps.onTimeUpdateEventDetail>) { |
|
|
|
@ -15,7 +20,7 @@ const HVideo: FC<HVideoOptions> = (opt: HVideoOptions) => { |
|
|
|
|
const time = event.detail.currentTime |
|
|
|
|
/** 前进回退 */ |
|
|
|
|
if (currentTime + deviation < time) { |
|
|
|
|
video.seek(currentTime) |
|
|
|
|
video?.seek(currentTime) |
|
|
|
|
return |
|
|
|
|
} |
|
|
|
|
setCurrentTime(time) |
|
|
|
@ -23,9 +28,9 @@ const HVideo: FC<HVideoOptions> = (opt: HVideoOptions) => { |
|
|
|
|
/** 判断是否进入断点 */ |
|
|
|
|
opt.breakpoint.forEach(d => { |
|
|
|
|
if (time < d + deviation && time > d - deviation) { |
|
|
|
|
video.exitFullScreen() |
|
|
|
|
video.pause() |
|
|
|
|
video.seek(d - deviation) |
|
|
|
|
video?.exitFullScreen() |
|
|
|
|
video?.pause() |
|
|
|
|
video?.seek(d - deviation) |
|
|
|
|
opt.onBreakpoint(d) |
|
|
|
|
return |
|
|
|
|
} |
|
|
|
@ -33,8 +38,8 @@ const HVideo: FC<HVideoOptions> = (opt: HVideoOptions) => { |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
opt.setTime((time: number) => { |
|
|
|
|
video.seek(time) |
|
|
|
|
video.play() |
|
|
|
|
video?.seek(time) |
|
|
|
|
video?.play() |
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
function onEnded() { |
|
|
|
@ -42,28 +47,29 @@ const HVideo: FC<HVideoOptions> = (opt: HVideoOptions) => { |
|
|
|
|
if (currentTime + 1 > opt.duration) { |
|
|
|
|
opt.onEnded() |
|
|
|
|
} else { |
|
|
|
|
video.seek(currentTime) |
|
|
|
|
video.play() |
|
|
|
|
video?.seek(currentTime) |
|
|
|
|
video?.play() |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
Taro.useUnload(() => { |
|
|
|
|
video?.stop() |
|
|
|
|
unique_ident.put(Number(currentTime.toFixed(2)), Date.now()) |
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
|
<Video |
|
|
|
|
id={'myVideo'} |
|
|
|
|
autoplay |
|
|
|
|
style={{width: '100%', height: '100%', position: "relative"}} |
|
|
|
|
poster={opt?.poster || ''} |
|
|
|
|
src={opt.src} |
|
|
|
|
enableProgressGesture={false} |
|
|
|
|
direction={90} |
|
|
|
|
onTimeUpdate={onTimeUpdate} |
|
|
|
|
onEnded={onEnded} |
|
|
|
|
/> |
|
|
|
|
<Video |
|
|
|
|
id={'myVideo'} |
|
|
|
|
autoplay |
|
|
|
|
style={{width: '100%', height: '100%', position: "relative"}} |
|
|
|
|
poster={opt?.poster || ''} |
|
|
|
|
src={opt.src} |
|
|
|
|
enableProgressGesture={false} |
|
|
|
|
direction={90} |
|
|
|
|
onTimeUpdate={onTimeUpdate} |
|
|
|
|
onEnded={onEnded} |
|
|
|
|
/> |
|
|
|
|
) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|