1 | "use strict";
|
2 | Object.defineProperty(exports, "__esModule", { value: true });
|
3 | exports.OffthreadVideoForRendering = void 0;
|
4 | const jsx_runtime_1 = require("react/jsx-runtime");
|
5 | const react_1 = require("react");
|
6 | const absolute_src_1 = require("../absolute-src");
|
7 | const use_audio_frame_1 = require("../audio/use-audio-frame");
|
8 | const CompositionManager_1 = require("../CompositionManager");
|
9 | const Img_1 = require("../Img");
|
10 | const random_1 = require("../random");
|
11 | const sequencing_1 = require("../sequencing");
|
12 | const use_frame_1 = require("../use-frame");
|
13 | const use_unsafe_video_config_1 = require("../use-unsafe-video-config");
|
14 | const volume_prop_1 = require("../volume-prop");
|
15 | const get_current_time_1 = require("./get-current-time");
|
16 | const OffthreadVideoForRendering = ({ onError, volume: volumeProp, playbackRate, src, muted, ...props }) => {
|
17 | const absoluteFrame = (0, use_frame_1.useAbsoluteCurrentFrame)();
|
18 | const frame = (0, use_frame_1.useCurrentFrame)();
|
19 | const volumePropsFrame = (0, use_audio_frame_1.useFrameForVolumeProp)();
|
20 | const videoConfig = (0, use_unsafe_video_config_1.useUnsafeVideoConfig)();
|
21 | const sequenceContext = (0, react_1.useContext)(sequencing_1.SequenceContext);
|
22 | const mediaStartsAt = (0, use_audio_frame_1.useMediaStartsAt)();
|
23 | const { registerAsset, unregisterAsset } = (0, react_1.useContext)(CompositionManager_1.CompositionManager);
|
24 | if (!src) {
|
25 | throw new TypeError('No `src` was passed to <OffthreadVideo>.');
|
26 | }
|
27 |
|
28 |
|
29 | const id = (0, react_1.useMemo)(() => `video-${(0, random_1.random)(src !== null && src !== void 0 ? src : '')}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.cumulatedFrom}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.durationInFrames}-muted:${muted}`, [
|
30 | src,
|
31 | muted,
|
32 | sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.cumulatedFrom,
|
33 | sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom,
|
34 | sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.durationInFrames,
|
35 | ]);
|
36 | if (!videoConfig) {
|
37 | throw new Error('No video config found');
|
38 | }
|
39 | const volume = (0, volume_prop_1.evaluateVolume)({
|
40 | volume: volumeProp,
|
41 | frame: volumePropsFrame,
|
42 | mediaVolume: 1,
|
43 | });
|
44 | (0, react_1.useEffect)(() => {
|
45 | if (!src) {
|
46 | throw new Error('No src passed');
|
47 | }
|
48 | if (muted) {
|
49 | return;
|
50 | }
|
51 | registerAsset({
|
52 | type: 'video',
|
53 | src: (0, absolute_src_1.getAbsoluteSrc)(src),
|
54 | id,
|
55 | frame: absoluteFrame,
|
56 | volume,
|
57 | mediaFrame: frame,
|
58 | playbackRate: playbackRate !== null && playbackRate !== void 0 ? playbackRate : 1,
|
59 | });
|
60 | return () => unregisterAsset(id);
|
61 | }, [
|
62 | muted,
|
63 | src,
|
64 | registerAsset,
|
65 | id,
|
66 | unregisterAsset,
|
67 | volume,
|
68 | frame,
|
69 | absoluteFrame,
|
70 | playbackRate,
|
71 | ]);
|
72 | const currentTime = (0, react_1.useMemo)(() => {
|
73 | return ((0, get_current_time_1.getExpectedMediaFrameUncorrected)({
|
74 | frame,
|
75 | playbackRate: playbackRate || 1,
|
76 | startFrom: -mediaStartsAt,
|
77 | }) / videoConfig.fps);
|
78 | }, [frame, mediaStartsAt, playbackRate, videoConfig.fps]);
|
79 | const actualSrc = (0, react_1.useMemo)(() => {
|
80 | return `http://localhost:${window.remotion_proxyPort}/proxy?src=${encodeURIComponent((0, absolute_src_1.getAbsoluteSrc)(src))}&time=${encodeURIComponent(currentTime)}`;
|
81 | }, [currentTime, src]);
|
82 | const onErr = (0, react_1.useCallback)((e) => {
|
83 | onError === null || onError === void 0 ? void 0 : onError(e);
|
84 | }, [onError]);
|
85 | return (0, jsx_runtime_1.jsx)(Img_1.Img, { src: actualSrc, ...props, onError: onErr }, void 0);
|
86 | };
|
87 | exports.OffthreadVideoForRendering = OffthreadVideoForRendering;
|