@remotion/player 3.0.0-lambda.25 → 3.0.0-lambda.250
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.
- package/dist/Player.d.ts +8 -1
- package/dist/Player.d.ts.map +1 -1
- package/dist/Player.js +23 -8
- package/dist/Player.js.map +1 -1
- package/dist/PlayerUI.d.ts +10 -0
- package/dist/PlayerUI.d.ts.map +1 -1
- package/dist/PlayerUI.js +23 -7
- package/dist/PlayerUI.js.map +1 -1
- package/dist/calculate-next-frame.d.ts +15 -0
- package/dist/calculate-next-frame.d.ts.map +1 -0
- package/dist/calculate-next-frame.js +29 -0
- package/dist/calculate-next-frame.js.map +1 -0
- package/dist/error-boundary.d.ts +7 -4
- package/dist/error-boundary.d.ts.map +1 -1
- package/dist/error-boundary.js +6 -4
- package/dist/error-boundary.js.map +1 -1
- package/dist/event-emitter.d.ts +7 -2
- package/dist/event-emitter.d.ts.map +1 -1
- package/dist/event-emitter.js +6 -0
- package/dist/event-emitter.js.map +1 -1
- package/dist/index.d.ts +6 -3
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js.map +1 -1
- package/dist/player-methods.d.ts +2 -1
- package/dist/player-methods.d.ts.map +1 -1
- package/dist/test/validate-prop.test.js +36 -6
- package/dist/test/validate-prop.test.js.map +1 -1
- package/dist/use-playback.d.ts +2 -1
- package/dist/use-playback.d.ts.map +1 -1
- package/dist/use-playback.js +32 -32
- package/dist/use-playback.js.map +1 -1
- package/dist/use-player.d.ts.map +1 -1
- package/dist/use-player.js +23 -6
- package/dist/use-player.js.map +1 -1
- package/dist/utils/validate-playbackrate.d.ts +2 -0
- package/dist/utils/validate-playbackrate.d.ts.map +1 -0
- package/dist/utils/validate-playbackrate.js +19 -0
- package/dist/utils/validate-playbackrate.js.map +1 -0
- package/package.json +4 -4
package/dist/Player.d.ts
CHANGED
|
@@ -1,11 +1,15 @@
|
|
|
1
1
|
import React, { MutableRefObject } from 'react';
|
|
2
2
|
import { CompProps } from 'remotion';
|
|
3
3
|
import { PlayerRef } from './player-methods';
|
|
4
|
+
import { RenderLoading } from './PlayerUI';
|
|
4
5
|
declare type PropsIfHasProps<Props> = {} extends Props ? {
|
|
5
6
|
inputProps?: Props;
|
|
6
7
|
} : {
|
|
7
8
|
inputProps: Props;
|
|
8
9
|
};
|
|
10
|
+
export declare type ErrorFallback = (info: {
|
|
11
|
+
error: Error;
|
|
12
|
+
}) => React.ReactNode;
|
|
9
13
|
export declare type PlayerProps<T> = {
|
|
10
14
|
durationInFrames: number;
|
|
11
15
|
compositionWidth: number;
|
|
@@ -13,6 +17,7 @@ export declare type PlayerProps<T> = {
|
|
|
13
17
|
fps: number;
|
|
14
18
|
showVolumeControls?: boolean;
|
|
15
19
|
controls?: boolean;
|
|
20
|
+
errorFallback?: ErrorFallback;
|
|
16
21
|
style?: React.CSSProperties;
|
|
17
22
|
loop?: boolean;
|
|
18
23
|
autoPlay?: boolean;
|
|
@@ -21,8 +26,10 @@ export declare type PlayerProps<T> = {
|
|
|
21
26
|
doubleClickToFullscreen?: boolean;
|
|
22
27
|
spaceKeyToPlayOrPause?: boolean;
|
|
23
28
|
numberOfSharedAudioTags?: number;
|
|
29
|
+
playbackRate?: number;
|
|
30
|
+
renderLoading?: RenderLoading;
|
|
24
31
|
} & PropsIfHasProps<T> & CompProps<T>;
|
|
25
|
-
export declare const PlayerFn: <T>({ durationInFrames, compositionHeight, compositionWidth, fps, inputProps, style, controls, loop, autoPlay, showVolumeControls, allowFullscreen, clickToPlay, doubleClickToFullscreen, spaceKeyToPlayOrPause, numberOfSharedAudioTags, ...componentProps }: PlayerProps<T>, ref: MutableRefObject<PlayerRef>) => JSX.Element;
|
|
32
|
+
export declare const PlayerFn: <T>({ durationInFrames, compositionHeight, compositionWidth, fps, inputProps, style, controls, loop, autoPlay, showVolumeControls, allowFullscreen, clickToPlay, doubleClickToFullscreen, spaceKeyToPlayOrPause, numberOfSharedAudioTags, errorFallback, playbackRate, renderLoading, ...componentProps }: PlayerProps<T>, ref: MutableRefObject<PlayerRef>) => JSX.Element;
|
|
26
33
|
declare module 'react' {
|
|
27
34
|
function forwardRef<T, P = {}>(render: (props: P, ref: React.MutableRefObject<T>) => React.ReactElement | null): (props: P & React.RefAttributes<T>) => React.ReactElement | null;
|
|
28
35
|
}
|
package/dist/Player.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Player.d.ts","sourceRoot":"","sources":["../src/Player.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAEb,gBAAgB,
|
|
1
|
+
{"version":3,"file":"Player.d.ts","sourceRoot":"","sources":["../src/Player.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAEb,gBAAgB,EAQhB,MAAM,OAAO,CAAC;AACf,OAAO,EAEN,SAAS,EAOT,MAAM,UAAU,CAAC;AAKlB,OAAO,EAAC,SAAS,EAAC,MAAM,kBAAkB,CAAC;AAC3C,OAAiB,EAAC,aAAa,EAAC,MAAM,YAAY,CAAC;AAInD,aAAK,eAAe,CAAC,KAAK,IAAI,EAAE,SAAS,KAAK,GAC3C;IACA,UAAU,CAAC,EAAE,KAAK,CAAC;CAClB,GACD;IACA,UAAU,EAAE,KAAK,CAAC;CACjB,CAAC;AAEL,oBAAY,aAAa,GAAG,CAAC,IAAI,EAAE;IAAC,KAAK,EAAE,KAAK,CAAA;CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;AAEtE,oBAAY,WAAW,CAAC,CAAC,IAAI;IAC5B,gBAAgB,EAAE,MAAM,CAAC;IACzB,gBAAgB,EAAE,MAAM,CAAC;IACzB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,GAAG,EAAE,MAAM,CAAC;IACZ,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,aAAa,CAAC;CAC9B,GAAG,eAAe,CAAC,CAAC,CAAC,GACrB,SAAS,CAAC,CAAC,CAAC,CAAC;AAOd,eAAO,MAAM,QAAQ,kUAsBf,iBAAiB,SAAS,CAAC,gBAqQhC,CAAC;AAEF,OAAO,QAAQ,OAAO,CAAC;IAEtB,SAAS,UAAU,CAAC,CAAC,EAAE,CAAC,GAAG,EAAE,EAC5B,MAAM,EAAE,CACP,KAAK,EAAE,CAAC,EACR,GAAG,EAAE,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,KAC1B,KAAK,CAAC,YAAY,GAAG,IAAI,GAC5B,CAAC,KAAK,EAAE,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;CACpE;AAED,eAAO,MAAM,MAAM,iEAHwB,kBAAkB,GAAG,IAGtB,CAAC"}
|
package/dist/Player.js
CHANGED
|
@@ -11,15 +11,17 @@ const emitter_context_1 = require("./emitter-context");
|
|
|
11
11
|
const event_emitter_1 = require("./event-emitter");
|
|
12
12
|
const player_css_classname_1 = require("./player-css-classname");
|
|
13
13
|
const PlayerUI_1 = __importDefault(require("./PlayerUI"));
|
|
14
|
+
const validate_playbackrate_1 = require("./utils/validate-playbackrate");
|
|
14
15
|
const volume_persistance_1 = require("./volume-persistance");
|
|
15
16
|
remotion_1.Internals.CSSUtils.injectCSS(remotion_1.Internals.CSSUtils.makeDefaultCSS(`.${player_css_classname_1.PLAYER_CSS_CLASSNAME}`));
|
|
16
17
|
// eslint-disable-next-line complexity
|
|
17
|
-
const PlayerFn = ({ durationInFrames, compositionHeight, compositionWidth, fps, inputProps, style, controls = false, loop = false, autoPlay = false, showVolumeControls = true, allowFullscreen = true, clickToPlay, doubleClickToFullscreen = false, spaceKeyToPlayOrPause = true, numberOfSharedAudioTags = 5, ...componentProps }, ref) => {
|
|
18
|
-
(
|
|
19
|
-
|
|
18
|
+
const PlayerFn = ({ durationInFrames, compositionHeight, compositionWidth, fps, inputProps, style, controls = false, loop = false, autoPlay = false, showVolumeControls = true, allowFullscreen = true, clickToPlay, doubleClickToFullscreen = false, spaceKeyToPlayOrPause = true, numberOfSharedAudioTags = 5, errorFallback = () => '⚠️', playbackRate = 1, renderLoading, ...componentProps }, ref) => {
|
|
19
|
+
if (typeof window !== 'undefined') {
|
|
20
|
+
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
21
|
+
(0, react_1.useLayoutEffect)(() => {
|
|
20
22
|
window.remotion_isPlayer = true;
|
|
21
|
-
}
|
|
22
|
-
}
|
|
23
|
+
}, []);
|
|
24
|
+
}
|
|
23
25
|
const component = remotion_1.Internals.useLazyComponent(componentProps);
|
|
24
26
|
const [frame, setFrame] = (0, react_1.useState)(0);
|
|
25
27
|
const [playing, setPlaying] = (0, react_1.useState)(false);
|
|
@@ -28,6 +30,8 @@ const PlayerFn = ({ durationInFrames, compositionHeight, compositionWidth, fps,
|
|
|
28
30
|
const rootRef = (0, react_1.useRef)(null);
|
|
29
31
|
const [mediaMuted, setMediaMuted] = (0, react_1.useState)(false);
|
|
30
32
|
const [mediaVolume, setMediaVolume] = (0, react_1.useState)((0, volume_persistance_1.getPreferredVolume)());
|
|
33
|
+
const audioAndVideoTags = (0, react_1.useRef)([]);
|
|
34
|
+
const imperativePlaying = (0, react_1.useRef)(false);
|
|
31
35
|
if (typeof compositionHeight !== 'number') {
|
|
32
36
|
throw new TypeError(`'compositionHeight' must be a number but got '${typeof compositionHeight}' instead`);
|
|
33
37
|
}
|
|
@@ -73,6 +77,10 @@ const PlayerFn = ({ durationInFrames, compositionHeight, compositionWidth, fps,
|
|
|
73
77
|
numberOfSharedAudioTags < 0) {
|
|
74
78
|
throw new TypeError(`'numberOfSharedAudioTags' must be an integer but got '${numberOfSharedAudioTags}' instead`);
|
|
75
79
|
}
|
|
80
|
+
(0, validate_playbackrate_1.validatePlaybackRate)(playbackRate);
|
|
81
|
+
(0, react_1.useEffect)(() => {
|
|
82
|
+
emitter.dispatchRatechange(playbackRate);
|
|
83
|
+
}, [emitter, playbackRate]);
|
|
76
84
|
const setMediaVolumeAndPersist = (0, react_1.useCallback)((vol) => {
|
|
77
85
|
setMediaVolume(vol);
|
|
78
86
|
(0, volume_persistance_1.persistVolume)(vol);
|
|
@@ -84,8 +92,14 @@ const PlayerFn = ({ durationInFrames, compositionHeight, compositionWidth, fps,
|
|
|
84
92
|
playing,
|
|
85
93
|
rootId,
|
|
86
94
|
shouldRegisterSequences: false,
|
|
95
|
+
playbackRate,
|
|
96
|
+
imperativePlaying,
|
|
97
|
+
setPlaybackRate: () => {
|
|
98
|
+
throw new Error('playback rate');
|
|
99
|
+
},
|
|
100
|
+
audioAndVideoTags,
|
|
87
101
|
};
|
|
88
|
-
}, [frame, playing, rootId]);
|
|
102
|
+
}, [frame, playbackRate, playing, rootId]);
|
|
89
103
|
const setTimelineContextValue = (0, react_1.useMemo)(() => {
|
|
90
104
|
return {
|
|
91
105
|
setFrame,
|
|
@@ -116,6 +130,7 @@ const PlayerFn = ({ durationInFrames, compositionHeight, compositionWidth, fps,
|
|
|
116
130
|
id: 'player-comp',
|
|
117
131
|
props: inputProps,
|
|
118
132
|
nonce: 777,
|
|
133
|
+
defaultProps: undefined,
|
|
119
134
|
},
|
|
120
135
|
],
|
|
121
136
|
currentComposition: 'player-comp',
|
|
@@ -140,9 +155,9 @@ const PlayerFn = ({ durationInFrames, compositionHeight, compositionWidth, fps,
|
|
|
140
155
|
const passedInputProps = (0, react_1.useMemo)(() => {
|
|
141
156
|
return inputProps !== null && inputProps !== void 0 ? inputProps : {};
|
|
142
157
|
}, [inputProps]);
|
|
143
|
-
return ((0, jsx_runtime_1.jsx)(remotion_1.Internals.Timeline.TimelineContext.Provider, Object.assign({ value: timelineContextValue }, { children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.Timeline.SetTimelineContext.Provider, Object.assign({ value: setTimelineContextValue }, { children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.CompositionManager.Provider, Object.assign({ value: compositionManagerContext }, { children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.MediaVolumeContext.Provider, Object.assign({ value: mediaVolumeContextValue }, { children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.SetMediaVolumeContext.Provider, Object.assign({ value: setMediaVolumeContextValue }, { children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.SharedAudioContextProvider, Object.assign({ numberOfAudioTags: numberOfSharedAudioTags }, { children: (0, jsx_runtime_1.jsx)(emitter_context_1.PlayerEventEmitterContext.Provider, Object.assign({ value: emitter }, { children: (0, jsx_runtime_1.jsx)(PlayerUI_1.default, { ref: rootRef, autoPlay: Boolean(autoPlay), loop: Boolean(loop), controls: Boolean(controls), style: style, inputProps: passedInputProps, allowFullscreen: Boolean(allowFullscreen), clickToPlay: typeof clickToPlay === 'boolean'
|
|
158
|
+
return ((0, jsx_runtime_1.jsx)(remotion_1.Internals.Timeline.TimelineContext.Provider, Object.assign({ value: timelineContextValue }, { children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.Timeline.SetTimelineContext.Provider, Object.assign({ value: setTimelineContextValue }, { children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.CompositionManager.Provider, Object.assign({ value: compositionManagerContext }, { children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.MediaVolumeContext.Provider, Object.assign({ value: mediaVolumeContextValue }, { children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.SetMediaVolumeContext.Provider, Object.assign({ value: setMediaVolumeContextValue }, { children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.SharedAudioContextProvider, Object.assign({ numberOfAudioTags: numberOfSharedAudioTags }, { children: (0, jsx_runtime_1.jsx)(emitter_context_1.PlayerEventEmitterContext.Provider, Object.assign({ value: emitter }, { children: (0, jsx_runtime_1.jsx)(PlayerUI_1.default, { ref: rootRef, renderLoading: renderLoading, autoPlay: Boolean(autoPlay), loop: Boolean(loop), controls: Boolean(controls), errorFallback: errorFallback, style: style, inputProps: passedInputProps, allowFullscreen: Boolean(allowFullscreen), clickToPlay: typeof clickToPlay === 'boolean'
|
|
144
159
|
? clickToPlay
|
|
145
|
-
: Boolean(controls), showVolumeControls: Boolean(showVolumeControls), setMediaVolume: setMediaVolumeAndPersist, mediaVolume: mediaVolume, mediaMuted: mediaMuted, doubleClickToFullscreen: Boolean(doubleClickToFullscreen), setMediaMuted: setMediaMuted, spaceKeyToPlayOrPause: Boolean(spaceKeyToPlayOrPause) }, void 0) }), void 0) }), void 0) }), void 0) }), void 0) }), void 0) }), void 0) }), void 0));
|
|
160
|
+
: Boolean(controls), showVolumeControls: Boolean(showVolumeControls), setMediaVolume: setMediaVolumeAndPersist, mediaVolume: mediaVolume, mediaMuted: mediaMuted, doubleClickToFullscreen: Boolean(doubleClickToFullscreen), setMediaMuted: setMediaMuted, spaceKeyToPlayOrPause: Boolean(spaceKeyToPlayOrPause), playbackRate: playbackRate }, void 0) }), void 0) }), void 0) }), void 0) }), void 0) }), void 0) }), void 0) }), void 0));
|
|
146
161
|
};
|
|
147
162
|
exports.PlayerFn = PlayerFn;
|
|
148
163
|
exports.Player = (0, react_1.forwardRef)(exports.PlayerFn);
|
package/dist/Player.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Player.js","sourceRoot":"","sources":["../src/Player.tsx"],"names":[],"mappings":";;;;;;;AAAA,
|
|
1
|
+
{"version":3,"file":"Player.js","sourceRoot":"","sources":["../src/Player.tsx"],"names":[],"mappings":"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"}
|
package/dist/PlayerUI.d.ts
CHANGED
|
@@ -1,5 +1,12 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { PlayerRef } from './player-methods';
|
|
3
|
+
export declare type ErrorFallback = (info: {
|
|
4
|
+
error: Error;
|
|
5
|
+
}) => React.ReactNode;
|
|
6
|
+
export declare type RenderLoading = (canvas: {
|
|
7
|
+
height: number;
|
|
8
|
+
width: number;
|
|
9
|
+
}) => React.ReactChild;
|
|
3
10
|
declare const _default: (props: {
|
|
4
11
|
controls: boolean;
|
|
5
12
|
loop: boolean;
|
|
@@ -15,6 +22,9 @@ declare const _default: (props: {
|
|
|
15
22
|
setMediaVolume: (v: number) => void;
|
|
16
23
|
setMediaMuted: (v: boolean) => void;
|
|
17
24
|
mediaVolume: number;
|
|
25
|
+
errorFallback: ErrorFallback;
|
|
26
|
+
playbackRate: number;
|
|
27
|
+
renderLoading?: RenderLoading | undefined;
|
|
18
28
|
} & {
|
|
19
29
|
children?: React.ReactNode;
|
|
20
30
|
} & React.RefAttributes<PlayerRef | null>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
package/dist/PlayerUI.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlayerUI.d.ts","sourceRoot":"","sources":["../src/PlayerUI.tsx"],"names":[],"mappings":"AACA,OAAO,KAWN,MAAM,OAAO,CAAC;AAKf,OAAO,EAAgB,SAAS,EAAC,MAAM,kBAAkB,CAAC
|
|
1
|
+
{"version":3,"file":"PlayerUI.d.ts","sourceRoot":"","sources":["../src/PlayerUI.tsx"],"names":[],"mappings":"AACA,OAAO,KAWN,MAAM,OAAO,CAAC;AAKf,OAAO,EAAgB,SAAS,EAAC,MAAM,kBAAkB,CAAC;AAW1D,oBAAY,aAAa,GAAG,CAAC,IAAI,EAAE;IAAC,KAAK,EAAE,KAAK,CAAA;CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;AACtE,oBAAY,aAAa,GAAG,CAAC,MAAM,EAAE;IACpC,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACd,KAAK,KAAK,CAAC,UAAU,CAAC;;;;;;;;;;;;;;;;;;;;;;AAgZvB,wBAAoC"}
|
package/dist/PlayerUI.js
CHANGED
|
@@ -15,8 +15,8 @@ const calculate_player_size_1 = require("./utils/calculate-player-size");
|
|
|
15
15
|
const is_node_1 = require("./utils/is-node");
|
|
16
16
|
const use_click_prevention_on_double_click_1 = require("./utils/use-click-prevention-on-double-click");
|
|
17
17
|
const use_element_size_1 = require("./utils/use-element-size");
|
|
18
|
-
const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps, clickToPlay, showVolumeControls, mediaVolume, mediaMuted, doubleClickToFullscreen, setMediaMuted, setMediaVolume, spaceKeyToPlayOrPause, }, ref) => {
|
|
19
|
-
var _a, _b;
|
|
18
|
+
const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps, clickToPlay, showVolumeControls, mediaVolume, mediaMuted, doubleClickToFullscreen, setMediaMuted, setMediaVolume, spaceKeyToPlayOrPause, errorFallback, playbackRate, renderLoading, }, ref) => {
|
|
19
|
+
var _a, _b, _c;
|
|
20
20
|
const config = remotion_1.Internals.useUnsafeVideoConfig();
|
|
21
21
|
const video = remotion_1.Internals.useVideo();
|
|
22
22
|
const container = (0, react_1.useRef)(null);
|
|
@@ -25,7 +25,7 @@ const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps
|
|
|
25
25
|
const [hasPausedToResume, setHasPausedToResume] = (0, react_1.useState)(false);
|
|
26
26
|
const [shouldAutoplay, setShouldAutoPlay] = (0, react_1.useState)(autoPlay);
|
|
27
27
|
const [isFullscreen, setIsFullscreen] = (0, react_1.useState)(() => false);
|
|
28
|
-
(0, use_playback_1.usePlayback)({ loop });
|
|
28
|
+
(0, use_playback_1.usePlayback)({ loop, playbackRate });
|
|
29
29
|
const player = (0, use_player_1.usePlayer)();
|
|
30
30
|
(0, react_1.useEffect)(() => {
|
|
31
31
|
if (hasPausedToResume && !player.playing) {
|
|
@@ -82,6 +82,7 @@ const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps
|
|
|
82
82
|
document.exitFullscreen();
|
|
83
83
|
}
|
|
84
84
|
}, []);
|
|
85
|
+
const durationInFrames = (_a = config === null || config === void 0 ? void 0 : config.durationInFrames) !== null && _a !== void 0 ? _a : 1;
|
|
85
86
|
(0, react_1.useImperativeHandle)(ref, () => {
|
|
86
87
|
const methods = {
|
|
87
88
|
play: player.play,
|
|
@@ -89,12 +90,19 @@ const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps
|
|
|
89
90
|
toggle,
|
|
90
91
|
getContainerNode: () => container.current,
|
|
91
92
|
getCurrentFrame: player.getCurrentFrame,
|
|
93
|
+
isPlaying: () => player.playing,
|
|
92
94
|
seekTo: (f) => {
|
|
95
|
+
const lastFrame = durationInFrames - 1;
|
|
96
|
+
const frameToSeekTo = Math.max(0, Math.min(lastFrame, f));
|
|
93
97
|
if (player.isPlaying()) {
|
|
94
|
-
|
|
98
|
+
const pauseToResume = frameToSeekTo !== lastFrame || loop;
|
|
99
|
+
setHasPausedToResume(pauseToResume);
|
|
95
100
|
player.pause();
|
|
96
101
|
}
|
|
97
|
-
|
|
102
|
+
if (frameToSeekTo === lastFrame && !loop) {
|
|
103
|
+
player.emitter.dispatchEnded();
|
|
104
|
+
}
|
|
105
|
+
player.seek(frameToSeekTo);
|
|
98
106
|
},
|
|
99
107
|
isFullscreen: () => isFullscreen,
|
|
100
108
|
requestFullscreen,
|
|
@@ -127,8 +135,10 @@ const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps
|
|
|
127
135
|
};
|
|
128
136
|
return Object.assign(player.emitter, methods);
|
|
129
137
|
}, [
|
|
138
|
+
durationInFrames,
|
|
130
139
|
exitFullscreen,
|
|
131
140
|
isFullscreen,
|
|
141
|
+
loop,
|
|
132
142
|
mediaMuted,
|
|
133
143
|
mediaVolume,
|
|
134
144
|
player,
|
|
@@ -237,12 +247,18 @@ const PlayerUI = ({ controls, style, loop, autoPlay, allowFullscreen, inputProps
|
|
|
237
247
|
if (!config) {
|
|
238
248
|
return null;
|
|
239
249
|
}
|
|
240
|
-
const content = ((0, jsx_runtime_1.jsxs)(
|
|
250
|
+
const content = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ style: outer, onClick: clickToPlay ? handleClick : undefined, onDoubleClick: doubleClickToFullscreen ? handleDoubleClick : undefined }, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ style: containerStyle, className: player_css_classname_1.PLAYER_CSS_CLASSNAME }, { children: VideoComponent ? ((0, jsx_runtime_1.jsx)(error_boundary_1.ErrorBoundary, Object.assign({ onError: onError, errorFallback: errorFallback }, { children: (0, jsx_runtime_1.jsx)(VideoComponent, Object.assign({}, ((_b = video === null || video === void 0 ? void 0 : video.defaultProps) !== null && _b !== void 0 ? _b : {}), ((_c = inputProps) !== null && _c !== void 0 ? _c : {})), void 0) }), void 0)) : null }), void 0) }), void 0), controls ? ((0, jsx_runtime_1.jsx)(PlayerControls_1.Controls, { fps: config.fps, durationInFrames: config.durationInFrames, hovered: hovered, player: player, onFullscreenButtonClick: onFullscreenButtonClick, isFullscreen: isFullscreen, allowFullscreen: allowFullscreen, showVolumeControls: showVolumeControls, onExitFullscreenButtonClick: onExitFullscreenButtonClick, spaceKeyToPlayOrPause: spaceKeyToPlayOrPause }, void 0)) : null] }, void 0));
|
|
241
251
|
// Don't render suspense on Node.js
|
|
242
252
|
if (is_node_1.IS_NODE) {
|
|
243
253
|
return content;
|
|
244
254
|
}
|
|
245
|
-
|
|
255
|
+
const loadingMarkup = renderLoading
|
|
256
|
+
? renderLoading({
|
|
257
|
+
height: outerStyle.height,
|
|
258
|
+
width: outerStyle.width,
|
|
259
|
+
})
|
|
260
|
+
: null;
|
|
261
|
+
return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: container, style: outerStyle }, { children: (0, jsx_runtime_1.jsx)(react_1.Suspense, Object.assign({ fallback: loadingMarkup }, { children: content }), void 0) }), void 0));
|
|
246
262
|
};
|
|
247
263
|
exports.default = (0, react_1.forwardRef)(PlayerUI);
|
|
248
264
|
//# sourceMappingURL=PlayerUI.js.map
|
package/dist/PlayerUI.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlayerUI.js","sourceRoot":"","sources":["../src/PlayerUI.tsx"],"names":[],"mappings":";;;AACA,iCAWe;AACf,uCAAmC;AACnC,uDAAiD;AACjD,qDAA+C;AAC/C,iEAA4D;AAE5D,qDAA0C;AAC1C,uDAAgD;AAChD,iDAA2C;AAC3C,6CAAuC;AACvC,qFAA8E;AAC9E,yEAAkE;AAClE,6CAAwC;AACxC,uGAA6F;AAC7F,+DAAwD;
|
|
1
|
+
{"version":3,"file":"PlayerUI.js","sourceRoot":"","sources":["../src/PlayerUI.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
export declare const calculateNextFrame: ({ time, currentFrame: startFrame, playbackSpeed, fps, actualLastFrame, actualFirstFrame, framesAdvanced, shouldLoop, }: {
|
|
2
|
+
time: number;
|
|
3
|
+
currentFrame: number;
|
|
4
|
+
playbackSpeed: number;
|
|
5
|
+
fps: number;
|
|
6
|
+
actualFirstFrame: number;
|
|
7
|
+
actualLastFrame: number;
|
|
8
|
+
framesAdvanced: number;
|
|
9
|
+
shouldLoop: boolean;
|
|
10
|
+
}) => {
|
|
11
|
+
nextFrame: number;
|
|
12
|
+
framesToAdvance: number;
|
|
13
|
+
hasEnded: boolean;
|
|
14
|
+
};
|
|
15
|
+
//# sourceMappingURL=calculate-next-frame.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"calculate-next-frame.d.ts","sourceRoot":"","sources":["../src/calculate-next-frame.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,kBAAkB;UAUxB,MAAM;kBACE,MAAM;mBACL,MAAM;SAChB,MAAM;sBACO,MAAM;qBACP,MAAM;oBACP,MAAM;gBACV,OAAO;;eACJ,MAAM;qBAAmB,MAAM;cAAY,OAAO;CA+BjE,CAAC"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.calculateNextFrame = void 0;
|
|
4
|
+
const calculateNextFrame = ({ time, currentFrame: startFrame, playbackSpeed, fps, actualLastFrame, actualFirstFrame, framesAdvanced, shouldLoop, }) => {
|
|
5
|
+
const op = playbackSpeed < 0 ? Math.ceil : Math.floor;
|
|
6
|
+
const framesToAdvance = op((time * playbackSpeed) / (1000 / fps)) - framesAdvanced;
|
|
7
|
+
const nextFrame = framesToAdvance + startFrame;
|
|
8
|
+
const isCurrentFrameOutside = startFrame > actualLastFrame || startFrame < actualFirstFrame;
|
|
9
|
+
const isNextFrameOutside = nextFrame > actualLastFrame || nextFrame < actualFirstFrame;
|
|
10
|
+
const hasEnded = !shouldLoop && isNextFrameOutside && !isCurrentFrameOutside;
|
|
11
|
+
if (playbackSpeed > 0) {
|
|
12
|
+
// Play forwards
|
|
13
|
+
if (isNextFrameOutside) {
|
|
14
|
+
return {
|
|
15
|
+
nextFrame: actualFirstFrame,
|
|
16
|
+
framesToAdvance,
|
|
17
|
+
hasEnded,
|
|
18
|
+
};
|
|
19
|
+
}
|
|
20
|
+
return { nextFrame, framesToAdvance, hasEnded };
|
|
21
|
+
}
|
|
22
|
+
// Reverse playback
|
|
23
|
+
if (isNextFrameOutside) {
|
|
24
|
+
return { nextFrame: actualLastFrame, framesToAdvance, hasEnded };
|
|
25
|
+
}
|
|
26
|
+
return { nextFrame, framesToAdvance, hasEnded };
|
|
27
|
+
};
|
|
28
|
+
exports.calculateNextFrame = calculateNextFrame;
|
|
29
|
+
//# sourceMappingURL=calculate-next-frame.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"calculate-next-frame.js","sourceRoot":"","sources":["../src/calculate-next-frame.ts"],"names":[],"mappings":";;;AAAO,MAAM,kBAAkB,GAAG,CAAC,EAClC,IAAI,EACJ,YAAY,EAAE,UAAU,EACxB,aAAa,EACb,GAAG,EACH,eAAe,EACf,gBAAgB,EAChB,cAAc,EACd,UAAU,GAUV,EAAmE,EAAE;IACrE,MAAM,EAAE,GAAG,aAAa,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;IACtD,MAAM,eAAe,GACpB,EAAE,CAAC,CAAC,IAAI,GAAG,aAAa,CAAC,GAAG,CAAC,IAAI,GAAG,GAAG,CAAC,CAAC,GAAG,cAAc,CAAC;IAE5D,MAAM,SAAS,GAAG,eAAe,GAAG,UAAU,CAAC;IAC/C,MAAM,qBAAqB,GAC1B,UAAU,GAAG,eAAe,IAAI,UAAU,GAAG,gBAAgB,CAAC;IAC/D,MAAM,kBAAkB,GACvB,SAAS,GAAG,eAAe,IAAI,SAAS,GAAG,gBAAgB,CAAC;IAE7D,MAAM,QAAQ,GAAG,CAAC,UAAU,IAAI,kBAAkB,IAAI,CAAC,qBAAqB,CAAC;IAC7E,IAAI,aAAa,GAAG,CAAC,EAAE;QACtB,gBAAgB;QAChB,IAAI,kBAAkB,EAAE;YACvB,OAAO;gBACN,SAAS,EAAE,gBAAgB;gBAC3B,eAAe;gBACf,QAAQ;aACR,CAAC;SACF;QAED,OAAO,EAAC,SAAS,EAAE,eAAe,EAAE,QAAQ,EAAC,CAAC;KAC9C;IAED,mBAAmB;IACnB,IAAI,kBAAkB,EAAE;QACvB,OAAO,EAAC,SAAS,EAAE,eAAe,EAAE,eAAe,EAAE,QAAQ,EAAC,CAAC;KAC/D;IAED,OAAO,EAAC,SAAS,EAAE,eAAe,EAAE,QAAQ,EAAC,CAAC;AAC/C,CAAC,CAAC;AAjDW,QAAA,kBAAkB,sBAiD7B"}
|
package/dist/error-boundary.d.ts
CHANGED
|
@@ -1,14 +1,17 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
export declare class ErrorBoundary extends React.Component<{
|
|
3
3
|
onError: (error: Error) => void;
|
|
4
|
+
errorFallback: (info: {
|
|
5
|
+
error: Error;
|
|
6
|
+
}) => React.ReactNode;
|
|
4
7
|
}, {
|
|
5
|
-
hasError:
|
|
8
|
+
hasError: Error | null;
|
|
6
9
|
}> {
|
|
7
10
|
state: {
|
|
8
|
-
hasError:
|
|
11
|
+
hasError: null;
|
|
9
12
|
};
|
|
10
|
-
static getDerivedStateFromError(): {
|
|
11
|
-
hasError:
|
|
13
|
+
static getDerivedStateFromError(error: Error): {
|
|
14
|
+
hasError: Error;
|
|
12
15
|
};
|
|
13
16
|
componentDidCatch(error: Error): void;
|
|
14
17
|
render(): React.ReactNode;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"error-boundary.d.ts","sourceRoot":"","sources":["../src/error-boundary.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,qBAAa,aAAc,SAAQ,KAAK,CAAC,SAAS,CACjD;IACC,OAAO,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"error-boundary.d.ts","sourceRoot":"","sources":["../src/error-boundary.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,qBAAa,aAAc,SAAQ,KAAK,CAAC,SAAS,CACjD;IACC,OAAO,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IAChC,aAAa,EAAE,CAAC,IAAI,EAAE;QAAC,KAAK,EAAE,KAAK,CAAA;KAAC,KAAK,KAAK,CAAC,SAAS,CAAC;CACzD,EACD;IAAC,QAAQ,EAAE,KAAK,GAAG,IAAI,CAAA;CAAC,CACxB;IACA,KAAK;;MAAoB;IACzB,MAAM,CAAC,wBAAwB,CAAC,KAAK,EAAE,KAAK;;;IAK5C,iBAAiB,CAAC,KAAK,EAAE,KAAK;IAI9B,MAAM;CAcN"}
|
package/dist/error-boundary.js
CHANGED
|
@@ -17,11 +17,11 @@ const errorStyle = {
|
|
|
17
17
|
class ErrorBoundary extends react_1.default.Component {
|
|
18
18
|
constructor() {
|
|
19
19
|
super(...arguments);
|
|
20
|
-
this.state = { hasError:
|
|
20
|
+
this.state = { hasError: null };
|
|
21
21
|
}
|
|
22
|
-
static getDerivedStateFromError() {
|
|
22
|
+
static getDerivedStateFromError(error) {
|
|
23
23
|
// Update state so the next render will show the fallback UI.
|
|
24
|
-
return { hasError:
|
|
24
|
+
return { hasError: error };
|
|
25
25
|
}
|
|
26
26
|
componentDidCatch(error) {
|
|
27
27
|
this.props.onError(error);
|
|
@@ -29,7 +29,9 @@ class ErrorBoundary extends react_1.default.Component {
|
|
|
29
29
|
render() {
|
|
30
30
|
if (this.state.hasError) {
|
|
31
31
|
// You can render any custom fallback UI
|
|
32
|
-
return (0, jsx_runtime_1.jsx)("div", Object.assign({ style: errorStyle }, { children:
|
|
32
|
+
return ((0, jsx_runtime_1.jsx)("div", Object.assign({ style: errorStyle }, { children: this.props.errorFallback({
|
|
33
|
+
error: this.state.hasError,
|
|
34
|
+
}) }), void 0));
|
|
33
35
|
}
|
|
34
36
|
return this.props.children;
|
|
35
37
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"error-boundary.js","sourceRoot":"","sources":["../src/error-boundary.tsx"],"names":[],"mappings":";;;;;;;AAAA,kDAA0B;AAE1B,MAAM,UAAU,GAAwB;IACvC,OAAO,EAAE,MAAM;IACf,cAAc,EAAE,QAAQ;IACxB,UAAU,EAAE,QAAQ;IACpB,IAAI,EAAE,CAAC;IACP,MAAM,EAAE,MAAM;IACd,KAAK,EAAE,MAAM;CACb,CAAC;AAEF,MAAa,aAAc,SAAQ,eAAK,CAAC,
|
|
1
|
+
{"version":3,"file":"error-boundary.js","sourceRoot":"","sources":["../src/error-boundary.tsx"],"names":[],"mappings":";;;;;;;AAAA,kDAA0B;AAE1B,MAAM,UAAU,GAAwB;IACvC,OAAO,EAAE,MAAM;IACf,cAAc,EAAE,QAAQ;IACxB,UAAU,EAAE,QAAQ;IACpB,IAAI,EAAE,CAAC;IACP,MAAM,EAAE,MAAM;IACd,KAAK,EAAE,MAAM;CACb,CAAC;AAEF,MAAa,aAAc,SAAQ,eAAK,CAAC,SAMxC;IAND;;QAOC,UAAK,GAAG,EAAC,QAAQ,EAAE,IAAI,EAAC,CAAC;IAwB1B,CAAC;IAvBA,MAAM,CAAC,wBAAwB,CAAC,KAAY;QAC3C,6DAA6D;QAC7D,OAAO,EAAC,QAAQ,EAAE,KAAK,EAAC,CAAC;IAC1B,CAAC;IAED,iBAAiB,CAAC,KAAY;QAC7B,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAC3B,CAAC;IAED,MAAM;QACL,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;YACxB,wCAAwC;YACxC,OAAO,CACN,8CAAK,KAAK,EAAE,UAAU,gBACpB,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC;oBACzB,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ;iBAC1B,CAAC,YACG,CACN,CAAC;SACF;QAED,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC;IAC5B,CAAC;CACD;AA/BD,sCA+BC"}
|
package/dist/event-emitter.d.ts
CHANGED
|
@@ -7,16 +7,20 @@ declare type ErrorPayload = {
|
|
|
7
7
|
declare type TimeUpdateEventPayload = {
|
|
8
8
|
frame: number;
|
|
9
9
|
};
|
|
10
|
+
declare type RateChangeEventPayload = {
|
|
11
|
+
playbackRate: number;
|
|
12
|
+
};
|
|
10
13
|
declare type StateEventMap = {
|
|
11
14
|
seeked: SeekPayload;
|
|
12
15
|
pause: undefined;
|
|
13
16
|
play: undefined;
|
|
17
|
+
ratechange: RateChangeEventPayload;
|
|
14
18
|
ended: undefined;
|
|
15
19
|
error: ErrorPayload;
|
|
16
20
|
timeupdate: TimeUpdateEventPayload;
|
|
17
21
|
};
|
|
18
|
-
declare type EventTypes = keyof StateEventMap;
|
|
19
|
-
declare type CallbackListener<T extends EventTypes> = (data: {
|
|
22
|
+
export declare type EventTypes = keyof StateEventMap;
|
|
23
|
+
export declare type CallbackListener<T extends EventTypes> = (data: {
|
|
20
24
|
detail: StateEventMap[T];
|
|
21
25
|
}) => void;
|
|
22
26
|
declare type Listeners = {
|
|
@@ -31,6 +35,7 @@ export declare class PlayerEmitter {
|
|
|
31
35
|
dispatchPause(): void;
|
|
32
36
|
dispatchPlay(): void;
|
|
33
37
|
dispatchEnded(): void;
|
|
38
|
+
dispatchRatechange(playbackRate: number): void;
|
|
34
39
|
dispatchError(error: Error): void;
|
|
35
40
|
dispatchTimeUpdate(event: TimeUpdateEventPayload): void;
|
|
36
41
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"event-emitter.d.ts","sourceRoot":"","sources":["../src/event-emitter.ts"],"names":[],"mappings":"AAAA,aAAK,WAAW,GAAG;IAClB,KAAK,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,aAAK,YAAY,GAAG;IACnB,KAAK,EAAE,KAAK,CAAC;CACb,CAAC;AAEF,aAAK,sBAAsB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,aAAK,aAAa,GAAG;IACpB,MAAM,EAAE,WAAW,CAAC;IACpB,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,YAAY,CAAC;IACpB,UAAU,EAAE,sBAAsB,CAAC;CACnC,CAAC;AAEF,
|
|
1
|
+
{"version":3,"file":"event-emitter.d.ts","sourceRoot":"","sources":["../src/event-emitter.ts"],"names":[],"mappings":"AAAA,aAAK,WAAW,GAAG;IAClB,KAAK,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,aAAK,YAAY,GAAG;IACnB,KAAK,EAAE,KAAK,CAAC;CACb,CAAC;AAEF,aAAK,sBAAsB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,aAAK,sBAAsB,GAAG;IAC7B,YAAY,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,aAAK,aAAa,GAAG;IACpB,MAAM,EAAE,WAAW,CAAC;IACpB,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,EAAE,SAAS,CAAC;IAChB,UAAU,EAAE,sBAAsB,CAAC;IACnC,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,YAAY,CAAC;IACpB,UAAU,EAAE,sBAAsB,CAAC;CACnC,CAAC;AAEF,oBAAY,UAAU,GAAG,MAAM,aAAa,CAAC;AAE7C,oBAAY,gBAAgB,CAAC,CAAC,SAAS,UAAU,IAAI,CAAC,IAAI,EAAE;IAC3D,MAAM,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;CACzB,KAAK,IAAI,CAAC;AAEX,aAAK,SAAS,GAAG;KAAE,SAAS,IAAI,UAAU,GAAG,gBAAgB,CAAC,SAAS,CAAC,EAAE;CAAC,CAAC;AAE5E,qBAAa,aAAa;IACzB,SAAS,EAAE,SAAS,CAQlB;IAEF,gBAAgB,CAAC,CAAC,SAAS,UAAU,EACpC,IAAI,EAAE,CAAC,EACP,QAAQ,EAAE,gBAAgB,CAAC,CAAC,CAAC;IAK9B,mBAAmB,CAAC,CAAC,SAAS,UAAU,EACvC,IAAI,EAAE,CAAC,EACP,QAAQ,EAAE,gBAAgB,CAAC,CAAC,CAAC;IAO9B,OAAO,CAAC,aAAa;IAWrB,YAAY,CAAC,KAAK,EAAE,MAAM;IAM1B,aAAa;IAIb,YAAY;IAIZ,aAAa;IAIb,kBAAkB,CAAC,YAAY,EAAE,MAAM;IAMvC,aAAa,CAAC,KAAK,EAAE,KAAK;IAM1B,kBAAkB,CAAC,KAAK,EAAE,sBAAsB;CAGhD"}
|
package/dist/event-emitter.js
CHANGED
|
@@ -8,6 +8,7 @@ class PlayerEmitter {
|
|
|
8
8
|
error: [],
|
|
9
9
|
pause: [],
|
|
10
10
|
play: [],
|
|
11
|
+
ratechange: [],
|
|
11
12
|
seeked: [],
|
|
12
13
|
timeupdate: [],
|
|
13
14
|
};
|
|
@@ -37,6 +38,11 @@ class PlayerEmitter {
|
|
|
37
38
|
dispatchEnded() {
|
|
38
39
|
this.dispatchEvent('ended', undefined);
|
|
39
40
|
}
|
|
41
|
+
dispatchRatechange(playbackRate) {
|
|
42
|
+
this.dispatchEvent('ratechange', {
|
|
43
|
+
playbackRate,
|
|
44
|
+
});
|
|
45
|
+
}
|
|
40
46
|
dispatchError(error) {
|
|
41
47
|
this.dispatchEvent('error', {
|
|
42
48
|
error,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"event-emitter.js","sourceRoot":"","sources":["../src/event-emitter.ts"],"names":[],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"event-emitter.js","sourceRoot":"","sources":["../src/event-emitter.ts"],"names":[],"mappings":";;;AAkCA,MAAa,aAAa;IAA1B;QACC,cAAS,GAAc;YACtB,KAAK,EAAE,EAAE;YACT,KAAK,EAAE,EAAE;YACT,KAAK,EAAE,EAAE;YACT,IAAI,EAAE,EAAE;YACR,UAAU,EAAE,EAAE;YACd,MAAM,EAAE,EAAE;YACV,UAAU,EAAE,EAAE;SACd,CAAC;IA8DH,CAAC;IA5DA,gBAAgB,CACf,IAAO,EACP,QAA6B;QAE5B,IAAI,CAAC,SAAS,CAAC,IAAI,CAA2B,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IAChE,CAAC;IAED,mBAAmB,CAClB,IAAO,EACP,QAA6B;QAE7B,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,GACnB,IAAI,CAAC,SAAS,CAAC,IAAI,CACnB,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,QAAQ,CAAC,CAAC;IACjC,CAAC;IAEO,aAAa,CACpB,YAAe,EACf,OAAyB;QAExB,IAAI,CAAC,SAAS,CAAC,YAAY,CAA2B,CAAC,OAAO,CAC9D,CAAC,QAAQ,EAAE,EAAE;YACZ,QAAQ,CAAC,EAAC,MAAM,EAAE,OAAO,EAAC,CAAC,CAAC;QAC7B,CAAC,CACD,CAAC;IACH,CAAC;IAED,YAAY,CAAC,KAAa;QACzB,IAAI,CAAC,aAAa,CAAC,QAAQ,EAAE;YAC5B,KAAK;SACL,CAAC,CAAC;IACJ,CAAC;IAED,aAAa;QACZ,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;IACxC,CAAC;IAED,YAAY;QACX,IAAI,CAAC,aAAa,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IACvC,CAAC;IAED,aAAa;QACZ,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;IACxC,CAAC;IAED,kBAAkB,CAAC,YAAoB;QACtC,IAAI,CAAC,aAAa,CAAC,YAAY,EAAE;YAChC,YAAY;SACZ,CAAC,CAAC;IACJ,CAAC;IAED,aAAa,CAAC,KAAY;QACzB,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE;YAC3B,KAAK;SACL,CAAC,CAAC;IACJ,CAAC;IAED,kBAAkB,CAAC,KAA6B;QAC/C,IAAI,CAAC,aAAa,CAAC,YAAY,EAAE,KAAK,CAAC,CAAC;IACzC,CAAC;CACD;AAvED,sCAuEC"}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { PlayerEmitter } from './event-emitter';
|
|
3
|
-
export { Player } from './Player';
|
|
2
|
+
import { CallbackListener, EventTypes, PlayerEmitter } from './event-emitter';
|
|
3
|
+
export { Player, ErrorFallback } from './Player';
|
|
4
|
+
export type { RenderLoading } from './PlayerUI';
|
|
4
5
|
export { PlayerMethods, PlayerRef } from './player-methods';
|
|
5
6
|
export { PreviewSize } from './utils/preview-size';
|
|
6
7
|
export { Size } from './utils/use-element-size';
|
|
@@ -19,8 +20,9 @@ export declare const PlayerInternals: {
|
|
|
19
20
|
getCurrentFrame: () => number;
|
|
20
21
|
isPlaying: () => boolean;
|
|
21
22
|
};
|
|
22
|
-
usePlayback: ({ loop }: {
|
|
23
|
+
usePlayback: ({ loop, playbackRate, }: {
|
|
23
24
|
loop: boolean;
|
|
25
|
+
playbackRate: number;
|
|
24
26
|
}) => void;
|
|
25
27
|
useElementSize: (ref: import("react").RefObject<HTMLElement>, options: {
|
|
26
28
|
triggerOnWindowResize: boolean;
|
|
@@ -39,4 +41,5 @@ export declare const PlayerInternals: {
|
|
|
39
41
|
};
|
|
40
42
|
useHoverState: (ref: import("react").RefObject<HTMLDivElement>) => boolean;
|
|
41
43
|
};
|
|
44
|
+
export type { CallbackListener, EventTypes };
|
|
42
45
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAC,gBAAgB,EAAE,UAAU,EAAE,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAM5E,OAAO,EAAC,MAAM,EAAE,aAAa,EAAC,MAAM,UAAU,CAAC;AAC/C,YAAY,EAAC,aAAa,EAAC,MAAM,YAAY,CAAC;AAC9C,OAAO,EAAC,aAAa,EAAE,SAAS,EAAC,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAC,WAAW,EAAC,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAC,IAAI,EAAC,MAAM,0BAA0B,CAAC;AAE9C,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAQ3B,CAAC;AAEF,YAAY,EAAC,gBAAgB,EAAE,UAAU,EAAC,CAAC"}
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":";;;AAAA,uDAAiD;AACjD,uDAA4D;AAC5D,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":";;;AAAA,uDAAiD;AACjD,uDAA4D;AAC5D,mDAA4E;AAC5E,uDAAgD;AAChD,iDAA2C;AAC3C,6CAAuC;AACvC,+DAAwD;AAExD,mCAA+C;AAAvC,gGAAA,MAAM,OAAA;AAMD,QAAA,eAAe,GAAG;IAC9B,yBAAyB,EAAzB,2CAAyB;IACzB,aAAa,EAAb,6BAAa;IACb,SAAS,EAAT,sBAAS;IACT,WAAW,EAAX,0BAAW;IACX,cAAc,EAAd,iCAAc;IACd,cAAc,EAAd,gCAAc;IACd,aAAa,EAAb,+BAAa;CACb,CAAC"}
|
package/dist/player-methods.d.ts
CHANGED
|
@@ -3,7 +3,7 @@ import { PlayerEmitter } from './event-emitter';
|
|
|
3
3
|
export declare type PlayerMethods = {
|
|
4
4
|
play: (e?: SyntheticEvent) => void;
|
|
5
5
|
pause: () => void;
|
|
6
|
-
toggle: () => void;
|
|
6
|
+
toggle: (e?: SyntheticEvent) => void;
|
|
7
7
|
seekTo: (frame: number) => void;
|
|
8
8
|
getContainerNode: () => HTMLDivElement | null;
|
|
9
9
|
getCurrentFrame: () => number;
|
|
@@ -13,6 +13,7 @@ export declare type PlayerMethods = {
|
|
|
13
13
|
setVolume: (num: number) => void;
|
|
14
14
|
getVolume: () => number;
|
|
15
15
|
isMuted: () => boolean;
|
|
16
|
+
isPlaying: () => boolean;
|
|
16
17
|
mute: () => void;
|
|
17
18
|
unmute: () => void;
|
|
18
19
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"player-methods.d.ts","sourceRoot":"","sources":["../src/player-methods.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,cAAc,EAAC,MAAM,OAAO,CAAC;AACrC,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAE9C,oBAAY,aAAa,GAAG;IAC3B,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,cAAc,KAAK,IAAI,CAAC;IACnC,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,MAAM,EAAE,
|
|
1
|
+
{"version":3,"file":"player-methods.d.ts","sourceRoot":"","sources":["../src/player-methods.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,cAAc,EAAC,MAAM,OAAO,CAAC;AACrC,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAE9C,oBAAY,aAAa,GAAG;IAC3B,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,cAAc,KAAK,IAAI,CAAC;IACnC,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,cAAc,KAAK,IAAI,CAAC;IACrC,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,gBAAgB,EAAE,MAAM,cAAc,GAAG,IAAI,CAAC;IAC9C,eAAe,EAAE,MAAM,MAAM,CAAC;IAC9B,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,SAAS,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,SAAS,EAAE,MAAM,MAAM,CAAC;IACxB,OAAO,EAAE,MAAM,OAAO,CAAC;IACvB,SAAS,EAAE,MAAM,OAAO,CAAC;IACzB,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,MAAM,EAAE,MAAM,IAAI,CAAC;CACnB,CAAC;AAEF,oBAAY,SAAS,GAAG,aAAa,GAAG,aAAa,CAAC"}
|
|
@@ -9,7 +9,7 @@ test('no compositionWidth should give errors', () => {
|
|
|
9
9
|
// @ts-expect-error
|
|
10
10
|
, {
|
|
11
11
|
// @ts-expect-error
|
|
12
|
-
compositionWidth: null, compositionHeight: 400, fps: 30, durationInFrames: 500, component: test_utils_1.HelloWorld, controls: true, showVolumeControls: true }, void 0));
|
|
12
|
+
compositionWidth: null, errorFallback: () => 'something went wrong', compositionHeight: 400, fps: 30, durationInFrames: 500, component: test_utils_1.HelloWorld, controls: true, showVolumeControls: true }, void 0));
|
|
13
13
|
}
|
|
14
14
|
catch (e) {
|
|
15
15
|
expect(e.message).toMatch(/'compositionWidth' must be a number but got 'object' instead/);
|
|
@@ -17,7 +17,7 @@ test('no compositionWidth should give errors', () => {
|
|
|
17
17
|
});
|
|
18
18
|
test('no compositionHeight should give errors', () => {
|
|
19
19
|
try {
|
|
20
|
-
(0, test_utils_1.render)((0, jsx_runtime_1.jsx)(index_1.Player, { compositionWidth: 400,
|
|
20
|
+
(0, test_utils_1.render)((0, jsx_runtime_1.jsx)(index_1.Player, { compositionWidth: 400, errorFallback: () => 'something went wrong',
|
|
21
21
|
// @ts-expect-error
|
|
22
22
|
compositionHeight: undefined, fps: 30, durationInFrames: 500, component: test_utils_1.HelloWorld, controls: true, showVolumeControls: true }, void 0));
|
|
23
23
|
}
|
|
@@ -27,7 +27,7 @@ test('no compositionHeight should give errors', () => {
|
|
|
27
27
|
});
|
|
28
28
|
test('No fps should give errors', () => {
|
|
29
29
|
try {
|
|
30
|
-
(0, test_utils_1.render)((0, jsx_runtime_1.jsx)(index_1.Player, { compositionWidth: 500, compositionHeight: 400,
|
|
30
|
+
(0, test_utils_1.render)((0, jsx_runtime_1.jsx)(index_1.Player, { compositionWidth: 500, compositionHeight: 400, errorFallback: () => 'something went wrong',
|
|
31
31
|
// @ts-expect-error
|
|
32
32
|
fps: null, durationInFrames: 500, component: test_utils_1.HelloWorld, controls: true, showVolumeControls: true }, void 0));
|
|
33
33
|
}
|
|
@@ -35,7 +35,7 @@ test('No fps should give errors', () => {
|
|
|
35
35
|
expect(e.message).toMatch(/"fps" must be a number, but you passed a value of type object/);
|
|
36
36
|
}
|
|
37
37
|
try {
|
|
38
|
-
(0, test_utils_1.render)((0, jsx_runtime_1.jsx)(index_1.Player, { compositionWidth: 500, compositionHeight: 400,
|
|
38
|
+
(0, test_utils_1.render)((0, jsx_runtime_1.jsx)(index_1.Player, { compositionWidth: 500, compositionHeight: 400, errorFallback: () => 'something went wrong',
|
|
39
39
|
// @ts-expect-error
|
|
40
40
|
fps: undefined, durationInFrames: 500, component: test_utils_1.HelloWorld, controls: true, showVolumeControls: true }, void 0));
|
|
41
41
|
}
|
|
@@ -45,7 +45,7 @@ test('No fps should give errors', () => {
|
|
|
45
45
|
});
|
|
46
46
|
test('No durationInFrames should give errors', () => {
|
|
47
47
|
try {
|
|
48
|
-
(0, test_utils_1.render)((0, jsx_runtime_1.jsx)(index_1.Player, { compositionWidth: 500, compositionHeight: 400, fps: 30,
|
|
48
|
+
(0, test_utils_1.render)((0, jsx_runtime_1.jsx)(index_1.Player, { compositionWidth: 500, compositionHeight: 400, errorFallback: () => 'something went wrong', fps: 30,
|
|
49
49
|
// @ts-expect-error
|
|
50
50
|
durationInFrames: undefined, component: test_utils_1.HelloWorld, controls: true, showVolumeControls: true }, void 0));
|
|
51
51
|
}
|
|
@@ -53,6 +53,36 @@ test('No durationInFrames should give errors', () => {
|
|
|
53
53
|
expect(e.message).toMatch(/The "durationInFrames" prop of the <Player\/> component must be a number, but you passed a value of type undefined/);
|
|
54
54
|
}
|
|
55
55
|
});
|
|
56
|
+
test('Invalid playbackRate should give error', () => {
|
|
57
|
+
try {
|
|
58
|
+
(0, test_utils_1.render)((0, jsx_runtime_1.jsx)(index_1.Player, { compositionWidth: 500, compositionHeight: 400, fps: 30, durationInFrames: 500, component: test_utils_1.HelloWorld, controls: true, showVolumeControls: true, playbackRate: -5 }, void 0));
|
|
59
|
+
}
|
|
60
|
+
catch (e) {
|
|
61
|
+
expect(e.message).toMatch(/The lowest possible playback rate is -4. You passed: -5/);
|
|
62
|
+
}
|
|
63
|
+
});
|
|
64
|
+
test('playbackRate of 0 should not be possible', () => {
|
|
65
|
+
try {
|
|
66
|
+
(0, test_utils_1.render)((0, jsx_runtime_1.jsx)(index_1.Player, { compositionWidth: 500, compositionHeight: 400, fps: 30, durationInFrames: 500, component: test_utils_1.HelloWorld, controls: true, showVolumeControls: true, playbackRate: 0 }, void 0));
|
|
67
|
+
}
|
|
68
|
+
catch (e) {
|
|
69
|
+
expect(e.message).toMatch(/A playback rate of 0 is not supported./);
|
|
70
|
+
}
|
|
71
|
+
});
|
|
72
|
+
test('playbackRate of wrong type should not be possible', () => {
|
|
73
|
+
try {
|
|
74
|
+
(0, test_utils_1.render)((0, jsx_runtime_1.jsx)(index_1.Player, { compositionWidth: 500, compositionHeight: 400, fps: 30, durationInFrames: 500, component: test_utils_1.HelloWorld, controls: true, showVolumeControls: true,
|
|
75
|
+
// @ts-expect-error
|
|
76
|
+
playbackRate: 'hi' }, void 0));
|
|
77
|
+
}
|
|
78
|
+
catch (e) {
|
|
79
|
+
expect(e.message).toMatch(/A playback rate of 0 is not supported./);
|
|
80
|
+
}
|
|
81
|
+
});
|
|
82
|
+
test('playbackRate of undefined should be okay', () => {
|
|
83
|
+
(0, test_utils_1.render)((0, jsx_runtime_1.jsx)(index_1.Player, { compositionWidth: 500, compositionHeight: 400, fps: 30, durationInFrames: 500, component: test_utils_1.HelloWorld, controls: true, showVolumeControls: true }, void 0));
|
|
84
|
+
expect(true).toBe(true);
|
|
85
|
+
});
|
|
56
86
|
test.each([
|
|
57
87
|
['controls'],
|
|
58
88
|
['loop'],
|
|
@@ -65,7 +95,7 @@ test.each([
|
|
|
65
95
|
const props = {};
|
|
66
96
|
props[a] = 'hey';
|
|
67
97
|
try {
|
|
68
|
-
(0, test_utils_1.render)((0, jsx_runtime_1.jsx)(index_1.Player, Object.assign({ compositionWidth: 500, compositionHeight: 400, fps: 30, durationInFrames: 100, component: test_utils_1.HelloWorld }, props), void 0));
|
|
98
|
+
(0, test_utils_1.render)((0, jsx_runtime_1.jsx)(index_1.Player, Object.assign({ compositionWidth: 500, compositionHeight: 400, errorFallback: () => 'something went wrong', fps: 30, durationInFrames: 100, component: test_utils_1.HelloWorld }, props), void 0));
|
|
69
99
|
}
|
|
70
100
|
catch (e) {
|
|
71
101
|
expect(e.message).toMatch(`'${a}' must be a boolean or undefined but got 'string' instead`);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"validate-prop.test.js","sourceRoot":"","sources":["../../src/test/validate-prop.test.tsx"],"names":[],"mappings":";;;AAAA,oCAAgC;AAChC,6CAAgD;AAEhD,IAAI,CAAC,wCAAwC,EAAE,GAAG,EAAE;IACnD,IAAI;QACH,IAAA,mBAAM,EACL,uBAAC,cAAM;QACN,mBAAmB;;YAAnB,mBAAmB;YACnB,gBAAgB,EAAE,IAAI,EACtB,iBAAiB,EAAE,GAAG,EACtB,GAAG,EAAE,EAAE,EACP,gBAAgB,EAAE,GAAG,EACrB,SAAS,EAAE,uBAAU,EACrB,QAAQ,QACR,kBAAkB,iBACjB,CACF,CAAC;KACF;IAAC,OAAO,CAAC,EAAE;QACX,MAAM,CAAE,CAAW,CAAC,OAAO,CAAC,CAAC,OAAO,CACnC,8DAA8D,CAC9D,CAAC;KACF;AACF,CAAC,CAAC,CAAC;AAEH,IAAI,CAAC,yCAAyC,EAAE,GAAG,EAAE;IACpD,IAAI;QACH,IAAA,mBAAM,EACL,uBAAC,cAAM,IACN,gBAAgB,EAAE,GAAG;
|
|
1
|
+
{"version":3,"file":"validate-prop.test.js","sourceRoot":"","sources":["../../src/test/validate-prop.test.tsx"],"names":[],"mappings":"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"}
|
package/dist/use-playback.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-playback.d.ts","sourceRoot":"","sources":["../src/use-playback.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"use-playback.d.ts","sourceRoot":"","sources":["../src/use-playback.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,WAAW;UAIjB,OAAO;kBACC,MAAM;UAiGpB,CAAC"}
|
package/dist/use-playback.js
CHANGED
|
@@ -3,13 +3,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
exports.usePlayback = void 0;
|
|
4
4
|
const react_1 = require("react");
|
|
5
5
|
const remotion_1 = require("remotion");
|
|
6
|
+
const calculate_next_frame_1 = require("./calculate-next-frame");
|
|
6
7
|
const use_player_1 = require("./use-player");
|
|
7
|
-
const usePlayback = ({ loop }) => {
|
|
8
|
+
const usePlayback = ({ loop, playbackRate, }) => {
|
|
8
9
|
const frame = remotion_1.Internals.Timeline.useTimelinePosition();
|
|
9
10
|
const config = remotion_1.Internals.useUnsafeVideoConfig();
|
|
10
11
|
const { playing, pause, emitter } = (0, use_player_1.usePlayer)();
|
|
11
12
|
const setFrame = remotion_1.Internals.Timeline.useTimelineSetFrame();
|
|
12
|
-
const { inFrame, outFrame
|
|
13
|
+
const { inFrame, outFrame } = remotion_1.Internals.Timeline.useTimelineInOutFramePosition();
|
|
13
14
|
const frameRef = (0, react_1.useRef)(frame);
|
|
14
15
|
frameRef.current = frame;
|
|
15
16
|
const lastTimeUpdateEvent = (0, react_1.useRef)(null);
|
|
@@ -20,32 +21,10 @@ const usePlayback = ({ loop }) => {
|
|
|
20
21
|
if (!playing) {
|
|
21
22
|
return;
|
|
22
23
|
}
|
|
23
|
-
const getFrameInRange = (nextFrame) => {
|
|
24
|
-
if ((inFrame && nextFrame < inFrame) ||
|
|
25
|
-
(inFrame && outFrame && nextFrame > outFrame)) {
|
|
26
|
-
return inFrame;
|
|
27
|
-
}
|
|
28
|
-
if (outFrame && nextFrame > outFrame) {
|
|
29
|
-
return 0;
|
|
30
|
-
}
|
|
31
|
-
return nextFrame;
|
|
32
|
-
};
|
|
33
24
|
let hasBeenStopped = false;
|
|
34
25
|
let reqAnimFrameCall = null;
|
|
35
26
|
const startedTime = performance.now();
|
|
36
|
-
|
|
37
|
-
const durationInFrames = (() => {
|
|
38
|
-
if (inFrame !== null && outFrame !== null) {
|
|
39
|
-
return outFrame - inFrame + 1;
|
|
40
|
-
}
|
|
41
|
-
if (inFrame !== null) {
|
|
42
|
-
return config.durationInFrames - inFrame;
|
|
43
|
-
}
|
|
44
|
-
if (outFrame !== null) {
|
|
45
|
-
return outFrame + 1;
|
|
46
|
-
}
|
|
47
|
-
return config.durationInFrames;
|
|
48
|
-
})();
|
|
27
|
+
let framesAdvanced = 0;
|
|
49
28
|
const stop = () => {
|
|
50
29
|
hasBeenStopped = true;
|
|
51
30
|
if (reqAnimFrameCall !== null) {
|
|
@@ -54,17 +33,28 @@ const usePlayback = ({ loop }) => {
|
|
|
54
33
|
};
|
|
55
34
|
const callback = () => {
|
|
56
35
|
const time = performance.now() - startedTime;
|
|
57
|
-
const
|
|
58
|
-
|
|
36
|
+
const actualLastFrame = outFrame !== null && outFrame !== void 0 ? outFrame : config.durationInFrames - 1;
|
|
37
|
+
const actualFirstFrame = inFrame !== null && inFrame !== void 0 ? inFrame : 0;
|
|
38
|
+
const { nextFrame, framesToAdvance, hasEnded } = (0, calculate_next_frame_1.calculateNextFrame)({
|
|
39
|
+
time,
|
|
40
|
+
currentFrame: frameRef.current,
|
|
41
|
+
playbackSpeed: playbackRate,
|
|
42
|
+
fps: config.fps,
|
|
43
|
+
actualFirstFrame,
|
|
44
|
+
actualLastFrame,
|
|
45
|
+
framesAdvanced,
|
|
46
|
+
shouldLoop: loop,
|
|
47
|
+
});
|
|
48
|
+
framesAdvanced += framesToAdvance;
|
|
49
|
+
if (nextFrame !== frameRef.current) {
|
|
50
|
+
setFrame(nextFrame);
|
|
51
|
+
}
|
|
52
|
+
if (hasEnded) {
|
|
59
53
|
stop();
|
|
60
54
|
pause();
|
|
61
55
|
emitter.dispatchEnded();
|
|
62
56
|
return;
|
|
63
57
|
}
|
|
64
|
-
const actualNextFrame = (nextFrame % durationInFrames) + (inFrame !== null && inFrame !== void 0 ? inFrame : 0);
|
|
65
|
-
if (actualNextFrame !== frameRef.current) {
|
|
66
|
-
setFrame(actualNextFrame);
|
|
67
|
-
}
|
|
68
58
|
if (!hasBeenStopped) {
|
|
69
59
|
reqAnimFrameCall = requestAnimationFrame(callback);
|
|
70
60
|
}
|
|
@@ -73,7 +63,17 @@ const usePlayback = ({ loop }) => {
|
|
|
73
63
|
return () => {
|
|
74
64
|
stop();
|
|
75
65
|
};
|
|
76
|
-
}, [
|
|
66
|
+
}, [
|
|
67
|
+
config,
|
|
68
|
+
loop,
|
|
69
|
+
pause,
|
|
70
|
+
playing,
|
|
71
|
+
setFrame,
|
|
72
|
+
emitter,
|
|
73
|
+
playbackRate,
|
|
74
|
+
inFrame,
|
|
75
|
+
outFrame,
|
|
76
|
+
]);
|
|
77
77
|
(0, react_1.useEffect)(() => {
|
|
78
78
|
const interval = setInterval(() => {
|
|
79
79
|
if (lastTimeUpdateEvent.current === frameRef.current) {
|
package/dist/use-playback.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-playback.js","sourceRoot":"","sources":["../src/use-playback.ts"],"names":[],"mappings":";;;AAAA,iCAAwC;AACxC,uCAAmC;AACnC,6CAAuC;AAEhC,MAAM,WAAW,GAAG,CAAC,
|
|
1
|
+
{"version":3,"file":"use-playback.js","sourceRoot":"","sources":["../src/use-playback.ts"],"names":[],"mappings":"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"}
|
package/dist/use-player.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-player.d.ts","sourceRoot":"","sources":["../src/use-player.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,cAAc,EAA2C,MAAM,OAAO,CAAC;AAG/E,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAE9C,eAAO,MAAM,SAAS;wBACD,MAAM,KAAK,IAAI;2BACZ,MAAM,KAAK,IAAI;iBACzB,OAAO;aACX,aAAa;aACb,OAAO;8DACc,IAAI;WAC3B,MAAM,IAAI;qBACA,MAAM,KAAK,IAAI;qBACf,MAAM,MAAM;eAClB,MAAM,OAAO;
|
|
1
|
+
{"version":3,"file":"use-player.d.ts","sourceRoot":"","sources":["../src/use-player.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,cAAc,EAA2C,MAAM,OAAO,CAAC;AAG/E,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAE9C,eAAO,MAAM,SAAS;wBACD,MAAM,KAAK,IAAI;2BACZ,MAAM,KAAK,IAAI;iBACzB,OAAO;aACX,aAAa;aACb,OAAO;8DACc,IAAI;WAC3B,MAAM,IAAI;qBACA,MAAM,KAAK,IAAI;qBACf,MAAM,MAAM;eAClB,MAAM,OAAO;CA0IxB,CAAC"}
|
package/dist/use-player.js
CHANGED
|
@@ -6,12 +6,12 @@ const remotion_1 = require("remotion");
|
|
|
6
6
|
const emitter_context_1 = require("./emitter-context");
|
|
7
7
|
const usePlayer = () => {
|
|
8
8
|
var _a;
|
|
9
|
-
const [playing, setPlaying] = remotion_1.Internals.Timeline.usePlayingState();
|
|
10
|
-
const imperativePlaying = (0, react_1.useRef)(false);
|
|
9
|
+
const [playing, setPlaying, imperativePlaying] = remotion_1.Internals.Timeline.usePlayingState();
|
|
11
10
|
const frame = remotion_1.Internals.Timeline.useTimelinePosition();
|
|
12
11
|
const setFrame = remotion_1.Internals.Timeline.useTimelineSetFrame();
|
|
13
12
|
const setTimelinePosition = remotion_1.Internals.Timeline.useTimelineSetFrame();
|
|
14
13
|
const audioContext = (0, react_1.useContext)(remotion_1.Internals.SharedAudioContext);
|
|
14
|
+
const { audioAndVideoTags } = (0, react_1.useContext)(remotion_1.Internals.Timeline.TimelineContext);
|
|
15
15
|
const frameRef = (0, react_1.useRef)();
|
|
16
16
|
frameRef.current = frame;
|
|
17
17
|
const video = remotion_1.Internals.useVideo();
|
|
@@ -33,20 +33,36 @@ const usePlayer = () => {
|
|
|
33
33
|
if (isLastFrame) {
|
|
34
34
|
seek(0);
|
|
35
35
|
}
|
|
36
|
+
/**
|
|
37
|
+
* Play silent audio tags to warm them up for autoplay
|
|
38
|
+
*/
|
|
36
39
|
if (audioContext && audioContext.numberOfAudioTags > 0 && e) {
|
|
37
40
|
audioContext.playAllAudios();
|
|
38
41
|
}
|
|
42
|
+
/**
|
|
43
|
+
* Play audios and videos directly here so they can benefit from
|
|
44
|
+
* being triggered by a click
|
|
45
|
+
*/
|
|
46
|
+
audioAndVideoTags.current.forEach((a) => a.play());
|
|
39
47
|
imperativePlaying.current = true;
|
|
40
48
|
setPlaying(true);
|
|
41
49
|
emitter.dispatchPlay();
|
|
42
|
-
}, [
|
|
50
|
+
}, [
|
|
51
|
+
imperativePlaying,
|
|
52
|
+
isLastFrame,
|
|
53
|
+
audioContext,
|
|
54
|
+
setPlaying,
|
|
55
|
+
emitter,
|
|
56
|
+
seek,
|
|
57
|
+
audioAndVideoTags,
|
|
58
|
+
]);
|
|
43
59
|
const pause = (0, react_1.useCallback)(() => {
|
|
44
60
|
if (imperativePlaying.current) {
|
|
45
61
|
imperativePlaying.current = false;
|
|
46
62
|
setPlaying(false);
|
|
47
63
|
emitter.dispatchPause();
|
|
48
64
|
}
|
|
49
|
-
}, [emitter, setPlaying]);
|
|
65
|
+
}, [emitter, imperativePlaying, setPlaying]);
|
|
50
66
|
const hasVideo = Boolean(video);
|
|
51
67
|
const frameBack = (0, react_1.useCallback)((frames) => {
|
|
52
68
|
if (!hasVideo) {
|
|
@@ -58,7 +74,7 @@ const usePlayer = () => {
|
|
|
58
74
|
setFrame((f) => {
|
|
59
75
|
return Math.max(0, f - frames);
|
|
60
76
|
});
|
|
61
|
-
}, [hasVideo, setFrame]);
|
|
77
|
+
}, [hasVideo, imperativePlaying, setFrame]);
|
|
62
78
|
const frameForward = (0, react_1.useCallback)((frames) => {
|
|
63
79
|
if (!hasVideo) {
|
|
64
80
|
return null;
|
|
@@ -67,7 +83,7 @@ const usePlayer = () => {
|
|
|
67
83
|
return;
|
|
68
84
|
}
|
|
69
85
|
setFrame((f) => Math.min(lastFrame, f + frames));
|
|
70
|
-
}, [hasVideo, lastFrame, setFrame]);
|
|
86
|
+
}, [hasVideo, imperativePlaying, lastFrame, setFrame]);
|
|
71
87
|
const returnValue = (0, react_1.useMemo)(() => {
|
|
72
88
|
return {
|
|
73
89
|
frameBack,
|
|
@@ -85,6 +101,7 @@ const usePlayer = () => {
|
|
|
85
101
|
emitter,
|
|
86
102
|
frameBack,
|
|
87
103
|
frameForward,
|
|
104
|
+
imperativePlaying,
|
|
88
105
|
isLastFrame,
|
|
89
106
|
pause,
|
|
90
107
|
play,
|
package/dist/use-player.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-player.js","sourceRoot":"","sources":["../src/use-player.ts"],"names":[],"mappings":";;;AAAA,iCAA+E;AAC/E,uCAAmC;AACnC,uDAA4D;AAGrD,MAAM,SAAS,GAAG,GAWvB,EAAE;;IACH,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,
|
|
1
|
+
{"version":3,"file":"use-player.js","sourceRoot":"","sources":["../src/use-player.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"validate-playbackrate.d.ts","sourceRoot":"","sources":["../../src/utils/validate-playbackrate.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,oBAAoB,iBAAkB,MAAM,GAAG,SAAS,SAoBpE,CAAC"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.validatePlaybackRate = void 0;
|
|
4
|
+
const validatePlaybackRate = (playbackRate) => {
|
|
5
|
+
if (playbackRate === undefined) {
|
|
6
|
+
return;
|
|
7
|
+
}
|
|
8
|
+
if (playbackRate > 4) {
|
|
9
|
+
throw new Error(`The highest possible playback rate is 4. You passed: ${playbackRate}`);
|
|
10
|
+
}
|
|
11
|
+
if (playbackRate < -4) {
|
|
12
|
+
throw new Error(`The lowest possible playback rate is -4. You passed: ${playbackRate}`);
|
|
13
|
+
}
|
|
14
|
+
if (playbackRate === 0) {
|
|
15
|
+
throw new Error(`A playback rate of 0 is not supported.`);
|
|
16
|
+
}
|
|
17
|
+
};
|
|
18
|
+
exports.validatePlaybackRate = validatePlaybackRate;
|
|
19
|
+
//# sourceMappingURL=validate-playbackrate.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"validate-playbackrate.js","sourceRoot":"","sources":["../../src/utils/validate-playbackrate.ts"],"names":[],"mappings":";;;AAAO,MAAM,oBAAoB,GAAG,CAAC,YAAgC,EAAE,EAAE;IACxE,IAAI,YAAY,KAAK,SAAS,EAAE;QAC/B,OAAO;KACP;IAED,IAAI,YAAY,GAAG,CAAC,EAAE;QACrB,MAAM,IAAI,KAAK,CACd,wDAAwD,YAAY,EAAE,CACtE,CAAC;KACF;IAED,IAAI,YAAY,GAAG,CAAC,CAAC,EAAE;QACtB,MAAM,IAAI,KAAK,CACd,wDAAwD,YAAY,EAAE,CACtE,CAAC;KACF;IAED,IAAI,YAAY,KAAK,CAAC,EAAE;QACvB,MAAM,IAAI,KAAK,CAAC,wCAAwC,CAAC,CAAC;KAC1D;AACF,CAAC,CAAC;AApBW,QAAA,oBAAoB,wBAoB/B"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@remotion/player",
|
|
3
|
-
"version": "3.0.0-lambda.
|
|
3
|
+
"version": "3.0.0-lambda.250+8bed66801",
|
|
4
4
|
"description": "Remotion Player",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
],
|
|
25
25
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
26
26
|
"dependencies": {
|
|
27
|
-
"remotion": "3.0.0-lambda.
|
|
27
|
+
"remotion": "3.0.0-lambda.250+8bed66801"
|
|
28
28
|
},
|
|
29
29
|
"peerDependencies": {
|
|
30
30
|
"react": ">=16.8.0",
|
|
@@ -44,10 +44,10 @@
|
|
|
44
44
|
"prettier-plugin-organize-imports": "^1.1.1",
|
|
45
45
|
"ts-jest": "^27.0.5",
|
|
46
46
|
"typescript": "^4.4.2",
|
|
47
|
-
"webpack": "
|
|
47
|
+
"webpack": "5.60.0"
|
|
48
48
|
},
|
|
49
49
|
"publishConfig": {
|
|
50
50
|
"access": "public"
|
|
51
51
|
},
|
|
52
|
-
"gitHead": "
|
|
52
|
+
"gitHead": "8bed66801069bc79ca88be6ae89846022e68424b"
|
|
53
53
|
}
|