mirror of
https://github.com/markmanx/isoflow.git
synced 2025-02-07 20:10:47 +00:00
fix: disables animations on scene layer on first render
This commit is contained in:
parent
db9f60f569
commit
8d98b84213
1 changed files with 8 additions and 3 deletions
|
@ -1,4 +1,4 @@
|
|||
import React, { useRef, useEffect } from 'react';
|
||||
import React, { useRef, useEffect, useState } from 'react';
|
||||
import gsap from 'gsap';
|
||||
import { Box, SxProps } from '@mui/material';
|
||||
import { useUiStateStore } from 'src/stores/uiStateStore';
|
||||
|
@ -16,6 +16,7 @@ export const SceneLayer = ({
|
|||
sx,
|
||||
disableAnimation
|
||||
}: Props) => {
|
||||
const [isFirstRender, setIsFirstRender] = useState(true);
|
||||
const elementRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
const scroll = useUiStateStore((state) => {
|
||||
|
@ -29,12 +30,16 @@ export const SceneLayer = ({
|
|||
if (!elementRef.current) return;
|
||||
|
||||
gsap.to(elementRef.current, {
|
||||
duration: disableAnimation ? 0 : 0.25,
|
||||
duration: disableAnimation || isFirstRender ? 0 : 0.25,
|
||||
translateX: scroll.position.x,
|
||||
translateY: scroll.position.y,
|
||||
scale: zoom
|
||||
});
|
||||
}, [zoom, scroll, disableAnimation]);
|
||||
|
||||
if (isFirstRender) {
|
||||
setIsFirstRender(false);
|
||||
}
|
||||
}, [zoom, scroll, disableAnimation, isFirstRender]);
|
||||
|
||||
return (
|
||||
<Box
|
||||
|
|
Loading…
Reference in a new issue