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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (175) hide show
  1. package/package.json +9 -9
  2. package/examples/README.md +0 -43
  3. package/examples/avatar-with-background/package-lock.json +0 -3223
  4. package/examples/avatar-with-background/package.json +0 -26
  5. package/examples/avatar-with-background/src/project.meta +0 -31
  6. package/examples/avatar-with-background/src/project.ts +0 -6
  7. package/examples/avatar-with-background/src/render.ts +0 -14
  8. package/examples/avatar-with-background/src/revideo.d.ts +0 -1
  9. package/examples/avatar-with-background/src/scenes/example.meta +0 -5
  10. package/examples/avatar-with-background/src/scenes/example.tsx +0 -27
  11. package/examples/avatar-with-background/tsconfig.json +0 -9
  12. package/examples/avatar-with-background/vite.config.ts +0 -8
  13. package/examples/default/package.json +0 -24
  14. package/examples/default/src/project.meta +0 -31
  15. package/examples/default/src/project.ts +0 -7
  16. package/examples/default/src/render.ts +0 -15
  17. package/examples/default/src/revideo.d.ts +0 -1
  18. package/examples/default/src/scenes/example.tsx +0 -38
  19. package/examples/default/tsconfig.json +0 -9
  20. package/examples/default/vite.config.ts +0 -8
  21. package/examples/github-stars-celebration/package-lock.json +0 -3833
  22. package/examples/github-stars-celebration/package.json +0 -24
  23. package/examples/github-stars-celebration/src/global.css +0 -1
  24. package/examples/github-stars-celebration/src/project.meta +0 -28
  25. package/examples/github-stars-celebration/src/project.ts +0 -8
  26. package/examples/github-stars-celebration/src/render.ts +0 -15
  27. package/examples/github-stars-celebration/src/revideo.d.ts +0 -1
  28. package/examples/github-stars-celebration/src/scenes/example.meta +0 -5
  29. package/examples/github-stars-celebration/src/scenes/example.tsx +0 -51
  30. package/examples/github-stars-celebration/tsconfig.json +0 -9
  31. package/examples/github-stars-celebration/vite.config.ts +0 -8
  32. package/examples/google-cloud-run-parallelized/README.md +0 -127
  33. package/examples/google-cloud-run-parallelized/render-orchestrator/Dockerfile +0 -56
  34. package/examples/google-cloud-run-parallelized/render-orchestrator/package.json +0 -22
  35. package/examples/google-cloud-run-parallelized/render-orchestrator/src/index.ts +0 -72
  36. package/examples/google-cloud-run-parallelized/render-orchestrator/src/revideo.d.ts +0 -1
  37. package/examples/google-cloud-run-parallelized/render-orchestrator/tsconfig.json +0 -10
  38. package/examples/google-cloud-run-parallelized/render-worker/.gcloudignore +0 -17
  39. package/examples/google-cloud-run-parallelized/render-worker/.puppeteerrc.cjs +0 -9
  40. package/examples/google-cloud-run-parallelized/render-worker/package.json +0 -30
  41. package/examples/google-cloud-run-parallelized/render-worker/src/index.ts +0 -45
  42. package/examples/google-cloud-run-parallelized/render-worker/src/project.meta +0 -31
  43. package/examples/google-cloud-run-parallelized/render-worker/src/project.ts +0 -6
  44. package/examples/google-cloud-run-parallelized/render-worker/src/render.ts +0 -14
  45. package/examples/google-cloud-run-parallelized/render-worker/src/revideo.d.ts +0 -1
  46. package/examples/google-cloud-run-parallelized/render-worker/src/scenes/example.tsx +0 -30
  47. package/examples/google-cloud-run-parallelized/render-worker/tsconfig.json +0 -13
  48. package/examples/google-cloud-run-parallelized/render-worker/vite.config.ts +0 -9
  49. package/examples/logo.svg +0 -6
  50. package/examples/logo_dark.svg +0 -6
  51. package/examples/marketing-templates/README.md +0 -10
  52. package/examples/marketing-templates/marketing-template/package-lock.json +0 -3824
  53. package/examples/marketing-templates/marketing-template/package.json +0 -24
  54. package/examples/marketing-templates/marketing-template/src/globals.css +0 -0
  55. package/examples/marketing-templates/marketing-template/src/project.meta +0 -28
  56. package/examples/marketing-templates/marketing-template/src/project.ts +0 -9
  57. package/examples/marketing-templates/marketing-template/src/render.ts +0 -15
  58. package/examples/marketing-templates/marketing-template/src/revideo.d.ts +0 -1
  59. package/examples/marketing-templates/marketing-template/src/scenes/example.meta +0 -5
  60. package/examples/marketing-templates/marketing-template/src/scenes/example.tsx +0 -67
  61. package/examples/marketing-templates/marketing-template/tsconfig.json +0 -9
  62. package/examples/marketing-templates/marketing-template/vite.config.ts +0 -9
  63. package/examples/marketing-templates/multiple-videos-in-one/package-lock.json +0 -3824
  64. package/examples/marketing-templates/multiple-videos-in-one/package.json +0 -24
  65. package/examples/marketing-templates/multiple-videos-in-one/src/project.meta +0 -28
  66. package/examples/marketing-templates/multiple-videos-in-one/src/project.ts +0 -9
  67. package/examples/marketing-templates/multiple-videos-in-one/src/render.ts +0 -15
  68. package/examples/marketing-templates/multiple-videos-in-one/src/revideo.d.ts +0 -1
  69. package/examples/marketing-templates/multiple-videos-in-one/src/scenes/example.meta +0 -5
  70. package/examples/marketing-templates/multiple-videos-in-one/src/scenes/example.tsx +0 -122
  71. package/examples/marketing-templates/multiple-videos-in-one/tsconfig.json +0 -9
  72. package/examples/marketing-templates/multiple-videos-in-one/vite.config.ts +0 -9
  73. package/examples/parallelized-aws-lambda/.dockerignore +0 -3
  74. package/examples/parallelized-aws-lambda/Dockerfile +0 -21
  75. package/examples/parallelized-aws-lambda/Dockerfile.base +0 -64
  76. package/examples/parallelized-aws-lambda/README.md +0 -197
  77. package/examples/parallelized-aws-lambda/revideo-project/.puppeteerrc.cjs +0 -9
  78. package/examples/parallelized-aws-lambda/revideo-project/package-lock.json +0 -4133
  79. package/examples/parallelized-aws-lambda/revideo-project/package.json +0 -31
  80. package/examples/parallelized-aws-lambda/revideo-project/src/lambda.ts +0 -144
  81. package/examples/parallelized-aws-lambda/revideo-project/src/project.meta +0 -28
  82. package/examples/parallelized-aws-lambda/revideo-project/src/project.ts +0 -7
  83. package/examples/parallelized-aws-lambda/revideo-project/src/render.ts +0 -16
  84. package/examples/parallelized-aws-lambda/revideo-project/src/revideo.d.ts +0 -1
  85. package/examples/parallelized-aws-lambda/revideo-project/src/scenes/example.meta +0 -5
  86. package/examples/parallelized-aws-lambda/revideo-project/src/scenes/example.tsx +0 -29
  87. package/examples/parallelized-aws-lambda/revideo-project/tsconfig.json +0 -10
  88. package/examples/parallelized-aws-lambda/revideo-project/vite.config.ts +0 -9
  89. package/examples/reddit-post-video/README.md +0 -84
  90. package/examples/reddit-post-video/package-lock.json +0 -2941
  91. package/examples/reddit-post-video/package.json +0 -27
  92. package/examples/reddit-post-video/src/global.css +0 -1
  93. package/examples/reddit-post-video/src/metadata.json +0 -576
  94. package/examples/reddit-post-video/src/project.meta +0 -31
  95. package/examples/reddit-post-video/src/project.ts +0 -9
  96. package/examples/reddit-post-video/src/render.ts +0 -157
  97. package/examples/reddit-post-video/src/revideo.d.ts +0 -1
  98. package/examples/reddit-post-video/src/scenes/example.meta +0 -5
  99. package/examples/reddit-post-video/src/scenes/example.tsx +0 -74
  100. package/examples/reddit-post-video/tsconfig.json +0 -9
  101. package/examples/reddit-post-video/vite.config.ts +0 -6
  102. package/examples/rive-explanation-video/README.md +0 -9
  103. package/examples/rive-explanation-video/package-lock.json +0 -3706
  104. package/examples/rive-explanation-video/package.json +0 -25
  105. package/examples/rive-explanation-video/src/global.css +0 -1
  106. package/examples/rive-explanation-video/src/project.meta +0 -31
  107. package/examples/rive-explanation-video/src/project.ts +0 -8
  108. package/examples/rive-explanation-video/src/render.ts +0 -15
  109. package/examples/rive-explanation-video/src/revideo.d.ts +0 -1
  110. package/examples/rive-explanation-video/src/scenes/example.meta +0 -5
  111. package/examples/rive-explanation-video/src/scenes/example.tsx +0 -218
  112. package/examples/rive-explanation-video/tsconfig.json +0 -9
  113. package/examples/rive-explanation-video/vite.config.ts +0 -8
  114. package/examples/saas-template/.prettierrc +0 -9
  115. package/examples/saas-template/README.md +0 -28
  116. package/examples/saas-template/next/app/actions.tsx +0 -113
  117. package/examples/saas-template/next/app/api/render/route.ts +0 -22
  118. package/examples/saas-template/next/app/globals.css +0 -3
  119. package/examples/saas-template/next/app/layout.tsx +0 -25
  120. package/examples/saas-template/next/app/page.tsx +0 -187
  121. package/examples/saas-template/next/next.config.mjs +0 -4
  122. package/examples/saas-template/next/package.json +0 -34
  123. package/examples/saas-template/next/postcss.config.js +0 -6
  124. package/examples/saas-template/next/public/favicon.ico +0 -0
  125. package/examples/saas-template/next/public/next.svg +0 -1
  126. package/examples/saas-template/next/public/vercel.svg +0 -1
  127. package/examples/saas-template/next/tailwind.config.ts +0 -30
  128. package/examples/saas-template/next/tsconfig.json +0 -26
  129. package/examples/saas-template/next/utils/parse.ts +0 -35
  130. package/examples/saas-template/revideo/package.json +0 -24
  131. package/examples/saas-template/revideo/src/global.css +0 -1
  132. package/examples/saas-template/revideo/src/project.meta +0 -27
  133. package/examples/saas-template/revideo/src/project.ts +0 -9
  134. package/examples/saas-template/revideo/src/render.ts +0 -15
  135. package/examples/saas-template/revideo/src/revideo.d.ts +0 -1
  136. package/examples/saas-template/revideo/src/scenes/example.meta +0 -5
  137. package/examples/saas-template/revideo/src/scenes/example.tsx +0 -178
  138. package/examples/saas-template/revideo/tsconfig.json +0 -9
  139. package/examples/saas-template/revideo/vite.config.ts +0 -6
  140. package/examples/stitching-videos/README.md +0 -7
  141. package/examples/stitching-videos/package-lock.json +0 -2801
  142. package/examples/stitching-videos/package.json +0 -23
  143. package/examples/stitching-videos/src/project.meta +0 -28
  144. package/examples/stitching-videos/src/project.ts +0 -20
  145. package/examples/stitching-videos/src/render.ts +0 -26
  146. package/examples/stitching-videos/src/revideo.d.ts +0 -1
  147. package/examples/stitching-videos/src/scenes/example.tsx +0 -30
  148. package/examples/stitching-videos/tsconfig.json +0 -9
  149. package/examples/stitching-videos/vite.config.ts +0 -8
  150. package/examples/three-js-example/README.md +0 -8
  151. package/examples/three-js-example/package-lock.json +0 -2753
  152. package/examples/three-js-example/package.json +0 -25
  153. package/examples/three-js-example/src/components/Three.ts +0 -166
  154. package/examples/three-js-example/src/global.css +0 -1
  155. package/examples/three-js-example/src/project.meta +0 -31
  156. package/examples/three-js-example/src/project.ts +0 -8
  157. package/examples/three-js-example/src/render.ts +0 -15
  158. package/examples/three-js-example/src/revideo.d.ts +0 -1
  159. package/examples/three-js-example/src/scenes/basic3D.meta +0 -5
  160. package/examples/three-js-example/src/scenes/basic3D.tsx +0 -89
  161. package/examples/three-js-example/tsconfig.json +0 -9
  162. package/examples/three-js-example/vite.config.ts +0 -6
  163. package/examples/youtube-shorts/README.md +0 -65
  164. package/examples/youtube-shorts/package-lock.json +0 -3914
  165. package/examples/youtube-shorts/package.json +0 -30
  166. package/examples/youtube-shorts/src/global.css +0 -3
  167. package/examples/youtube-shorts/src/metadata.json +0 -635
  168. package/examples/youtube-shorts/src/project.meta +0 -28
  169. package/examples/youtube-shorts/src/project.ts +0 -9
  170. package/examples/youtube-shorts/src/render.ts +0 -43
  171. package/examples/youtube-shorts/src/revideo.d.ts +0 -1
  172. package/examples/youtube-shorts/src/scenes/example.tsx +0 -211
  173. package/examples/youtube-shorts/src/utils.ts +0 -123
  174. package/examples/youtube-shorts/tsconfig.json +0 -9
  175. package/examples/youtube-shorts/vite.config.ts +0 -8
