aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/trails/SlideEffect.tsx
diff options
context:
space:
mode:
authorSophie Zhang <sophie_zhang@brown.edu>2024-05-01 15:57:07 -0400
committerSophie Zhang <sophie_zhang@brown.edu>2024-05-01 15:57:07 -0400
commit926a079c7745d2aac1f9a3ff31ef8cbdefdf732e (patch)
treeedad658f39638f359fc29bcab303d140b0357623 /src/client/views/nodes/trails/SlideEffect.tsx
parent90016b133395c93f897c614ffee761b6da587e0f (diff)
bug fiixng
Diffstat (limited to 'src/client/views/nodes/trails/SlideEffect.tsx')
-rw-r--r--src/client/views/nodes/trails/SlideEffect.tsx32
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>;
}