@revideo/create 0.5.8-alpha.1084 → 0.5.8-beta.1082

package/examples/youtube-shorts/src/render.ts

@@ -1,43 +0,0 @@
-require('dotenv').config();
-
-import {renderVideo} from '@revideo/renderer';
-import metadata from './metadata.json';
-import { getVideoScript, generateAudio, getWordTimestamps, dalleGenerate, getImagePromptFromScript } from './utils';
-import { v4 as uuidv4 } from 'uuid';
-import * as fs from 'fs';
-
-async function createVideo(topic: string, voiceName: string){
-    const jobId = uuidv4();
-
-    console.log("Generating assets...")
-    const script = await getVideoScript(topic);
-    console.log("script", script);
-
-    await generateAudio(script, voiceName, `./public/${jobId}-audio.wav`);
-    const words = await getWordTimestamps(`./public/${jobId}-audio.wav`);
-
-    console.log("Generating images...")
-    const imagePromises = Array.from({ length: 5 }).map(async (_, index) => {
-        const imagePrompt = await getImagePromptFromScript(script);
-        await dalleGenerate(imagePrompt, `./public/${jobId}-image-${index}.png`);
-        return `/${jobId}-image-${index}.png`;
-    });
-
-    const imageFileNames = await Promise.all(imagePromises);
-    const metadata = {
-      audioUrl: `${jobId}-audio.wav`,
-      images: imageFileNames,
-      words: words
-    };
-  
-    await fs.promises.writeFile(`./public/${jobId}-metadata.json`, JSON.stringify(metadata, null, 2));
-
-    console.log("Assets generated! Rendering video...")
-    await renderVideo({
-      projectFile: './src/project.ts',
-      variables: metadata
-    });
-    console.log("Render finished");
-}
-
-createVideo("The moon landing", "Sarah");

package/examples/youtube-shorts/src/revideo.d.ts

@@ -1 +0,0 @@
-/// <reference types="@revideo/core/project" />

package/examples/youtube-shorts/src/scenes/example.tsx

