@revideo/create 0.5.8-beta.1082 → 0.5.8

package/examples/avatar-with-background/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "avatar-with-background",
+  "private": true,
+  "version": "0.0.0",
+  "scripts": {
+    "start": "vite",
+    "serve": "vite",
+    "build": "tsc && vite build",
+    "render": "tsc && node dist/render.js"
+  },
+  "dependencies": {
+    "@deepgram/sdk": "^3.3.0",
+    "@revideo/2d": "0.4.5",
+    "@revideo/core": "0.4.5",
+    "@revideo/ffmpeg": "0.4.5",
+    "@revideo/renderer": "0.4.5",
+    "@revideo/vite-plugin": "0.4.5",
+    "dotenv": "^16.4.5",
+    "openai": "^4.39.0"
+  },
+  "devDependencies": {
+    "@revideo/ui": "0.4.5",
+    "typescript": "^5.2.2",
+    "vite": "^4.5"
+  }
+}

package/examples/avatar-with-background/src/project.meta

@@ -0,0 +1,31 @@
+{
+  "version": 0,
+  "shared": {
+    "background": null,
+    "range": [
+      0,
+      null
+    ],
+    "size": {
+      "x": 1080,
+      "y": 1080
+    },
+    "audioOffset": 0
+  },
+  "preview": {
+    "fps": 30,
+    "resolutionScale": 1
+  },
+  "rendering": {
+    "fps": 30,
+    "resolutionScale": 1,
+    "colorSpace": "srgb",
+    "exporter": {
+      "name": "@revideo/core/wasm",
+      "options": {
+        "fastStart": true,
+        "includeAudio": true
+      }
+    }
+  }
+}

package/examples/avatar-with-background/src/project.ts

@@ -0,0 +1,6 @@
+import {makeProject} from '@revideo/core';
+import example from './scenes/example?scene';
+
+export default makeProject({
+  scenes: [example]
+});

package/examples/avatar-with-background/src/render.ts

@@ -0,0 +1,14 @@
+import {renderVideo} from '@revideo/renderer';
+
+async function render() {
+  console.log('Rendering video...');
+
+  const file = await renderVideo({
+    projectFile: './src/project.ts',
+    settings: { logProgress: true }
+  });
+
+  console.log(`Rendered video to ${file}`);
+}
+
+render();

package/examples/avatar-with-background/src/revideo.d.ts

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

package/examples/avatar-with-background/src/scenes/example.meta

@@ -0,0 +1,5 @@
+{
+  "version": 0,
+  "timeEvents": [],
+  "seed": 483310598
+}

package/examples/avatar-with-background/src/scenes/example.tsx

@@ -0,0 +1,27 @@
+import { Img, Video, makeScene2D } from '@revideo/2d';
+import { waitFor, createRef, useScene } from '@revideo/core'
+
+export default makeScene2D(function* (view) {
+  const avatarRef = createRef<Video>();
+  const backgroundRef = createRef<Img>();
+
+  yield view.add(
+    <>
+      <Img
+        src={'https://revideo-example-assets.s3.amazonaws.com/mountains.jpg'}
+        height={'100%'}
+        ref={backgroundRef}
+      />
+      <Video
+        src={'https://revideo-example-assets.s3.amazonaws.com/avatar.webm'}
+        play={true}
+        width={'100%'}
+        ref={avatarRef}
+      />
+    </>,
+  );
+
+  avatarRef().position.y(useScene().getSize().y / 2 - avatarRef().height() / 2);
+
+  yield* waitFor(avatarRef().getDuration());
+});

package/examples/avatar-with-background/tsconfig.json

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

package/examples/avatar-with-background/vite.config.ts

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

package/examples/default/package.json

@@ -0,0 +1,24 @@
+{
+  "name": "revideo-app",
+  "private": true,
+  "version": "0.0.0",
+  "scripts": {
+    "start": "vite",
+    "serve": "vite",
+    "build": "tsc && vite build",
+    "render": "tsc && node dist/render.js"
+  },
+  "dependencies": {
+    "@revideo/core": "^0.5.8",
+    "@revideo/2d": "^0.5.8",
+    "@revideo/renderer": "^0.5.8",
+    "@revideo/vite-plugin": "^0.5.8",
+    "@revideo/ffmpeg": "^0.5.8"
+  },
+  "devDependencies": {
+    "@revideo/ui": "^0.5.8",
+    "@revideo/cli": "^0.5.8",
+    "typescript": "^5.2.2",
+    "vite": "^4.5"
+  }
+}

package/examples/default/src/project.meta

@@ -0,0 +1,31 @@
+{
+  "version": 0,
+  "shared": {
+    "background": null,
+    "range": [
+      0,
+      null
+    ],
+    "size": {
+      "x": 1920,
+      "y": 1080
+    },
+    "audioOffset": 0
+  },
+  "preview": {
+    "fps": 30,
+    "resolutionScale": 1
+  },
+  "rendering": {
+    "fps": 30,
+    "resolutionScale": 1,
+    "colorSpace": "srgb",
+    "exporter": {
+      "name": "@revideo/core/wasm",
+      "options": {
+        "fastStart": true,
+        "includeAudio": true
+      }
+    }
+  }
+}

package/examples/default/src/project.ts

@@ -0,0 +1,7 @@
+import {makeProject} from '@revideo/core';
+
+import example from './scenes/example?scene';
+
+export default makeProject({
+  scenes: [example],
+});

package/examples/default/src/render.ts

@@ -0,0 +1,15 @@
+import {renderVideo} from '@revideo/renderer';
+
+async function render() {
+  console.log('Rendering video...');
+
+  // This is the main function that renders the video
+  const file = await renderVideo({
+    projectFile: './src/project.ts',
+    settings: {logProgress: true},
+  });
+
+  console.log(`Rendered video to ${file}`);
+}
+
+render();

package/examples/default/src/revideo.d.ts

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

package/examples/default/src/scenes/example.tsx

@@ -0,0 +1,38 @@
+import {Audio, Img, Video, makeScene2D} from '@revideo/2d';
+import {all, chain, createRef, waitFor} from '@revideo/core';
+
+export default makeScene2D(function* (view) {
+  const logoRef = createRef<Img>();
+
+  yield view.add(
+    <>
+      <Video
+        src={'https://revideo-example-assets.s3.amazonaws.com/stars.mp4'}
+        size={['100%', '100%']}
+        play={true}
+      />
+      <Audio
+        src={'https://revideo-example-assets.s3.amazonaws.com/chill-beat.mp3'}
+        play={true}
+        time={17.0}
+      />
+    </>,
+  );
+
+  yield* waitFor(1);
+
+  view.add(
+    <Img
+      width={'1%'}
+      ref={logoRef}
+      src={
+        'https://revideo-example-assets.s3.amazonaws.com/revideo-logo-white.png'
+      }
+    />,
+  );
+
+  yield* chain(
+    all(logoRef().scale(40, 2), logoRef().rotation(360, 2)),
+    logoRef().scale(60, 1),
+  );
+});

package/examples/default/tsconfig.json

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

package/examples/default/vite.config.ts

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