use single lookup for motion data (#10778)

This commit is contained in:
Josh Hawkins 2024-04-01 10:57:35 -05:00 committed by GitHub
parent 52f65a4dc4
commit 99878d9eee
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 21 additions and 29 deletions

View File

@ -90,9 +90,13 @@ export function MotionReviewTimeline({
const motionStart = segmentTime; const motionStart = segmentTime;
const motionEnd = motionStart + segmentDuration; const motionEnd = motionStart + segmentDuration;
const firstHalfMotionValue = getMotionSegmentValue(motionStart);
const secondHalfMotionValue = getMotionSegmentValue(
motionStart + segmentDuration / 2,
);
const segmentMotion = const segmentMotion =
getMotionSegmentValue(motionStart) > 0 || firstHalfMotionValue > 0 || secondHalfMotionValue > 0;
getMotionSegmentValue(motionStart + segmentDuration / 2) > 0;
const overlappingReviewItems = events.some( const overlappingReviewItems = events.some(
(item) => (item) =>
(item.start_time >= motionStart && item.start_time < motionEnd) || (item.start_time >= motionStart && item.start_time < motionEnd) ||
@ -110,7 +114,8 @@ export function MotionReviewTimeline({
<MotionSegment <MotionSegment
key={segmentTime} key={segmentTime}
events={events} events={events}
motion_events={motion_events} firstHalfMotionValue={firstHalfMotionValue}
secondHalfMotionValue={secondHalfMotionValue}
segmentDuration={segmentDuration} segmentDuration={segmentDuration}
segmentTime={segmentTime} segmentTime={segmentTime}
timestampSpread={timestampSpread} timestampSpread={timestampSpread}

View File

@ -1,6 +1,6 @@
import { useTimelineUtils } from "@/hooks/use-timeline-utils"; import { useTimelineUtils } from "@/hooks/use-timeline-utils";
import { useEventSegmentUtils } from "@/hooks/use-event-segment-utils"; import { useEventSegmentUtils } from "@/hooks/use-event-segment-utils";
import { MotionData, ReviewSegment } from "@/types/review"; import { ReviewSegment } from "@/types/review";
import React, { useCallback, useEffect, useMemo, useRef } from "react"; import React, { useCallback, useEffect, useMemo, useRef } from "react";
import scrollIntoView from "scroll-into-view-if-needed"; import scrollIntoView from "scroll-into-view-if-needed";
import { MinimapBounds, Tick, Timestamp } from "./segment-metadata"; import { MinimapBounds, Tick, Timestamp } from "./segment-metadata";
@ -10,10 +10,11 @@ import useTapUtils from "@/hooks/use-tap-utils";
type MotionSegmentProps = { type MotionSegmentProps = {
events: ReviewSegment[]; events: ReviewSegment[];
motion_events: MotionData[];
segmentTime: number; segmentTime: number;
segmentDuration: number; segmentDuration: number;
timestampSpread: number; timestampSpread: number;
firstHalfMotionValue: number;
secondHalfMotionValue: number;
motionOnly: boolean; motionOnly: boolean;
showMinimap: boolean; showMinimap: boolean;
minimapStartTime?: number; minimapStartTime?: number;
@ -24,10 +25,11 @@ type MotionSegmentProps = {
export function MotionSegment({ export function MotionSegment({
events, events,
motion_events,
segmentTime, segmentTime,
segmentDuration, segmentDuration,
timestampSpread, timestampSpread,
firstHalfMotionValue,
secondHalfMotionValue,
motionOnly, motionOnly,
showMinimap, showMinimap,
minimapStartTime, minimapStartTime,
@ -43,8 +45,10 @@ export function MotionSegment({
shouldShowRoundedCorners, shouldShowRoundedCorners,
} = useEventSegmentUtils(segmentDuration, events, severityType); } = useEventSegmentUtils(segmentDuration, events, severityType);
const { getMotionSegmentValue, interpolateMotionAudioData } = const { interpolateMotionAudioData } = useMotionSegmentUtils(
useMotionSegmentUtils(segmentDuration, motion_events); segmentDuration,
[],
);
const { alignStartDateToTimeline, alignEndDateToTimeline } = useTimelineUtils( const { alignStartDateToTimeline, alignEndDateToTimeline } = useTimelineUtils(
{ segmentDuration }, { segmentDuration },
@ -77,29 +81,12 @@ export function MotionSegment({
}, []); }, []);
const firstHalfSegmentWidth = useMemo(() => { const firstHalfSegmentWidth = useMemo(() => {
return interpolateMotionAudioData( return interpolateMotionAudioData(firstHalfMotionValue, maxSegmentWidth);
getMotionSegmentValue(segmentTime), }, [maxSegmentWidth, firstHalfMotionValue, interpolateMotionAudioData]);
maxSegmentWidth,
);
}, [
segmentTime,
maxSegmentWidth,
getMotionSegmentValue,
interpolateMotionAudioData,
]);
const secondHalfSegmentWidth = useMemo(() => { const secondHalfSegmentWidth = useMemo(() => {
return interpolateMotionAudioData( return interpolateMotionAudioData(secondHalfMotionValue, maxSegmentWidth);
getMotionSegmentValue(segmentTime + segmentDuration / 2), }, [maxSegmentWidth, secondHalfMotionValue, interpolateMotionAudioData]);
maxSegmentWidth,
);
}, [
segmentTime,
segmentDuration,
maxSegmentWidth,
getMotionSegmentValue,
interpolateMotionAudioData,
]);
const alignedMinimapStartTime = useMemo( const alignedMinimapStartTime = useMemo(
() => alignStartDateToTimeline(minimapStartTime ?? 0), () => alignStartDateToTimeline(minimapStartTime ?? 0),