@@ -1,211 +0,0 @@
-import {Audio, Img, makeScene2D, Txt, View2D, Rect} from '@revideo/2d';
-import {all, createRef, waitFor, useScene, Reference, createSignal} from '@revideo/core';
-
-interface Word {
-  punctuated_word: string;
-  start: number;
-  end: number;
-}
-
-interface captionSettings {
-  fontSize: number;
-  textColor: string;
-  fontWeight: number;
-  fontFamily: string;
-  numSimultaneousWords: number;
-  stream: boolean;
-  textAlign: "center" | "left";
-  textBoxWidthInPercent: number;
-  borderColor?: string;
-  borderWidth?: number;
-  currentWordColor?: string;
-  currentWordBackgroundColor?: string;
-  shadowColor?: string;
-  shadowBlur?: number;
-  fadeInAnimation?: boolean;
-}
-
-const textSettings: captionSettings = {
-  fontSize: 80,
-  numSimultaneousWords: 4, // how many words are shown at most simultaneously
-  textColor: "white",
-  fontWeight: 800,
-  fontFamily: "Mulish",
-  stream: false, // if true, words appear one by one
-  textAlign: "center",
-  textBoxWidthInPercent: 70,
-  fadeInAnimation: true,
-  currentWordColor: "cyan",
-  currentWordBackgroundColor: "red", // adds a colored box to the word currently spoken
-  shadowColor: "black",
-  shadowBlur: 30
-}
-
-
-export default makeScene2D(function* (view) {
-  const images = useScene().variables.get('images', [])();
-  const audioUrl = useScene().variables.get('audioUrl', 'none')();
-  const words = useScene().variables.get('words', [])();
-
-  const duration = words[words.length-1].end + 0.5;
-
-  yield view.add(
-    <>
-      <Audio
-        src={audioUrl}
-        play={true}
-      />
-      <Audio
-        src={"https://revideo-example-assets.s3.amazonaws.com/chill-beat-2.mp3"}
-        play={true}
-        volume={0.1}
-      />
-    </>
-  );
-
-  yield* all(
-    displayImages(view, images, duration),
-    displayWords(
-      view,
-      words,
-      textSettings
-    )
-  )
-});
-
-function* displayImages(view: View2D, images: string[], totalDuration: number){
-  for(const img of images){
-    const ref = createRef<Img>();
-    view.add(<Img 
-      src={img}
-      size={["100%", "100%"]}
-      ref={ref}
-      zIndex={0}
-    /> 
-    )
-    yield* waitFor(totalDuration/images.length);
-  }
-}
-
-function* displayWords(view: View2D, words: Word[], settings: captionSettings){
-  let waitBefore = words[0].start;
-
-  for (let i = 0; i < words.length; i += settings.numSimultaneousWords) {
-    const currentBatch = words.slice(i, i + settings.numSimultaneousWords);
-    const nextClipStart =
-      i < words.length - 1 ? words[i + settings.numSimultaneousWords]?.start || null : null;
-    const isLastClip = i + settings.numSimultaneousWords >= words.length;
-    const waitAfter = isLastClip ? 1 : 0;
-    const textRef = createRef<Txt>();
-    yield* waitFor(waitBefore);
-
-    if(settings.stream){
-      let nextWordStart = 0;
-      yield view.add(<Txt width={`${settings.textBoxWidthInPercent}%`} textWrap={true} zIndex={2} textAlign={settings.textAlign} ref={textRef}/>);
-
-      for(let j = 0; j < currentBatch.length; j++){
-        const word = currentBatch[j];
-        yield* waitFor(nextWordStart);
-        const optionalSpace = j === currentBatch.length-1? "" : " ";
-        const backgroundRef = createRef<Rect>();
-        const wordRef = createRef<Txt>();
-        const opacitySignal = createSignal(settings.fadeInAnimation ? 0.5 : 1);
-        textRef().add(
-          <Txt
-            fontSize={settings.fontSize}
-            fontWeight={settings.fontWeight}
-            fontFamily={settings.fontFamily}
-            textWrap={true}
-            textAlign={settings.textAlign}
-            fill={settings.currentWordColor}
-            ref={wordRef}
-            lineWidth={settings.borderWidth}
-            shadowBlur={settings.shadowBlur}
-            shadowColor={settings.shadowColor}
-            zIndex={2}
-            stroke={settings.borderColor}
-            opacity={opacitySignal}
-          >
-            {word.punctuated_word}
-          </Txt>
-        );
-        textRef().add(<Txt fontSize={settings.fontSize}>{optionalSpace}</Txt>);
-        view.add(<Rect fill={settings.currentWordBackgroundColor} zIndex={1} size={wordRef().size} position={wordRef().position} radius={10} padding={10} ref={backgroundRef} />);
-        yield* all(waitFor(word.end-word.start), opacitySignal(1, Math.min((word.end-word.start)*0.5, 0.1)));
-        wordRef().fill(settings.textColor);
-        backgroundRef().remove();
-        nextWordStart = currentBatch[j+1]?.start - word.end || 0;
-      }
-      textRef().remove();
-
-    } else {
-      yield view.add(<Txt width={`${settings.textBoxWidthInPercent}%`} textAlign={settings.textAlign} ref={textRef} textWrap={true} zIndex={2}/>);
-
-      const wordRefs = [];
-      const opacitySignal = createSignal(settings.fadeInAnimation ? 0.5 : 1);
-      for(let j = 0; j < currentBatch.length; j++){
-        const word = currentBatch[j];
-        const optionalSpace = j === currentBatch.length-1? "" : " ";
-        const wordRef = createRef<Txt>();
-        textRef().add(
-          <Txt
-            fontSize={settings.fontSize}
-            fontWeight={settings.fontWeight}
-            ref={wordRef}
-            fontFamily={settings.fontFamily}
-            textWrap={true}
-            textAlign={settings.textAlign}
-            fill={settings.textColor}
-            zIndex={2}
-            stroke={settings.borderColor}
-            lineWidth={settings.borderWidth}
-            shadowBlur={settings.shadowBlur}
-            shadowColor={settings.shadowColor}
-            opacity={opacitySignal}
-          >
-            {word.punctuated_word}
-          </Txt>
-        );
-        textRef().add(<Txt fontSize={settings.fontSize}>{optionalSpace}</Txt>);
-
-        // we have to yield once to await the first word being aligned correctly
-        if(j===0 && i === 0){
-          yield;
-        }
-        wordRefs.push(wordRef);
-      }
-
-      yield* all(
-        opacitySignal(1, Math.min(0.1, (currentBatch[0].end-currentBatch[0].start)*0.5)),
-        highlightCurrentWord(view, currentBatch, wordRefs, settings.currentWordColor, settings.currentWordBackgroundColor),
-        waitFor(currentBatch[currentBatch.length-1].end - currentBatch[0].start + waitAfter), 
-      );
-      textRef().remove();
-    }
-    waitBefore = nextClipStart !== null ? nextClipStart - currentBatch[currentBatch.length-1].end : 0;
-  }
-}
-
-function* highlightCurrentWord(view: View2D, currentBatch: Word[], wordRefs: Reference<Txt>[], wordColor: string, backgroundColor: string){
-  let nextWordStart = 0;
-
-  for(let i = 0; i < currentBatch.length; i++){
-    yield* waitFor(nextWordStart);
-    const word = currentBatch[i];
-    const originalColor = wordRefs[i]().fill();
-    nextWordStart = currentBatch[i+1]?.start - word.end || 0;
-    wordRefs[i]().fill(wordColor);
-
-    const backgroundRef = createRef<Rect>();
-    if(backgroundColor){
-      view.add(<Rect fill={backgroundColor} zIndex={1} size={wordRefs[i]().size} position={wordRefs[i]().position} radius={10} padding={10} ref={backgroundRef} />);
-    }
-
-    yield* waitFor(word.end-word.start);
-    wordRefs[i]().fill(originalColor);
-
-    if(backgroundColor){
-      backgroundRef().remove();
-    }
-  }
-}

