mirror of
https://github.com/blakeblackshear/frigate.git
synced 2024-11-21 19:07:46 +01:00
Cleanup (#10846)
* Hide motion playback controls during scrubbing * Fix portrait recordings on mobile * Don't apply to desktop
This commit is contained in:
parent
fb7cfe5471
commit
2318e79502
@ -92,7 +92,7 @@ export default function HlsVideoPlayer({
|
|||||||
return (
|
return (
|
||||||
<TransformWrapper minScale={1.0}>
|
<TransformWrapper minScale={1.0}>
|
||||||
<div
|
<div
|
||||||
className={`relative w-full ${className ?? ""} ${visible ? "visible" : "hidden"}`}
|
className={`relative ${className ?? ""} ${visible ? "visible" : "hidden"}`}
|
||||||
onMouseOver={
|
onMouseOver={
|
||||||
isDesktop
|
isDesktop
|
||||||
? () => {
|
? () => {
|
||||||
@ -112,9 +112,11 @@ export default function HlsVideoPlayer({
|
|||||||
<TransformComponent
|
<TransformComponent
|
||||||
wrapperStyle={{
|
wrapperStyle={{
|
||||||
width: "100%",
|
width: "100%",
|
||||||
|
height: "100%",
|
||||||
}}
|
}}
|
||||||
contentStyle={{
|
contentStyle={{
|
||||||
width: "100%",
|
width: "100%",
|
||||||
|
height: isMobile ? "100%" : undefined,
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<video
|
<video
|
||||||
|
@ -898,35 +898,37 @@ function MotionReview({
|
|||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<VideoControls
|
{!scrubbing && (
|
||||||
className="absolute bottom-16 left-1/2 -translate-x-1/2"
|
<VideoControls
|
||||||
features={{
|
className="absolute bottom-16 left-1/2 -translate-x-1/2"
|
||||||
volume: false,
|
features={{
|
||||||
seek: true,
|
volume: false,
|
||||||
playbackRate: true,
|
seek: true,
|
||||||
}}
|
playbackRate: true,
|
||||||
isPlaying={playing}
|
}}
|
||||||
playbackRates={[4, 8, 12, 16]}
|
isPlaying={playing}
|
||||||
playbackRate={playbackRate}
|
playbackRates={[4, 8, 12, 16]}
|
||||||
controlsOpen={controlsOpen}
|
playbackRate={playbackRate}
|
||||||
setControlsOpen={setControlsOpen}
|
controlsOpen={controlsOpen}
|
||||||
onPlayPause={setPlaying}
|
setControlsOpen={setControlsOpen}
|
||||||
onSeek={(diff) => {
|
onPlayPause={setPlaying}
|
||||||
const wasPlaying = playing;
|
onSeek={(diff) => {
|
||||||
|
const wasPlaying = playing;
|
||||||
|
|
||||||
if (wasPlaying) {
|
if (wasPlaying) {
|
||||||
setPlaying(false);
|
setPlaying(false);
|
||||||
}
|
}
|
||||||
|
|
||||||
setCurrentTime(currentTime + diff);
|
setCurrentTime(currentTime + diff);
|
||||||
|
|
||||||
if (wasPlaying) {
|
if (wasPlaying) {
|
||||||
setTimeout(() => setPlaying(true), 100);
|
setTimeout(() => setPlaying(true), 100);
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
onSetPlaybackRate={setPlaybackRate}
|
onSetPlaybackRate={setPlaybackRate}
|
||||||
show={currentTime < timeRange.before - 4}
|
show={currentTime < timeRange.before - 4}
|
||||||
/>
|
/>
|
||||||
|
)}
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user