add staggered text

rename box to rect
refactor rust
This commit is contained in:
2023-05-23 10:27:45 +02:00
parent 7576850ae0
commit 8523e44029
32 changed files with 4344 additions and 2203 deletions

View File

@@ -56,7 +56,7 @@ const CanvasComponent: FC<CanvasProps> = () => {
}, []);
useEffect(() => {
// console.time("calculation");
console.time("calculation");
const parsedEntities = AnimatedEntities.parse(entities);
invoke("calculate_timeline_entities_at_frame", {
@@ -68,11 +68,11 @@ const CanvasComponent: FC<CanvasProps> = () => {
duration,
},
}).then((data) => {
// console.timeEnd("calculation");
console.timeEnd("calculation");
// console.log(data);
const entitiesResult = Entities.safeParse(data);
//console.time("draw");
console.time("draw");
if (canvasKit && canvas.current && surface.current && fontData) {
surface.current.flush();
@@ -101,7 +101,7 @@ const CanvasComponent: FC<CanvasProps> = () => {
}
});
}
// console.timeEnd("draw");
console.timeEnd("draw");
});
});

View File

@@ -37,7 +37,7 @@ const KeyframeIndicator: FC<{
style={{
clipPath: "polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)",
}}
className="bg-indigo-300 absolute w-2 h-2 z-30 top-[39%]"
className="bg-indigo-300 absolute w-2 h-2 z-30 top-[39%] select-none"
></motion.div>
);
};
@@ -70,7 +70,7 @@ const Track: FC<TrackProps> = ({ keyframes, animationData, index, name }) => {
</div>
<div
style={{ width: "1000px" }}
className="flex w-full h-full flex-row relative bg-gray-900"
className="flex w-full h-full flex-row relative bg-gray-900 select-none"
>
{keyframes.map((keyframe, index) => (
<KeyframeIndicator
@@ -113,7 +113,7 @@ const Track: FC<TrackProps> = ({ keyframes, animationData, index, name }) => {
},
});
}}
className="z-10 w-4 bg-slate-500 h-full absolute rounded-md"
className="z-10 w-4 bg-slate-500 h-full absolute rounded-md select-none"
/>
<motion.div
drag="x"
@@ -142,7 +142,7 @@ const Track: FC<TrackProps> = ({ keyframes, animationData, index, name }) => {
},
});
}}
className="z-10 w-4 bg-slate-500 h-full absolute rounded-md"
className="z-10 w-4 bg-slate-500 h-full absolute rounded-md select-none"
/>
<motion.div
drag="x"
@@ -173,7 +173,7 @@ const Track: FC<TrackProps> = ({ keyframes, animationData, index, name }) => {
},
});
}}
className="z-5 h-full absolute rounded-md transition-colors bg-gray-700 hover:bg-gray-600"
className="z-5 h-full absolute rounded-md transition-colors bg-gray-700 hover:bg-gray-600 select-none"
></motion.div>
</div>
</div>