calesthio
56 lines
1.4 KiB
TypeScript
56 lines
1.4 KiB
TypeScript
import { Composition, CalculateMetadataFunction } from "remotion";
|
|
import { Explainer, ExplainerProps } from "./Explainer";
|
|
import {
|
|
CinematicRenderer,
|
|
calculateCinematicMetadata,
|
|
} from "./CinematicRenderer";
|
|
|
|
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}
|
|
/>
|
|
<Composition
|
|
id="CinematicRenderer"
|
|
component={CinematicRenderer}
|
|
durationInFrames={30 * 30}
|
|
fps={30}
|
|
width={1920}
|
|
height={1080}
|
|
defaultProps={{
|
|
scenes: [],
|
|
titleFontSize: 78,
|
|
titleWidth: 1320,
|
|
signalLineCount: 18,
|
|
}}
|
|
calculateMetadata={calculateCinematicMetadata}
|
|
/>
|
|
</>
|
|
);
|
|
};
|