diff --git a/packages/fakeyou.com/src/components/common/VideoQuickTrim/components/withScrubbing.tsx b/packages/fakeyou.com/src/components/common/VideoQuickTrim/components/withScrubbing.tsx index 7bc3925761..2ad8a29b66 100644 --- a/packages/fakeyou.com/src/components/common/VideoQuickTrim/components/withScrubbing.tsx +++ b/packages/fakeyou.com/src/components/common/VideoQuickTrim/components/withScrubbing.tsx @@ -1,5 +1,5 @@ import React,{ - // useEffect, + useEffect, useRef, useState, useLayoutEffect, @@ -14,8 +14,6 @@ export interface withScrubbingPropsI { styleOverride?: {[key: string]: string|number }; onScrubEnds?: (posPercent: number)=>void; //return scrubber location as %, where 0 < % < 1 - onScrubChanges?: (posPercent:number)=>void; - //return scrubber location as %, where 0 < % < 1 } type withSrcubbingStates = { @@ -32,10 +30,9 @@ export const withScrubbing =
(Component: React.Co
initialLeftOffsetPercent = 0,
styleOverride = {},
onScrubEnds,
- onScrubChanges,
...rest
}: withScrubbingPropsI) => {
- // console.log(`withScrubbing reRender!! ${Date.now()}`);
+ console.log(`withSCRUBBING reRender!! `);
const refEl = useRef (Component: React.Co
const [{
// key,
currLeftOffset, pointerStartPos,
- // prevLeftOffset,
+ prevLeftOffset,
}, setStates] = useState (Component: React.Co
window.removeEventListener("mousemove", handleScrubMove);
};
}
- }, []);
- // useEffect(()=>{
- // if(onScrubEnds)onScrubEnds(prevLeftOffset/boundingWidth);
- // },[prevLeftOffset, boundingWidth, onScrubEnds]);
+ }, [scrubberWidth, boundingWidth]);
+
+ useEffect(()=>{
+ if(onScrubEnds)onScrubEnds(prevLeftOffset/boundingWidth);
+ },[prevLeftOffset, boundingWidth, onScrubEnds]);
+
return(