administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-02-11 05:35:25 +03:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

reduce preview thumbnail props

Browse Source
This commit is contained in:
Nicolas Mowen 2024-04-10 19:24:30 -06:00
parent a9898ec639
commit 6369405aa9
1 changed files with 12 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
web/src/components/player/PreviewThumbnailPlayer.tsx
View File

@ -74,7 +74,7 @@ export default function PreviewThumbnailPlayer({
}); });
const handleSetReviewed = useCallback(() => { const handleSetReviewed = useCallback(() => {
if (review.end_time) { if (review.end_time && !review.has_been_reviewed) {
review.has_been_reviewed = true; review.has_been_reviewed = true;
setReviewed(review); setReviewed(review);
} }
@ -304,8 +304,9 @@ function PreviewContent({
if (relevantPreview) { if (relevantPreview) {
return ( return (
<VideoPreview <VideoPreview
review={review}
relevantPreview={relevantPreview} relevantPreview={relevantPreview}
startTime={review.start_time}
endTime={review.end_time}
setReviewed={setReviewed} setReviewed={setReviewed}
setIgnoreClick={setIgnoreClick} setIgnoreClick={setIgnoreClick}
isPlayingBack={isPlayingBack} isPlayingBack={isPlayingBack}
@ -328,16 +329,18 @@ function PreviewContent({
const PREVIEW_PADDING = 16; const PREVIEW_PADDING = 16;
type VideoPreviewProps = { type VideoPreviewProps = {
review: ReviewSegment;
relevantPreview: Preview; relevantPreview: Preview;
startTime: number;
endTime?: number;
setReviewed: () => void; setReviewed: () => void;
setIgnoreClick: (ignore: boolean) => void; setIgnoreClick: (ignore: boolean) => void;
isPlayingBack: (ended: boolean) => void; isPlayingBack: (ended: boolean) => void;
onTimeUpdate?: (time: number | undefined) => void; onTimeUpdate?: (time: number | undefined) => void;
}; };
function VideoPreview({ function VideoPreview({
review,
relevantPreview, relevantPreview,
startTime,
endTime,
setReviewed, setReviewed,
setIgnoreClick, setIgnoreClick,
isPlayingBack, isPlayingBack,
@ -356,19 +359,13 @@ function VideoPreview({
} }
// start with a bit of padding // start with a bit of padding
return Math.max( return Math.max(0, startTime - relevantPreview.start - PREVIEW_PADDING);
0,
review.start_time - relevantPreview.start - PREVIEW_PADDING,
);
// we know that these deps are correct // we know that these deps are correct
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
}, []); }, []);
const playerDuration = useMemo( const playerDuration = useMemo(
() => () => (endTime ?? relevantPreview.end) - startTime + PREVIEW_PADDING,
(review.end_time ?? relevantPreview.end) -
review.start_time +
PREVIEW_PADDING,
// we know that these deps are correct // we know that these deps are correct
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
[], [],
@ -409,21 +406,14 @@ function VideoPreview({
// end with a bit of padding // end with a bit of padding
const playerPercent = (playerProgress / playerDuration) * 100; const playerPercent = (playerProgress / playerDuration) * 100;
if ( if (setReviewed && lastPercent < 50 && playerPercent > 50) {
setReviewed &&
!review.has_been_reviewed &&
lastPercent < 50 &&
playerPercent > 50
) {
setReviewed(); setReviewed();
} }
setLastPercent(playerPercent); setLastPercent(playerPercent);
if (playerPercent > 100) { if (playerPercent > 100) {
if (!review.has_been_reviewed) {
setReviewed(); setReviewed();
}
if (isMobile) { if (isMobile) {
isPlayingBack(false); isPlayingBack(false);
@ -488,7 +478,7 @@ function VideoPreview({
setIgnoreClick(true); setIgnoreClick(true);
} }
if (setReviewed && !review.has_been_reviewed) { if (setReviewed) {
setReviewed(); setReviewed();
} }