calesthio
2c16c6e547
- Upgrade Remotion packages to 4.0.441, add transitions/captions/fonts/media - Add spring-animated image scenes, stat reveals, section titles, hero cards - Add TikTok-style word-by-word captions with highlight effect - Add Google Fonts (Space Grotesk) and dynamic duration via calculateMetadata - Fix Remotion false-positive: check node_modules/ in _remotion_available() - Add project directory convention, music library, tool naming docs - Add music transparency to proposal stage, subtitle pipeline to compose stage - Add README showcase montage and Windows npm troubleshooting note
37 lines
919 B
TypeScript
37 lines
919 B
TypeScript
import { Composition, CalculateMetadataFunction } from "remotion";
|
|
import { Explainer, ExplainerProps } from "./Explainer";
|
|
|
|
const calculateMetadata: CalculateMetadataFunction<ExplainerProps> = async ({
|
|
props,
|
|
}) => {
|
|
const cuts = props.cuts || [];
|
|
if (cuts.length === 0) {
|
|
return { durationInFrames: 30 * 60 };
|
|
}
|
|
const lastEnd = Math.max(...cuts.map((c) => c.out_seconds || 0));
|
|
// Add 1 second padding for final fade
|
|
return { durationInFrames: Math.ceil((lastEnd + 1) * 30) };
|
|
};
|
|
|
|
export const Root: React.FC = () => {
|
|
return (
|
|
<>
|
|
<Composition
|
|
id="Explainer"
|
|
component={Explainer}
|
|
durationInFrames={30 * 60}
|
|
fps={30}
|
|
width={1920}
|
|
height={1080}
|
|
defaultProps={{
|
|
cuts: [],
|
|
overlays: [],
|
|
captions: [],
|
|
audio: {},
|
|
}}
|
|
calculateMetadata={calculateMetadata}
|
|
/>
|
|
</>
|
|
);
|
|
};
|