@@ -1,187 +0,0 @@
1
- 'use client';
2
-
3
- import {Player} from '@revideo/player-react';
4
- import {getGithubRepositoryInfo} from './actions';
5
- import {useState} from 'react';
6
- import {LoaderCircle} from 'lucide-react';
7
- import {parseStream} from '../utils/parse';
8
-
9
- function Button({
10
- children,
11
- loading,
12
- onClick,
13
- }: {
14
- children: React.ReactNode;
15
- loading: boolean;
16
- onClick: () => void;
17
- }) {
18
- return (
19
- <button
20
- className="text-sm flex items-center gap-x-2 rounded-md p-2 bg-gray-200 text-gray-700 hover:bg-gray-300"
21
- onClick={() => onClick()}
22
- disabled={loading}
23
- >
24
- {loading && <LoaderCircle className="animate-spin h-4 w-4 text-gray-700" />}
25
- {children}
26
- </button>
27
- );
28
- }
29
-
30
- export default function Home() {
31
- const [repoName, setRepoName] = useState<string>('');
32
- const [repoImage, setRepoImage] = useState<string | null>();
33
- const [stargazerTimes, setStargazerTimes] = useState<number[]>([]);
34
-
35
- const [githubLoading, setGithubLoading] = useState(false);
36
- const [needsKey, setNeedsKey] = useState(false);
37
- const [key, setKey] = useState('');
38
- const [error, setError] = useState<string | null>();
39
-
40
- const [renderLoading, setRenderLoading] = useState(false);
41
- const [progress, setProgress] = useState(0);
42
- const [downloadUrl, setDownloadUrl] = useState<string | null>(null);
43
-
44
- /**
45
- * Get information about the repository from Github.
46
- * @param repoName
47
- * @param key
48
- * @returns
49
- */
50
- async function fetchInformation(repoName: `${string}/${string}`, key: string) {
51
- setGithubLoading(true);
52
- const response = await getGithubRepositoryInfo(repoName, key ?? undefined);
53
- setGithubLoading(false);
54
-
55
- if (response.status === 'rate-limit') {
56
- setNeedsKey(true);
57
- return;
58
- }
59
-
60
- if (response.status === 'error') {
61
- setError('Failed to fetch repository information from Github.');
62
- return;
63
- }
64
-
65
- setStargazerTimes(response.stargazerTimes);
66
- setRepoImage(response.repoImage);
67
- }
68
-
69
- /**
70
- * Render the video.
71
- */
72
- async function render() {
73
- setRenderLoading(true);
74
- const res = await fetch('/api/render', {
75
- method: 'POST',
76
- headers: {
77
- 'Content-Type': 'application/json',
78
- },
79
- body: JSON.stringify({
80
- variables: {
81
- data: stargazerTimes.length ? stargazerTimes : undefined,
82
- repoName: repoName || undefined,
83
- repoImage: repoImage || undefined,
84
- },
85
- streamProgress: true,
86
- }),
87
- }).catch((e) => console.log(e));
88
-
89
- if (!res) {
90
- alert('Failed to render video.');
91
- return;
92
- }
93
-
94
- const downloadUrl = await parseStream(res.body!.getReader(), (p) => setProgress(p));
95
- setRenderLoading(false);
96
- setDownloadUrl(downloadUrl);
97
- }
98
-
99
- return (
100
- <>
101
- <div className="m-auto p-12 max-w-7xl flex flex-col gap-y-4">
102
- <div>
103
- <div className="text-sm text-gray-700 mb-2">Repository</div>
104
- <div className="flex gap-x-4 text-sm">
105
- <input
106
- className="flex-1 rounded-md p-2 bg-gray-200 focus:outline-none placeholder:text-gray-400"
107
- placeholder="redotvideo/revideo"
108
- value={repoName}
109
- onChange={(e) => setRepoName(e.target.value)}
110
- />
111
- {!needsKey && (
112
- <Button
113
- loading={githubLoading}
114
- onClick={() => fetchInformation(repoName as `${string}/${string}`, key)}
115
- >
116
- Fetch information
117
- </Button>
118
- )}
119
- </div>
120
- </div>
121
- {needsKey && (
122
- <div>
123
- <div className="text-sm text-blue-600 mb-2">
124
- You hit the Github API rate-limit. Please provide your own key. Requests to Github are
125
- made directly and the key stays on your device.
126
- </div>
127
- <div className="flex gap-x-4 text-sm">
128
- <input
129
- className="flex-1 rounded-md p-2 bg-gray-200 focus:outline-none placeholder:text-gray-400"
130
- placeholder="ghp_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
131
- value={key}
132
- onChange={(e) => setKey(e.target.value)}
133
- />
134
- <Button
135
- loading={githubLoading}
136
- onClick={() => fetchInformation(repoName as `${string}/${string}`, key)}
137
- >
138
- Fetch information
139
- </Button>
140
- </div>
141
- </div>
142
- )}
143
- {error && <div className="text-sm text-red-600">{error}</div>}
144
- <div>
145
- <div className="rounded-lg overflow-hidden">
146
- {/* You can find the scene code inside revideo/src/scenes/example.tsx */}
147
- <Player
148
- src="http://localhost:4000/player/"
149
- controls={true}
150
- variables={{
151
- data: stargazerTimes.length > 0 ? stargazerTimes : undefined,
152
- repoName: repoName ? repoName : undefined,
153
- repoImage: repoImage ? repoImage : undefined,
154
- }}
155
- />
156
- </div>
157
- </div>
158
- <div className="flex gap-x-4">
159
- {/* Progress bar */}
160
- <div className="text-sm flex-1 bg-gray-100 rounded-md overflow-hidden">
161
- <div
162
- className="text-gray-600 bg-gray-400 h-full flex items-center px-4 transition-all transition-200"
163
- style={{
164
- width: `${Math.round(progress * 100)}%`,
165
- }}
166
- >
167
- {Math.round(progress * 100)}%
168
- </div>
169
- </div>
170
- {downloadUrl ? (
171
- <a
172
- href={downloadUrl}
173
- download
174
- className="text-sm flex items-center gap-x-2 rounded-md p-2 bg-green-200 text-gray-700 hover:bg-gray-300"
175
- >
176
- Download video
177
- </a>
178
- ) : (
179
- <Button onClick={() => render()} loading={renderLoading}>
180
- Render video
181
- </Button>
182
- )}
183
- </div>
184
- </div>
185
- </>
186
- );
187
- }
@@ -1,4 +0,0 @@
1
- /** @type {import('next').NextConfig} */
2
- const nextConfig = {};
3
-
4
- export default nextConfig;
@@ -1,34 +0,0 @@
1
- {
2
- "name": "next",
3
- "version": "0.1.0",
4
- "private": true,
5
- "scripts": {
6
- "dev": "next dev",
7
- "build": "next build",
8
- "start": "next start",
9
- "lint": "next lint"
10
- },
11
- "dependencies": {
12
- "@radix-ui/react-navigation-menu": "^1.1.4",
13
- "@revideo/player-react": "0.5.7",
14
- "class-variance-authority": "^0.7.0",
15
- "lucide-react": "^0.378.0",
16
- "next": "14.2.3",
17
- "p-limit": "^3",
18
- "react": "^18",
19
- "react-dom": "^18",
20
- "tailwind-merge": "^2.3.0",
21
- "tailwindcss-animate": "^1.0.7"
22
- },
23
- "devDependencies": {
24
- "@types/node": "^20",
25
- "@types/react": "^18",
26
- "@types/react-dom": "^18",
27
- "autoprefixer": "^10.4.19",
28
- "eslint": "^8",
29
- "eslint-config-next": "14.2.3",
30
- "postcss": "^8",
31
- "tailwindcss": "^3.4.3",
32
- "typescript": "^5"
33
- }
34
- }
@@ -1,6 +0,0 @@
1
- module.exports = {
2
- plugins: {
3
- tailwindcss: {},
4
- autoprefixer: {},
5
- },
6
- };
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 283 64"><path fill="black" d="M141 16c-11 0-19 7-19 18s9 18 20 18c7 0 13-3 16-7l-7-5c-2 3-6 4-9 4-5 0-9-3-10-7h28v-3c0-11-8-18-19-18zm-9 15c1-4 4-7 9-7s8 3 9 7h-18zm117-15c-11 0-19 7-19 18s9 18 20 18c6 0 12-3 16-7l-8-5c-2 3-5 4-8 4-5 0-9-3-11-7h28l1-3c0-11-8-18-19-18zm-10 15c2-4 5-7 10-7s8 3 9 7h-19zm-39 3c0 6 4 10 10 10 4 0 7-2 9-5l8 5c-3 5-9 8-17 8-11 0-19-7-19-18s8-18 19-18c8 0 14 3 17 8l-8 5c-2-3-5-5-9-5-6 0-10 4-10 10zm83-29v46h-9V5h9zM37 0l37 64H0L37 0zm92 5-27 48L74 5h10l18 30 17-30h10zm59 12v10l-3-1c-6 0-10 4-10 10v15h-9V17h9v9c0-5 6-9 13-9z"/></svg>
@@ -1,30 +0,0 @@
1
- /* eslint-disable naming-convention */
2
- import type {Config} from 'tailwindcss';
3
-
4
- const config: Config = {
5
- content: [
6
- './pages/**/*.{js,ts,jsx,tsx,mdx}',
7
- './components/**/*.{js,ts,jsx,tsx,mdx}',
8
- './app/**/*.{js,ts,jsx,tsx,mdx}',
9
- ],
10
- theme: {
11
- extend: {
12
- colors: {
13
- gray: {
14
- 50: '#FAFAFA',
15
- 100: '#F3F3F3',
16
- 200: '#E5E5E5',
17
- 300: '#C7C7C7',
18
- 400: '#ACACAC',
19
- 500: '#808080',
20
- 600: '#5F5F5F',
21
- 700: '#4E4E4E',
22
- 800: '#373737',
23
- 900: '#2A2A2A',
24
- 950: '#151515',
25
- },
26
- },
27
- },
28
- },
29
- };
30
- export default config;
@@ -1,26 +0,0 @@
1
- {
2
- "compilerOptions": {
3
- "lib": ["dom", "dom.iterable", "esnext"],
4
- "allowJs": true,
5
- "skipLibCheck": true,
6
- "strict": true,
7
- "noEmit": true,
8
- "esModuleInterop": true,
9
- "module": "esnext",
10
- "moduleResolution": "bundler",
11
- "resolveJsonModule": true,
12
- "isolatedModules": true,
13
- "jsx": "preserve",
14
- "incremental": true,
15
- "plugins": [
16
- {
17
- "name": "next"
18
- }
19
- ],
20
- "paths": {
21
- "@/*": ["./*"]
22
- }
23
- },
24
- "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
25
- "exclude": ["node_modules"]
26
- }
@@ -1,35 +0,0 @@
1
- export async function parseStream(
2
- reader: ReadableStreamDefaultReader<Uint8Array>,
3
- updateProgress: (progress: number) => void,
4
- ) {
5
- while (true) {
6
- const {done, value} = await reader.read();
7
-
8
- const decoded = new TextDecoder('utf-8').decode(value);
9
- const split = decoded.split('\n');
10
-
11
- if (done) {
12
- break;
13
- }
14
-
15
- const event = split[0].slice(6).trim();
16
- const data = split[1].slice(6).trim();
17
-
18
- if (event === 'progress') {
19
- const parsed = JSON.parse(data);
20
- updateProgress(parsed.progress);
21
- }
22
-
23
- if (event === 'completed') {
24
- const parsed = JSON.parse(data);
25
- return parsed.downloadLink as string;
26
- }
27
-
28
- if (event === 'error') {
29
- console.error(data);
30
- break;
31
- }
32
- }
33
-
34
- return '';
35
- }
@@ -1,24 +0,0 @@
1
- {
2
- "name": "revideo",
3
- "private": true,
4
- "version": "0.0.0",
5
- "scripts": {
6
- "start": "vite",
7
- "serve": "vite",
8
- "build": "tsc && vite build",
9
- "render": "tsc && node dist/render.js"
10
- },
11
- "dependencies": {
12
- "@revideo/core": "0.5.7",
13
- "@revideo/2d": "0.5.7",
14
- "@revideo/renderer": "0.5.7",
15
- "@revideo/vite-plugin": "0.5.7",
16
- "@revideo/ffmpeg": "0.5.7"
17
- },
18
- "devDependencies": {
19
- "@revideo/ui": "0.5.7",
20
- "@revideo/cli": "0.5.7",
21
- "typescript": "^5.2.2",
22
- "vite": "^4.5"
23
- }
24
- }
@@ -1 +0,0 @@
1
- @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
@@ -1,27 +0,0 @@
1
- {
2
- "version": 0,
3
- "shared": {
4
- "background": null,
5
- "range": [
6
- 0,
7
- null
8
- ],
9
- "size": {
10
- "x": 1920,
11
- "y": 1080
12
- },
13
- "audioOffset": 0
14
- },
15
- "preview": {
16
- "fps": 30,
17
- "resolutionScale": 1
18
- },
19
- "rendering": {
20
- "fps": 30,
21
- "resolutionScale": 1,
22
- "colorSpace": "srgb",
23
- "exporter": {
24
- "name": "@revideo/core/wasm"
25
- }
26
- }
27
- }
@@ -1,9 +0,0 @@
1
- import {makeProject} from '@revideo/core';
2
-
3
- import './global.css';
4
-
5
- import example from './scenes/example?scene';
6
-
7
- export default makeProject({
8
- scenes: [example],
9
- });
@@ -1,15 +0,0 @@
1
- import {renderVideo} from '@revideo/renderer';
2
-
3
- async function render() {
4
- console.log('Rendering video...');
5
-
6
- // This is the main function that renders the video
7
- const file = await renderVideo({
8
- projectFile: './src/project.ts',
9
- settings: { logProgress: true }
10
- });
11
-
12
- console.log(`Rendered video to ${file}`);
13
- }
14
-
15
- render();
@@ -1 +0,0 @@
1
- /// <reference types="@revideo/core/project" />
@@ -1,5 +0,0 @@
1
- {
2
- "version": 0,
3
- "timeEvents": [],
4
- "seed": 2330707904
5
- }
@@ -1,178 +0,0 @@
1
- import {Gradient, Img, Layout, Line, Rect, Spline, Txt, makeScene2D} from '@revideo/2d';
2
- import {all, createRef, useScene, Vector2, waitFor} from '@revideo/core';
3
-
4
- /**
5
- * Some example data to use in the scene when no data is provided
6
- */
7
- const exampleData = [
8
- 0, 105826000, 265664000, 265671000, 265684000, 265689000, 265694000, 335596000, 414108000,
9
- 416767000, 425249000, 674375000, 964912000, 1177339000, 1186686000, 1213498000, 1214781000,
10
- 1214895000, 1219921000, 1221668000, 1222281000, 1222410000, 1222433000, 1227527000, 1228300000,
11
- 1230497000, 1230501000, 1231234000, 1231239000, 1231314000, 1232727000, 1233520000, 1234669000,
12
- 1236349000, 1236806000, 1237795000, 1245092000, 1251533000, 1254263000, 1262147000, 1262899000,
13
- 1264370000, 1267519000, 1268870000, 1271198000, 1271847000, 1274347000, 1276515000, 1276671000,
14
- 1279966000, 1280551000, 1283338000, 1283777000, 1285088000, 1286336000, 1286728000, 1293071000,
15
- 1293863000, 1294963000, 1295005000, 1301398000, 1303551000, 1312541000, 1317615000, 1321096000,
16
- 1323718000, 1337789000, 1343521000, 1344711000, 1346543000, 1371003000, 1389862000, 1494428000,
17
- 1525657000, 1533978000, 1591597000, 1654009000, 1738062000, 1817754000, 1860276000, 1883450000,
18
- 1883998000, 1891635000, 1930667000, 2055652000, 2201181000, 2216214000, 2246708000, 2324529000,
19
- 2366960000, 2366996000, 2391904000, 2479357000, 2596772000, 2601046000, 2615944000, 2637502000,
20
- 2689660000, 2733368000, 2737046000, 2812890000, 2863564000, 2955232000, 2955857000, 2961163000,
21
- 2983003000, 2984020000, 2987437000, 2990281000, 2996230000, 3007072000, 3007175000, 3013062000,
22
- 3016417000, 3018616000, 3019154000, 3026357000, 3029804000, 3036897000, 3037202000, 3037298000,
23
- 3037737000, 3038639000, 3039016000, 3039322000, 3042145000, 3042529000, 3043490000, 3044558000,
24
- 3046472000, 3047534000, 3048199000, 3048524000, 3048862000, 3051935000, 3058895000, 3065009000,
25
- 3072790000, 3074109000, 3075041000, 3079153000, 3079875000, 3080083000, 3099026000, 3099874000,
26
- 3103039000, 3109664000, 3112885000, 3127743000, 3134934000, 3140075000, 3173641000, 3173788000,
27
- 3176205000, 3176720000, 3178996000, 3183882000, 3184287000, 3186716000, 3191153000, 3196320000,
28
- 3196620000, 3198638000, 3213076000, 3234269000, 3263068000, 3270668000, 3278896000, 3284646000,
29
- 3290556000, 3294331000, 3297742000, 3332896000, 3344044000, 3368767000, 3378844000, 3398863000,
30
- 3434188000, 3435264000, 3435696000, 3435803000, 3442071000, 3517995000, 3519849000, 3554474000,
31
- 3558289000, 3611948000, 3616675000, 3618144000, 3622775000, 3635577000, 3640600000, 3669592000,
32
- 3679346000, 3698749000, 3715355000, 3729047000, 3759434000, 3787838000, 3801028000, 3817911000,
33
- 3878742000, 3983973000, 4006119000, 4067980000, 4087451000, 4101992000, 4200703000, 4212009000,
34
- 4212143000, 4212882000, 4213748000, 4213977000, 4214180000, 4214445000, 4220193000, 4220422000,
35
- 4222468000, 4236874000, 4258899000, 4326288000, 4334389000, 4401276000, 4416803000, 4421444000,
36
- 4437462000, 4501703000, 4556531000, 4598409000, 4690540000, 4736772000, 4742561000, 4803793000,
37
- 4834054000, 4866127000, 4868886000, 4873958000, 4891455000, 4921352000, 4941837000, 4953890000,
38
- 4956018000, 4979428000, 4985123000, 5062420000, 5108308000, 5333539000, 5459835000, 5461002000,
39
- 5521826000, 5584695000, 5586217000, 5598497000, 5604962000, 5625413000, 5636146000, 5637453000,
40
- 5682023000, 5718405000, 5722303000, 5760543000, 5769209000, 5772790000, 5880569000, 6110458000,
41
- 6135651000, 6185575000, 6202790000, 6232205000, 6284650000, 6297771000, 6392835000, 6401789000,
42
- 6480914000, 6566872000, 6643031000, 6695443000, 6696088000, 6710689000, 6712966000, 6727715000,
43
- 6733098000, 6783253000, 6805478000, 6875821000, 6904033000, 6971558000, 6972735000,
44
- ];
45
-
46
- const exampleRepoName = 'redotvideo/revideo';
47
- const exampleRepoImage = 'https://avatars.githubusercontent.com/u/133898679';
48
-
49
- export default makeScene2D(function* (view) {
50
- // Get variables
51
- const repoName = useScene().variables.get('repoName', exampleRepoName);
52
- const repoImage = useScene().variables.get('repoImage', exampleRepoImage);
53
- const data = useScene().variables.get('data', exampleData);
54
-
55
- const max = Math.max(...data());
56
- const videoLength = 5; // seconds
57
- const totalValues = data().length;
58
-
59
- // Black background
60
- view.fill('#000000');
61
-
62
- // Calculate coordinates for each timestamp
63
- const linePoints = data().map((ms, i) => {
64
- const x = (ms / max) * view.width();
65
- const xShifted = x - view.width() / 2;
66
-
67
- const y = ((-i / totalValues) * view.height()) / 2;
68
- const yShifted = y + view.height() / 4;
69
-
70
- return new Vector2(xShifted, yShifted);
71
- });
72
-
73
- // Coordinates of the bottom corners
74
- const bottomCorners = [
75
- new Vector2(view.width() / 2, view.height() / 2),
76
- new Vector2(-view.width() / 2, view.height() / 2),
77
- ];
78
-
79
- // Background gradient
80
- const gradient = new Gradient({
81
- type: 'linear',
82
- from: [0, 0],
83
- to: [0, view.height()],
84
- stops: [
85
- {offset: 0, color: '#000000'},
86
- {offset: 1, color: 'green'},
87
- ],
88
- });
89
-
90
- // Refs, used to animate elements
91
- const outerLayoutRef = createRef<Layout>();
92
- const innerLayoutRef = createRef<Layout>();
93
- const rectRef = createRef<Rect>();
94
-
95
- // Add elements to the view
96
- yield view.add(
97
- <>
98
- <>
99
- <Line points={linePoints} lineWidth={30} stroke={'#3EAC45'} />
100
- <Spline points={[...linePoints, ...bottomCorners]} fill={gradient} />
101
- <Rect
102
- ref={rectRef}
103
- x={view.width() / 2}
104
- y={0}
105
- width={view.width() * 2}
106
- height={view.height()}
107
- fill={'#000000'}
108
- />
109
- </>
110
- <Layout
111
- ref={outerLayoutRef}
112
- layout
113
- alignItems={'center'}
114
- gap={40}
115
- x={-870}
116
- y={-400}
117
- offset={[-1, 0]}
118
- >
119
- <Img
120
- src={repoImage()}
121
- width={100}
122
- height={100}
123
- stroke={'#555555'}
124
- lineWidth={8}
125
- strokeFirst={true}
126
- radius={10}
127
- />
128
- <Layout ref={innerLayoutRef} direction={'column'}>
129
- <Txt
130
- fontFamily={'Roboto'}
131
- text={repoName()}
132
- fill={'#ffffff'}
133
- x={-520}
134
- y={-395}
135
- fontSize={50}
136
- fontWeight={600}
137
- />
138
- </Layout>
139
- </Layout>
140
- </>,
141
- );
142
-
143
- // Resize the rectangle to reveal the scene
144
- yield* rectRef().width(0, videoLength);
145
-
146
- // Make rectangle transparent and cover the scene again
147
- rectRef().fill('#00000000');
148
- rectRef().width(view.width() * 2);
149
-
150
- // Cover the scene while the Layout block
151
- // is centered
152
- yield* all(
153
- rectRef().fill('#000000', 2),
154
- outerLayoutRef().x(0, 2),
155
- outerLayoutRef().y(-50, 2),
156
- outerLayoutRef().offset([0, 0], 2),
157
- );
158
-
159
- // Add text with the total number of stars
160
- const starTextRef = createRef<Txt>();
161
- innerLayoutRef().add(
162
- <Txt
163
- fontFamily={'Roboto'}
164
- ref={starTextRef}
165
- text={`${totalValues} stars`}
166
- fill={'#000000'}
167
- x={0}
168
- y={0}
169
- fontSize={40}
170
- fontWeight={500}
171
- marginBottom={-45}
172
- />,
173
- );
174
- yield* all(starTextRef().fill('#ffffff', 2), starTextRef().margin(0, 2));
175
-
176
- // Wait for 2 seconds
177
- yield* waitFor(2);
178
- });
@@ -1,9 +0,0 @@
1
- {
2
- "extends": "@revideo/2d/tsconfig.project.json",
3
- "include": ["src"],
4
- "compilerOptions": {
5
- "noEmit": false,
6
- "outDir": "dist",
7
- "module": "CommonJS"
8
- }
9
- }
@@ -1,6 +0,0 @@
1
- import {defineConfig} from 'vite';
2
- import motionCanvas from '@revideo/vite-plugin';
3
-
4
- export default defineConfig({
5
- plugins: [motionCanvas()],
6
- });
@@ -1,7 +0,0 @@
1
- # Stitching Together Videos
2
-
3
- This is a very simple example demonstrating how you can stitch together multiple videos into one. It also includes a transition animation between the videos.
4
-
5
-
6
- https://github.com/redotvideo/revideo-examples/assets/122226645/6ec23514-e699-4a17-a9a5-02e7e14b207e
7
-