OffthreadVideo
Browse files
Remotion-app/src/HelloWorld/VideoStream.jsx
CHANGED
@@ -1,12 +1,12 @@
|
|
1 |
import {Series} from 'remotion';
|
2 |
import React from 'react';
|
3 |
-
import {Video, staticFile, useVideoConfig
|
4 |
import videoSequences from './Assets/VideoSequences.json';
|
5 |
import {TransitionSeries} from '@remotion/transitions';
|
6 |
export default function VideoStream() {
|
7 |
const {fps} = useVideoConfig();
|
8 |
return (
|
9 |
-
<
|
10 |
style={{
|
11 |
color: 'white',
|
12 |
position: 'absolute',
|
@@ -15,15 +15,15 @@ export default function VideoStream() {
|
|
15 |
>
|
16 |
{videoSequences.map((entry, index) => {
|
17 |
return (
|
18 |
-
<Sequence
|
19 |
key={index}
|
20 |
from={fps * entry.start}
|
21 |
durationInFrames={fps * (entry.end - entry.start)}
|
22 |
>
|
23 |
-
<
|
24 |
-
</Sequence>
|
25 |
);
|
26 |
})}
|
27 |
-
</
|
28 |
);
|
29 |
}
|
|
|
1 |
import {Series} from 'remotion';
|
2 |
import React from 'react';
|
3 |
+
import {Video, OffthreadVideo, staticFile, useVideoConfig} from 'remotion';
|
4 |
import videoSequences from './Assets/VideoSequences.json';
|
5 |
import {TransitionSeries} from '@remotion/transitions';
|
6 |
export default function VideoStream() {
|
7 |
const {fps} = useVideoConfig();
|
8 |
return (
|
9 |
+
<TransitionSeries
|
10 |
style={{
|
11 |
color: 'white',
|
12 |
position: 'absolute',
|
|
|
15 |
>
|
16 |
{videoSequences.map((entry, index) => {
|
17 |
return (
|
18 |
+
<TransitionSeries.Sequence
|
19 |
key={index}
|
20 |
from={fps * entry.start}
|
21 |
durationInFrames={fps * (entry.end - entry.start)}
|
22 |
>
|
23 |
+
<OffthreadVideo {...entry.props} src={staticFile(entry.name)} />
|
24 |
+
</TransitionSeries.Sequence>
|
25 |
);
|
26 |
})}
|
27 |
+
</TransitionSeries>
|
28 |
);
|
29 |
}
|