package/examples/youtube-shorts/src/utils.ts

@@ -1,123 +0,0 @@
-import OpenAI from 'openai';
-import axios from "axios";
-import * as fs from "fs";
-import { createClient } from "@deepgram/sdk";
-
-const deepgram = createClient(process.env["DEEPGRAM_API_KEY"] || "");
-const openai = new OpenAI({
-	apiKey: process.env['OPENAI_API_KEY'],
-  });  
-
-export async function getWordTimestamps(audioFilePath: string){
-    const {result} = await deepgram.listen.prerecorded.transcribeFile(fs.readFileSync(audioFilePath), {
-		model: "nova-2",
-		smart_format: true,
-	});
-
-    if (result) {
-        return result.results.channels[0].alternatives[0].words;
-    } else {
-		throw Error("transcription result is null");
-    }
-
-}
-
-export async function generateAudio(text: string, voiceName: string, savePath: string) {
-	const data = {
-		model_id: "eleven_multilingual_v2",
-		text: text,
-	};
-
-	const voiceId = await getVoiceByName(voiceName);
-
-	const response = await axios.post(`https://api.elevenlabs.io/v1/text-to-speech/${voiceId}`, data, {
-		headers: {
-			"Content-Type": "application/json",
-			"xi-api-key": process.env.ELEVEN_API_KEY || "",
-		},
-		responseType: "arraybuffer",
-	});
-
-	fs.writeFileSync(savePath, response.data);
-}
-
-async function getVoiceByName(name: string) {
-	const response = await fetch("https://api.elevenlabs.io/v1/voices", {
-		method: "GET",
-		headers: {
-			"xi-api-key": process.env.ELEVEN_API_KEY || "",
-		},
-	});
-
-	if (!response.ok) {
-		throw new Error(`HTTP error! status: ${response.status}`);
-	}
-
-	const data: any = await response.json();
-	const voice = data.voices.find((voice: {name: string; voice_id: string}) => voice.name === name);
-	return voice ? voice.voice_id : null;
-}
-
-export async function getVideoScript(videoTopic: string) {
-  const prompt = `Create a script for a youtube short. The script should be around 60 to 80 words long and be an interesting text about the provided topic, and it should start with a catchy headline, something like "Did you know that?" or "This will blow your mind". Remember that this is for a voiceover that should be read, so things like hashtags should not be included. Now write the script for the following topic: "${videoTopic}". Now return the script and nothing else, also no meta-information - ONLY THE VOICEOVER.`;
-
-  const chatCompletion = await openai.chat.completions.create({
-    messages: [{ role: 'user', content: prompt }],
-    model: 'gpt-4-turbo-preview',
-  });
-
-  const result = chatCompletion.choices[0].message.content;
-
-  if (result) {
-    return result;
-  } else {
-    throw Error("returned text is null");
-  }
-
-}
-
-export async function getImagePromptFromScript(script: string) {
-  const prompt = `My goal is to create a Youtube Short based on the following script. To create a background image for the video, I am using a text-to-video AI model. Please write a short (not longer than a single sentence), suitable prompt for such a model based on this script: ${script}.\n\nNow return the prompt and nothing else.`;
-
-  const chatCompletion = await openai.chat.completions.create({
-    messages: [{ role: 'user', content: prompt }],
-    model: 'gpt-4-turbo-preview',
-    temperature: 1.0 // high temperature for "creativeness"
-  });
-
-  const result = chatCompletion.choices[0].message.content;
-
-  if (result) {
-    return result;
-  } else {
-    throw Error("returned text is null");
-  }
-
-}
-
-export async function dalleGenerate(prompt: string, savePath: string) {
-	const response = await openai.images.generate({
-		model: "dall-e-3",
-		prompt: prompt,
-		size: "1024x1792",
-		quality: "standard",
-		n: 1,
-	});
-
-	if (!response.data || !response.data[0]) {
-		throw new Error("No image generated");
-	}
-
-	const url = response.data[0].url;
-	const responseImage = await axios.get(url || "", {
-		responseType: "arraybuffer",
-	});
-	const buffer = Buffer.from(responseImage.data, "binary");
-	
-	try {
-		await fs.promises.writeFile(savePath, buffer);
-	  } catch (error) {
-		console.error("Error saving the file:", error);
-		throw error; // Rethrow the error so it can be handled by the caller
-	  }
-	}

package/examples/youtube-shorts/tsconfig.json

@@ -1,9 +0,0 @@
-{
-  "extends": "@revideo/2d/tsconfig.project.json",
-  "include": ["src"],
-  "compilerOptions": {
-    "noEmit": false,
-    "outDir": "dist",
-    "module": "CommonJS"
-  }
-}

package/examples/youtube-shorts/vite.config.ts

@@ -1,8 +0,0 @@
-import {defineConfig} from 'vite';
-import motionCanvas from '@revideo/vite-plugin';
-
-export default defineConfig({
-  plugins: [
-    motionCanvas()
-  ],
-});