diff options
| author | Sophie Zhang <sophie_zhang@brown.edu> | 2024-05-01 15:57:07 -0400 |
|---|---|---|
| committer | Sophie Zhang <sophie_zhang@brown.edu> | 2024-05-01 15:57:07 -0400 |
| commit | 926a079c7745d2aac1f9a3ff31ef8cbdefdf732e (patch) | |
| tree | edad658f39638f359fc29bcab303d140b0357623 /src/client/views/nodes/trails/SlideEffect.tsx | |
| parent | 90016b133395c93f897c614ffee761b6da587e0f (diff) | |
bug fiixng
Diffstat (limited to 'src/client/views/nodes/trails/SlideEffect.tsx')
| -rw-r--r-- | src/client/views/nodes/trails/SlideEffect.tsx | 32 |
1 files changed, 4 insertions, 28 deletions
diff --git a/src/client/views/nodes/trails/SlideEffect.tsx b/src/client/views/nodes/trails/SlideEffect.tsx index 5cb4da72c..cf31b565e 100644 --- a/src/client/views/nodes/trails/SlideEffect.tsx +++ b/src/client/views/nodes/trails/SlideEffect.tsx @@ -10,8 +10,10 @@ interface Props { doc?: Doc; dir: PresEffectDirection; presEffect: PresEffect; - friction: number; + // stiffness (figma) = tension (react-spring) tension: number; + // damping (figma) = friction (react-spring) + friction: number; mass: number; children: React.ReactNode; infinite?: boolean; @@ -285,23 +287,6 @@ export default function SpringAnimation({ doc, dir, friction, tension, mass, pre api.start(config); }; - // const flipRender = () => { - // return ( - // <div className="flip-container"> - // <animated.div className={'flip-side flip-back'} style={{ opacity: opacity.to(o => 1 - o), transform }} /> - // <animated.div - // className={'flip-side flip-front'} - // style={{ - // opacity, - // transform, - // rotateX: '180deg', - // }}> - // {children} - // </animated.div> - // </div> - // ); - // }; - const getRenderDoc = () => { switch (presEffect) { case PresEffect.Rotate: @@ -365,17 +350,8 @@ export default function SpringAnimation({ doc, dir, friction, tension, mass, pre } }; - // useEffect(() => { - // // TODO: Control start with slide visibility instead - // setTimeout(() => { - // startAnimation(); - // }, 200); - // }, []); - useEffect(() => { if (infinite || !inView) return; - console.log('in view'); - // TODO: Control start with slide visibility instead setTimeout(() => { startAnimation(); }, 100); @@ -385,7 +361,7 @@ export default function SpringAnimation({ doc, dir, friction, tension, mass, pre if (infinite) { startAnimation(); } - }, []); + }, [presEffect, tension, friction, mass]); return <div>{getRenderDoc()}</div>; } |
