react-native-video-provider 0.2.2 → 0.2.4
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/AuVideo.podspec +1 -1
- package/lib/module/components/VideoControls.js +66 -50
- package/lib/module/components/VideoControls.js.map +1 -1
- package/lib/module/components/VideoFeed.js +150 -0
- package/lib/module/components/VideoFeed.js.map +1 -0
- package/lib/module/components/VideoPlayer.js +52 -5
- package/lib/module/components/VideoPlayer.js.map +1 -1
- package/lib/module/index.js +1 -0
- package/lib/module/index.js.map +1 -1
- package/lib/typescript/src/components/VideoControls.d.ts.map +1 -1
- package/lib/typescript/src/components/VideoFeed.d.ts +49 -0
- package/lib/typescript/src/components/VideoFeed.d.ts.map +1 -0
- package/lib/typescript/src/components/VideoPlayer.d.ts +24 -2
- package/lib/typescript/src/components/VideoPlayer.d.ts.map +1 -1
- package/lib/typescript/src/index.d.ts +1 -0
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/package.json +6 -4
- package/scripts/postinstall.js +44 -0
- package/src/components/VideoControls.tsx +60 -45
- package/src/components/VideoFeed.tsx +201 -0
- package/src/components/VideoPlayer.tsx +129 -48
- package/src/index.ts +6 -0
package/AuVideo.podspec
CHANGED
|
@@ -11,7 +11,7 @@ Pod::Spec.new do |s|
|
|
|
11
11
|
s.authors = package["author"]
|
|
12
12
|
|
|
13
13
|
s.platforms = { :ios => min_ios_version_supported }
|
|
14
|
-
s.source = { :git => "https://github.com/
|
|
14
|
+
s.source = { :git => "https://github.com/gurdeep99/react-native-au-video.git", :tag => "#{s.version}" }
|
|
15
15
|
|
|
16
16
|
s.source_files = "ios/**/*.{h,m,mm,swift,cpp}"
|
|
17
17
|
s.private_header_files = "ios/**/*.h"
|
|
@@ -8,7 +8,7 @@ import { formatTime } from "../utils/formatTime.js";
|
|
|
8
8
|
import { GestureOverlay } from "./GestureOverlay.js";
|
|
9
9
|
import { CloseIcon } from "./icons.js";
|
|
10
10
|
import SvgIcons from "./SvgIcons.js";
|
|
11
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
11
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
12
12
|
/**
|
|
13
13
|
* Minimal built-in chrome: play/pause, seek bar, time, mute and fullscreen
|
|
14
14
|
* toggles, with tap-to-show / double-tap-to-seek gestures. Apps wanting a
|
|
@@ -21,12 +21,18 @@ export function VideoControls({
|
|
|
21
21
|
onClose
|
|
22
22
|
}) {
|
|
23
23
|
const manager = useVideoManager();
|
|
24
|
+
const status = usePlayback(s => s.status);
|
|
24
25
|
const playing = usePlayback(s => s.playing);
|
|
25
26
|
const buffering = usePlayback(s => s.buffering);
|
|
27
|
+
const loading = usePlayback(s => s.loading);
|
|
26
28
|
const position = usePlayback(s => s.position);
|
|
27
29
|
const duration = usePlayback(s => s.duration);
|
|
28
30
|
const muted = usePlayback(s => s.muted);
|
|
29
31
|
const fullscreen = usePlayback(s => s.fullscreen);
|
|
32
|
+
|
|
33
|
+
// No known duration once loaded — a live stream or a video with no fixed
|
|
34
|
+
// end. There's nothing to seek, so hide the seek bar entirely.
|
|
35
|
+
const live = status !== 'idle' && !loading && duration <= 0;
|
|
30
36
|
const [visible, setVisible] = useState(true);
|
|
31
37
|
const hideTimer = useRef(null);
|
|
32
38
|
const trackWidth = useRef(0);
|
|
@@ -58,6 +64,36 @@ export function VideoControls({
|
|
|
58
64
|
scheduleHide();
|
|
59
65
|
}, [manager, duration, scheduleHide]);
|
|
60
66
|
const progress = duration > 0 ? Math.min(position / duration, 1) : 0;
|
|
67
|
+
const muteButton = /*#__PURE__*/_jsx(Pressable, {
|
|
68
|
+
style: styles.button,
|
|
69
|
+
onPress: () => muted ? manager.unmute() : manager.mute(),
|
|
70
|
+
hitSlop: 8,
|
|
71
|
+
children: muted ? /*#__PURE__*/_jsx(SvgIcons, {
|
|
72
|
+
icon: "muteUnmute",
|
|
73
|
+
size: 18,
|
|
74
|
+
fill: "#fff"
|
|
75
|
+
}) : /*#__PURE__*/_jsx(SvgIcons, {
|
|
76
|
+
icon: "muteUnmute",
|
|
77
|
+
type: "mute",
|
|
78
|
+
size: 18,
|
|
79
|
+
fill: "#fff"
|
|
80
|
+
})
|
|
81
|
+
});
|
|
82
|
+
const fullscreenButton = showFullscreenButton ? /*#__PURE__*/_jsx(Pressable, {
|
|
83
|
+
style: styles.button,
|
|
84
|
+
onPress: () => manager.toggleFullscreen(),
|
|
85
|
+
hitSlop: 8,
|
|
86
|
+
children: fullscreen ? /*#__PURE__*/_jsx(SvgIcons, {
|
|
87
|
+
icon: "fullScreen",
|
|
88
|
+
size: 18,
|
|
89
|
+
fill: "#fff"
|
|
90
|
+
}) : /*#__PURE__*/_jsx(SvgIcons, {
|
|
91
|
+
icon: "fullScreen",
|
|
92
|
+
type: "full",
|
|
93
|
+
size: 18,
|
|
94
|
+
fill: "#fff"
|
|
95
|
+
})
|
|
96
|
+
}) : null;
|
|
61
97
|
return /*#__PURE__*/_jsxs(View, {
|
|
62
98
|
style: StyleSheet.absoluteFill,
|
|
63
99
|
pointerEvents: "box-none",
|
|
@@ -78,22 +114,7 @@ export function VideoControls({
|
|
|
78
114
|
size: 18,
|
|
79
115
|
color: "#fff"
|
|
80
116
|
})
|
|
81
|
-
}) : /*#__PURE__*/_jsx(View, {}), /*#__PURE__*/_jsx(
|
|
82
|
-
style: styles.button,
|
|
83
|
-
onPress: () => muted ? manager.unmute() : manager.mute(),
|
|
84
|
-
hitSlop: 8,
|
|
85
|
-
children: muted ? /*#__PURE__*/_jsx(SvgIcons, {
|
|
86
|
-
icon: "muteUnmute",
|
|
87
|
-
type: "mute",
|
|
88
|
-
size: 18,
|
|
89
|
-
fill: "#fff"
|
|
90
|
-
}) : /*#__PURE__*/_jsx(SvgIcons, {
|
|
91
|
-
icon: "muteUnmute",
|
|
92
|
-
type: "unmute",
|
|
93
|
-
size: 18,
|
|
94
|
-
fill: "#fff"
|
|
95
|
-
})
|
|
96
|
-
})]
|
|
117
|
+
}) : /*#__PURE__*/_jsx(View, {}), !live ? muteButton : /*#__PURE__*/_jsx(View, {})]
|
|
97
118
|
}), /*#__PURE__*/_jsx(Pressable, {
|
|
98
119
|
style: styles.playButton,
|
|
99
120
|
onPress: () => {
|
|
@@ -115,40 +136,32 @@ export function VideoControls({
|
|
|
115
136
|
size: 34,
|
|
116
137
|
fill: "#fff"
|
|
117
138
|
})
|
|
118
|
-
}), /*#__PURE__*/
|
|
139
|
+
}), /*#__PURE__*/_jsx(View, {
|
|
119
140
|
style: styles.bottomRow,
|
|
120
|
-
children:
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
fill: "#fff"
|
|
145
|
-
}) : /*#__PURE__*/_jsx(SvgIcons, {
|
|
146
|
-
icon: "fullScreen",
|
|
147
|
-
type: "full",
|
|
148
|
-
size: 18,
|
|
149
|
-
fill: "#fff"
|
|
150
|
-
})
|
|
151
|
-
}) : null]
|
|
141
|
+
children: live ? /*#__PURE__*/_jsxs(_Fragment, {
|
|
142
|
+
children: [muteButton, /*#__PURE__*/_jsx(View, {
|
|
143
|
+
style: styles.spacer
|
|
144
|
+
}), fullscreenButton]
|
|
145
|
+
}) : /*#__PURE__*/_jsxs(_Fragment, {
|
|
146
|
+
children: [/*#__PURE__*/_jsx(Text, {
|
|
147
|
+
style: styles.time,
|
|
148
|
+
children: formatTime(position)
|
|
149
|
+
}), /*#__PURE__*/_jsxs(Pressable, {
|
|
150
|
+
style: styles.track,
|
|
151
|
+
onLayout: onTrackLayout,
|
|
152
|
+
onPress: onTrackPress,
|
|
153
|
+
children: [/*#__PURE__*/_jsx(View, {
|
|
154
|
+
style: styles.trackBg
|
|
155
|
+
}), /*#__PURE__*/_jsx(View, {
|
|
156
|
+
style: [styles.trackFill, {
|
|
157
|
+
width: `${progress * 100}%`
|
|
158
|
+
}]
|
|
159
|
+
})]
|
|
160
|
+
}), /*#__PURE__*/_jsx(Text, {
|
|
161
|
+
style: styles.time,
|
|
162
|
+
children: formatTime(duration)
|
|
163
|
+
}), fullscreenButton]
|
|
164
|
+
})
|
|
152
165
|
})]
|
|
153
166
|
}) : null]
|
|
154
167
|
});
|
|
@@ -192,6 +205,9 @@ const styles = StyleSheet.create({
|
|
|
192
205
|
height: 24,
|
|
193
206
|
justifyContent: 'center'
|
|
194
207
|
},
|
|
208
|
+
spacer: {
|
|
209
|
+
flex: 1
|
|
210
|
+
},
|
|
195
211
|
trackBg: {
|
|
196
212
|
position: 'absolute',
|
|
197
213
|
left: 0,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useCallback","useEffect","useRef","useState","Pressable","StyleSheet","Text","View","useVideoManager","usePlayback","formatTime","GestureOverlay","CloseIcon","SvgIcons","jsx","_jsx","jsxs","_jsxs","VideoControls","doubleTapSeek","hideAfter","showFullscreenButton","onClose","manager","
|
|
1
|
+
{"version":3,"names":["useCallback","useEffect","useRef","useState","Pressable","StyleSheet","Text","View","useVideoManager","usePlayback","formatTime","GestureOverlay","CloseIcon","SvgIcons","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","VideoControls","doubleTapSeek","hideAfter","showFullscreenButton","onClose","manager","status","s","playing","buffering","loading","position","duration","muted","fullscreen","live","visible","setVisible","hideTimer","trackWidth","scheduleHide","current","clearTimeout","setTimeout","toggleVisible","v","onTrackLayout","e","nativeEvent","layout","width","onTrackPress","ratio","locationX","seek","progress","Math","min","muteButton","style","styles","button","onPress","unmute","mute","hitSlop","children","icon","size","fill","type","fullscreenButton","toggleFullscreen","absoluteFill","pointerEvents","onSingleTap","onDoubleTapLeft","seekBy","onDoubleTapRight","chrome","topRow","color","playButton","toggle","playIcon","bottomRow","spacer","time","track","onLayout","trackBg","trackFill","create","top","left","right","bottom","backgroundColor","justifyContent","flexDirection","padding","alignSelf","fontSize","alignItems","paddingHorizontal","paddingBottom","gap","fontVariant","flex","height","borderRadius"],"sourceRoot":"../../../src","sources":["components/VideoControls.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,150 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useCallback, useEffect, useRef, useState } from 'react';
|
|
4
|
+
import { FlatList, StyleSheet, useWindowDimensions, View } from 'react-native';
|
|
5
|
+
import { useVideoManager } from "../provider/VideoContext.js";
|
|
6
|
+
import { VideoSurface } from "./VideoSurface.js";
|
|
7
|
+
|
|
8
|
+
/** Surface id a feed item registers under. */
|
|
9
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
10
|
+
export const feedSurfaceId = id => `feed:${id}`;
|
|
11
|
+
|
|
12
|
+
/** Minimal shape of a FlatList viewability token (avoids RN type-name drift). */
|
|
13
|
+
|
|
14
|
+
/**
|
|
15
|
+
* A single-engine video feed: render many videos in a scrollable list, but
|
|
16
|
+
* only the one scrolled into focus plays — the rest are stopped. There is
|
|
17
|
+
* still exactly ONE native player; scrolling hands it off to the focused
|
|
18
|
+
* item's surface, so memory and CPU stay flat no matter how long the feed.
|
|
19
|
+
*
|
|
20
|
+
* Each item is a plain `VideoSurface` (never a `VideoPlayer`, which would
|
|
21
|
+
* fight for the engine on mount). Focus is driven centrally from FlatList
|
|
22
|
+
* viewability.
|
|
23
|
+
*
|
|
24
|
+
* ```tsx
|
|
25
|
+
* <VideoFeed
|
|
26
|
+
* data={videos} // [{ id, uri, title? }, …]
|
|
27
|
+
* renderOverlay={({ item, focused }) => <Caption title={item.title} />}
|
|
28
|
+
* />
|
|
29
|
+
* ```
|
|
30
|
+
*/
|
|
31
|
+
export function VideoFeed({
|
|
32
|
+
data,
|
|
33
|
+
itemHeight,
|
|
34
|
+
resizeMode,
|
|
35
|
+
muted = true,
|
|
36
|
+
repeat = true,
|
|
37
|
+
visibilityThreshold = 80,
|
|
38
|
+
renderOverlay,
|
|
39
|
+
onFocusChange,
|
|
40
|
+
pauseOnUnmount = true,
|
|
41
|
+
...rest
|
|
42
|
+
}) {
|
|
43
|
+
const manager = useVideoManager();
|
|
44
|
+
const {
|
|
45
|
+
height: windowHeight
|
|
46
|
+
} = useWindowDimensions();
|
|
47
|
+
const height = itemHeight ?? windowHeight;
|
|
48
|
+
const [focusedId, setFocusedId] = useState(null);
|
|
49
|
+
|
|
50
|
+
// Global engine settings — apply to whatever is currently playing.
|
|
51
|
+
useEffect(() => {
|
|
52
|
+
if (muted) {
|
|
53
|
+
manager.mute();
|
|
54
|
+
} else {
|
|
55
|
+
manager.unmute();
|
|
56
|
+
}
|
|
57
|
+
}, [manager, muted]);
|
|
58
|
+
useEffect(() => {
|
|
59
|
+
manager.setRepeat(repeat);
|
|
60
|
+
}, [manager, repeat]);
|
|
61
|
+
useEffect(() => {
|
|
62
|
+
if (resizeMode) {
|
|
63
|
+
manager.setResizeMode(resizeMode);
|
|
64
|
+
}
|
|
65
|
+
}, [manager, resizeMode]);
|
|
66
|
+
useEffect(() => {
|
|
67
|
+
return () => {
|
|
68
|
+
if (pauseOnUnmount) {
|
|
69
|
+
manager.pause();
|
|
70
|
+
}
|
|
71
|
+
};
|
|
72
|
+
}, [manager, pauseOnUnmount]);
|
|
73
|
+
const focus = useCallback((item, index) => {
|
|
74
|
+
setFocusedId(item?.id ?? null);
|
|
75
|
+
if (item) {
|
|
76
|
+
// Same-id handoff aware: re-focusing the same video never reloads.
|
|
77
|
+
// A different id replaces the source, which stops the previous one —
|
|
78
|
+
// so only the focused video ever plays.
|
|
79
|
+
manager.setSource(item, {
|
|
80
|
+
autoplay: true,
|
|
81
|
+
surfaceId: feedSurfaceId(item.id)
|
|
82
|
+
});
|
|
83
|
+
}
|
|
84
|
+
onFocusChange?.(item, index);
|
|
85
|
+
}, [manager, onFocusChange]);
|
|
86
|
+
|
|
87
|
+
// FlatList forbids changing these on the fly, so keep them stable and read
|
|
88
|
+
// the latest `focus`/`data` through a ref.
|
|
89
|
+
const latest = useRef({
|
|
90
|
+
focus,
|
|
91
|
+
data
|
|
92
|
+
});
|
|
93
|
+
latest.current = {
|
|
94
|
+
focus,
|
|
95
|
+
data
|
|
96
|
+
};
|
|
97
|
+
const viewabilityConfig = useRef({
|
|
98
|
+
itemVisiblePercentThreshold: visibilityThreshold,
|
|
99
|
+
minimumViewTime: 100
|
|
100
|
+
}).current;
|
|
101
|
+
const onViewableItemsChanged = useRef(({
|
|
102
|
+
viewableItems
|
|
103
|
+
}) => {
|
|
104
|
+
const focusedToken = viewableItems.find(v => v.isViewable);
|
|
105
|
+
if (focusedToken) {
|
|
106
|
+
latest.current.focus(focusedToken.item, focusedToken.index ?? 0);
|
|
107
|
+
}
|
|
108
|
+
}).current;
|
|
109
|
+
const renderItem = useCallback(({
|
|
110
|
+
item,
|
|
111
|
+
index
|
|
112
|
+
}) => /*#__PURE__*/_jsxs(View, {
|
|
113
|
+
style: [styles.item, {
|
|
114
|
+
height
|
|
115
|
+
}],
|
|
116
|
+
children: [/*#__PURE__*/_jsx(VideoSurface, {
|
|
117
|
+
surfaceId: feedSurfaceId(item.id),
|
|
118
|
+
style: StyleSheet.absoluteFill
|
|
119
|
+
}), renderOverlay?.({
|
|
120
|
+
item,
|
|
121
|
+
index,
|
|
122
|
+
focused: item.id === focusedId
|
|
123
|
+
})]
|
|
124
|
+
}), [height, renderOverlay, focusedId]);
|
|
125
|
+
return /*#__PURE__*/_jsx(FlatList, {
|
|
126
|
+
data: data,
|
|
127
|
+
keyExtractor: item => item.id,
|
|
128
|
+
renderItem: renderItem,
|
|
129
|
+
onViewableItemsChanged: onViewableItemsChanged,
|
|
130
|
+
viewabilityConfig: viewabilityConfig,
|
|
131
|
+
getItemLayout: (_, index) => ({
|
|
132
|
+
length: height,
|
|
133
|
+
offset: height * index,
|
|
134
|
+
index
|
|
135
|
+
}),
|
|
136
|
+
showsVerticalScrollIndicator: false,
|
|
137
|
+
snapToInterval: height,
|
|
138
|
+
snapToAlignment: "start",
|
|
139
|
+
decelerationRate: "fast",
|
|
140
|
+
...rest
|
|
141
|
+
});
|
|
142
|
+
}
|
|
143
|
+
const styles = StyleSheet.create({
|
|
144
|
+
item: {
|
|
145
|
+
width: '100%',
|
|
146
|
+
backgroundColor: '#000',
|
|
147
|
+
overflow: 'hidden'
|
|
148
|
+
}
|
|
149
|
+
});
|
|
150
|
+
//# sourceMappingURL=VideoFeed.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useCallback","useEffect","useRef","useState","FlatList","StyleSheet","useWindowDimensions","View","useVideoManager","VideoSurface","jsx","_jsx","jsxs","_jsxs","feedSurfaceId","id","VideoFeed","data","itemHeight","resizeMode","muted","repeat","visibilityThreshold","renderOverlay","onFocusChange","pauseOnUnmount","rest","manager","height","windowHeight","focusedId","setFocusedId","mute","unmute","setRepeat","setResizeMode","pause","focus","item","index","setSource","autoplay","surfaceId","latest","current","viewabilityConfig","itemVisiblePercentThreshold","minimumViewTime","onViewableItemsChanged","viewableItems","focusedToken","find","v","isViewable","renderItem","style","styles","children","absoluteFill","focused","keyExtractor","getItemLayout","_","length","offset","showsVerticalScrollIndicator","snapToInterval","snapToAlignment","decelerationRate","create","width","backgroundColor","overflow"],"sourceRoot":"../../../src","sources":["components/VideoFeed.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
import { useEffect } from 'react';
|
|
4
|
-
import { StyleSheet, View } from 'react-native';
|
|
3
|
+
import { forwardRef, useEffect, useImperativeHandle } from 'react';
|
|
4
|
+
import { AppState, StyleSheet, View } from 'react-native';
|
|
5
5
|
import { useVideoManager } from "../provider/VideoContext.js";
|
|
6
|
+
import { useVideoEvents } from "../hooks/useVideoEvents.js";
|
|
6
7
|
import { VideoControls } from "./VideoControls.js";
|
|
7
8
|
import { VideoSurface } from "./VideoSurface.js";
|
|
8
9
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
@@ -14,20 +15,31 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
14
15
|
* ```tsx
|
|
15
16
|
* <VideoPlayer source={{ id: '123', uri }} style={{ aspectRatio: 16 / 9 }} />
|
|
16
17
|
* ```
|
|
18
|
+
*
|
|
19
|
+
* `ref` exposes the underlying `VideoManager` for imperative control
|
|
20
|
+
* (`ref.current.play()`, `.seek()`, …) — the same instance `useVideo()`
|
|
21
|
+
* returns elsewhere in the app.
|
|
17
22
|
*/
|
|
18
|
-
export
|
|
23
|
+
export const VideoPlayer = /*#__PURE__*/forwardRef(({
|
|
19
24
|
source,
|
|
20
25
|
autoplay = true,
|
|
21
26
|
surfaceId,
|
|
22
27
|
controls = true,
|
|
23
28
|
resizeMode,
|
|
29
|
+
repeat,
|
|
30
|
+
muted,
|
|
24
31
|
orientation,
|
|
25
32
|
fullscreenOrientation,
|
|
33
|
+
pauseOnFocusLost = true,
|
|
34
|
+
onLoadComplete,
|
|
35
|
+
onBuffering,
|
|
36
|
+
onError,
|
|
26
37
|
style,
|
|
27
38
|
...rest
|
|
28
|
-
}) {
|
|
39
|
+
}, ref) => {
|
|
29
40
|
const manager = useVideoManager();
|
|
30
41
|
const id = surfaceId ?? `player:${source.id}`;
|
|
42
|
+
useImperativeHandle(ref, () => manager, [manager]);
|
|
31
43
|
useEffect(() => {
|
|
32
44
|
manager.setSource(source, {
|
|
33
45
|
autoplay,
|
|
@@ -42,6 +54,22 @@ export function VideoPlayer({
|
|
|
42
54
|
manager.setResizeMode(resizeMode);
|
|
43
55
|
}
|
|
44
56
|
}, [manager, resizeMode]);
|
|
57
|
+
useEffect(() => {
|
|
58
|
+
if (repeat === undefined) {
|
|
59
|
+
return;
|
|
60
|
+
}
|
|
61
|
+
manager.setRepeat(repeat);
|
|
62
|
+
}, [manager, repeat]);
|
|
63
|
+
useEffect(() => {
|
|
64
|
+
if (muted === undefined) {
|
|
65
|
+
return;
|
|
66
|
+
}
|
|
67
|
+
if (muted) {
|
|
68
|
+
manager.mute();
|
|
69
|
+
} else {
|
|
70
|
+
manager.unmute();
|
|
71
|
+
}
|
|
72
|
+
}, [manager, muted]);
|
|
45
73
|
useEffect(() => {
|
|
46
74
|
if (!orientation || orientation === 'auto') {
|
|
47
75
|
return;
|
|
@@ -56,6 +84,24 @@ export function VideoPlayer({
|
|
|
56
84
|
manager.setFullscreenOrientation(fullscreenOrientation);
|
|
57
85
|
return () => manager.setFullscreenOrientation(null);
|
|
58
86
|
}, [manager, fullscreenOrientation]);
|
|
87
|
+
useEffect(() => {
|
|
88
|
+
if (!pauseOnFocusLost) {
|
|
89
|
+
return;
|
|
90
|
+
}
|
|
91
|
+
const sub = AppState.addEventListener('change', next => {
|
|
92
|
+
// Only the player currently owning the engine reacts, so a video
|
|
93
|
+
// attached to another surface keeps playing untouched.
|
|
94
|
+
if (next !== 'active' && manager.store.getState().surfaceId === id) {
|
|
95
|
+
manager.pause();
|
|
96
|
+
}
|
|
97
|
+
});
|
|
98
|
+
return () => sub.remove();
|
|
99
|
+
}, [manager, id, pauseOnFocusLost]);
|
|
100
|
+
useVideoEvents({
|
|
101
|
+
onLoad: onLoadComplete,
|
|
102
|
+
onBuffer: e => onBuffering?.(e.buffering),
|
|
103
|
+
onError
|
|
104
|
+
});
|
|
59
105
|
return /*#__PURE__*/_jsxs(View, {
|
|
60
106
|
style: [styles.container, style],
|
|
61
107
|
...rest,
|
|
@@ -64,7 +110,8 @@ export function VideoPlayer({
|
|
|
64
110
|
style: styles.surface
|
|
65
111
|
}), controls ? /*#__PURE__*/_jsx(VideoControls, {}) : null]
|
|
66
112
|
});
|
|
67
|
-
}
|
|
113
|
+
});
|
|
114
|
+
VideoPlayer.displayName = 'VideoPlayer';
|
|
68
115
|
const styles = StyleSheet.create({
|
|
69
116
|
container: {
|
|
70
117
|
backgroundColor: '#000',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useEffect","StyleSheet","View","useVideoManager","VideoControls","VideoSurface","jsx","_jsx","jsxs","_jsxs","VideoPlayer","source","autoplay","surfaceId","controls","resizeMode","orientation","fullscreenOrientation","style","rest","manager","id","setSource","setResizeMode","setOrientation","setFullscreenOrientation","styles","container","children","surface","create","backgroundColor","overflow","position","top","left","right","bottom"],"sourceRoot":"../../../src","sources":["components/VideoPlayer.tsx"],"mappings":";;AAAA,SAASA,SAAS,QAAQ,OAAO;
|
|
1
|
+
{"version":3,"names":["forwardRef","useEffect","useImperativeHandle","AppState","StyleSheet","View","useVideoManager","useVideoEvents","VideoControls","VideoSurface","jsx","_jsx","jsxs","_jsxs","VideoPlayer","source","autoplay","surfaceId","controls","resizeMode","repeat","muted","orientation","fullscreenOrientation","pauseOnFocusLost","onLoadComplete","onBuffering","onError","style","rest","ref","manager","id","setSource","setResizeMode","undefined","setRepeat","mute","unmute","setOrientation","setFullscreenOrientation","sub","addEventListener","next","store","getState","pause","remove","onLoad","onBuffer","e","buffering","styles","container","children","surface","displayName","create","backgroundColor","overflow","position","top","left","right","bottom"],"sourceRoot":"../../../src","sources":["components/VideoPlayer.tsx"],"mappings":"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","ignoreList":[]}
|
package/lib/module/index.js
CHANGED
|
@@ -5,6 +5,7 @@ export { useVideoManager } from "./provider/VideoContext.js";
|
|
|
5
5
|
export { VideoManager, FULLSCREEN_SURFACE_ID, FLOATING_SURFACE_ID } from "./core/VideoManager.js";
|
|
6
6
|
export { VideoSurface } from "./components/VideoSurface.js";
|
|
7
7
|
export { VideoPlayer } from "./components/VideoPlayer.js";
|
|
8
|
+
export { VideoFeed, feedSurfaceId } from "./components/VideoFeed.js";
|
|
8
9
|
export { FullscreenPlayer } from "./components/FullscreenPlayer.js";
|
|
9
10
|
export { FloatingPlayer } from "./components/FloatingPlayer.js";
|
|
10
11
|
export { MiniPlayer } from "./components/MiniPlayer.js";
|
package/lib/module/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["VideoProvider","useVideoManager","VideoManager","FULLSCREEN_SURFACE_ID","FLOATING_SURFACE_ID","VideoSurface","VideoPlayer","FullscreenPlayer","FloatingPlayer","MiniPlayer","VideoControls","GestureOverlay","useVideo","usePlayback","useFullscreen","usePiP","useVideoEvents","formatTime"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;AAAA,SACEA,aAAa,QAER,6BAA0B;AACjC,SAASC,eAAe,QAAQ,4BAAyB;AACzD,SACEC,YAAY,EACZC,qBAAqB,EACrBC,mBAAmB,QACd,wBAAqB;AAE5B,SACEC,YAAY,QAEP,8BAA2B;AAClC,SAASC,WAAW,QAA+B,6BAA0B;AAC7E,SAASC,gBAAgB,QAAQ,kCAA+B;AAChE,SACEC,cAAc,QAET,gCAA6B;AACpC,SAASC,UAAU,QAA8B,4BAAyB;AAC1E,SACEC,aAAa,QAER,+BAA4B;AACnC,SACEC,cAAc,QAET,gCAA6B;AAEpC,SAASC,QAAQ,QAAQ,qBAAkB;AAC3C,SAASC,WAAW,QAAQ,wBAAqB;AACjD,SAASC,aAAa,QAAQ,0BAAuB;AACrD,SAASC,MAAM,QAAQ,mBAAgB;AACvC,SACEC,cAAc,QAET,2BAAwB;AAE/B,SAASC,UAAU,QAAQ,uBAAoB","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["VideoProvider","useVideoManager","VideoManager","FULLSCREEN_SURFACE_ID","FLOATING_SURFACE_ID","VideoSurface","VideoPlayer","VideoFeed","feedSurfaceId","FullscreenPlayer","FloatingPlayer","MiniPlayer","VideoControls","GestureOverlay","useVideo","usePlayback","useFullscreen","usePiP","useVideoEvents","formatTime"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;AAAA,SACEA,aAAa,QAER,6BAA0B;AACjC,SAASC,eAAe,QAAQ,4BAAyB;AACzD,SACEC,YAAY,EACZC,qBAAqB,EACrBC,mBAAmB,QACd,wBAAqB;AAE5B,SACEC,YAAY,QAEP,8BAA2B;AAClC,SAASC,WAAW,QAA+B,6BAA0B;AAC7E,SACEC,SAAS,EACTC,aAAa,QAGR,2BAAwB;AAC/B,SAASC,gBAAgB,QAAQ,kCAA+B;AAChE,SACEC,cAAc,QAET,gCAA6B;AACpC,SAASC,UAAU,QAA8B,4BAAyB;AAC1E,SACEC,aAAa,QAER,+BAA4B;AACnC,SACEC,cAAc,QAET,gCAA6B;AAEpC,SAASC,QAAQ,QAAQ,qBAAkB;AAC3C,SAASC,WAAW,QAAQ,wBAAqB;AACjD,SAASC,aAAa,QAAQ,0BAAuB;AACrD,SAASC,MAAM,QAAQ,mBAAgB;AACvC,SACEC,cAAc,QAET,2BAAwB;AAE/B,SAASC,UAAU,QAAQ,uBAAoB","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VideoControls.d.ts","sourceRoot":"","sources":["../../../../src/components/VideoControls.tsx"],"names":[],"mappings":"AAgBA,MAAM,WAAW,kBAAkB;IACjC,gDAAgD;IAChD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uDAAuD;IACvD,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,kEAAkE;IAClE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,EAC5B,aAAkB,EAClB,SAAgB,EAChB,oBAA2B,EAC3B,OAAO,GACR,EAAE,kBAAkB,+
|
|
1
|
+
{"version":3,"file":"VideoControls.d.ts","sourceRoot":"","sources":["../../../../src/components/VideoControls.tsx"],"names":[],"mappings":"AAgBA,MAAM,WAAW,kBAAkB;IACjC,gDAAgD;IAChD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uDAAuD;IACvD,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,kEAAkE;IAClE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,EAC5B,aAAkB,EAClB,SAAgB,EAChB,oBAA2B,EAC3B,OAAO,GACR,EAAE,kBAAkB,+BAsJpB"}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { type ReactNode } from 'react';
|
|
2
|
+
import { type FlatListProps } from 'react-native';
|
|
3
|
+
import type { ResizeMode, VideoSource } from '../types/video.js';
|
|
4
|
+
/** Surface id a feed item registers under. */
|
|
5
|
+
export declare const feedSurfaceId: (id: string) => string;
|
|
6
|
+
export interface VideoFeedRenderInfo<T> {
|
|
7
|
+
item: T;
|
|
8
|
+
index: number;
|
|
9
|
+
/** True when this item is the one currently playing. */
|
|
10
|
+
focused: boolean;
|
|
11
|
+
}
|
|
12
|
+
export interface VideoFeedProps<T extends VideoSource> extends Omit<FlatListProps<T>, 'data' | 'renderItem' | 'keyExtractor' | 'onViewableItemsChanged' | 'viewabilityConfig' | 'getItemLayout'> {
|
|
13
|
+
/** The videos. Each needs a stable `id` (used for the surface + handoff). */
|
|
14
|
+
data: T[];
|
|
15
|
+
/** Height of each item. Default: the window height (a full-screen reels feed). */
|
|
16
|
+
itemHeight?: number;
|
|
17
|
+
resizeMode?: ResizeMode;
|
|
18
|
+
/** Start muted. Default `true` (autoplay policies + typical feed UX). */
|
|
19
|
+
muted?: boolean;
|
|
20
|
+
/** Loop the focused video. Default `true`. */
|
|
21
|
+
repeat?: boolean;
|
|
22
|
+
/** Percent of an item that must be visible to become focused. Default 80. */
|
|
23
|
+
visibilityThreshold?: number;
|
|
24
|
+
/** Overlay above each item — captions, like button, a tap-to-pause layer, … */
|
|
25
|
+
renderOverlay?: (info: VideoFeedRenderInfo<T>) => ReactNode;
|
|
26
|
+
/** Called when the focused item changes (null when none is visible). */
|
|
27
|
+
onFocusChange?: (item: T | null, index: number) => void;
|
|
28
|
+
/** Pause playback when the feed unmounts. Default `true`. */
|
|
29
|
+
pauseOnUnmount?: boolean;
|
|
30
|
+
}
|
|
31
|
+
/**
|
|
32
|
+
* A single-engine video feed: render many videos in a scrollable list, but
|
|
33
|
+
* only the one scrolled into focus plays — the rest are stopped. There is
|
|
34
|
+
* still exactly ONE native player; scrolling hands it off to the focused
|
|
35
|
+
* item's surface, so memory and CPU stay flat no matter how long the feed.
|
|
36
|
+
*
|
|
37
|
+
* Each item is a plain `VideoSurface` (never a `VideoPlayer`, which would
|
|
38
|
+
* fight for the engine on mount). Focus is driven centrally from FlatList
|
|
39
|
+
* viewability.
|
|
40
|
+
*
|
|
41
|
+
* ```tsx
|
|
42
|
+
* <VideoFeed
|
|
43
|
+
* data={videos} // [{ id, uri, title? }, …]
|
|
44
|
+
* renderOverlay={({ item, focused }) => <Caption title={item.title} />}
|
|
45
|
+
* />
|
|
46
|
+
* ```
|
|
47
|
+
*/
|
|
48
|
+
export declare function VideoFeed<T extends VideoSource>({ data, itemHeight, resizeMode, muted, repeat, visibilityThreshold, renderOverlay, onFocusChange, pauseOnUnmount, ...rest }: VideoFeedProps<T>): import("react").JSX.Element;
|
|
49
|
+
//# sourceMappingURL=VideoFeed.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"VideoFeed.d.ts","sourceRoot":"","sources":["../../../../src/components/VideoFeed.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,EAKL,KAAK,aAAa,EACnB,MAAM,cAAc,CAAC;AAEtB,OAAO,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,mBAAgB,CAAC;AAG9D,8CAA8C;AAC9C,eAAO,MAAM,aAAa,GAAI,IAAI,MAAM,WAAiB,CAAC;AAS1D,MAAM,WAAW,mBAAmB,CAAC,CAAC;IACpC,IAAI,EAAE,CAAC,CAAC;IACR,KAAK,EAAE,MAAM,CAAC;IACd,wDAAwD;IACxD,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,WAAW,CAAE,SAAQ,IAAI,CACjE,aAAa,CAAC,CAAC,CAAC,EACd,MAAM,GACN,YAAY,GACZ,cAAc,GACd,wBAAwB,GACxB,mBAAmB,GACnB,eAAe,CAClB;IACC,6EAA6E;IAC7E,IAAI,EAAE,CAAC,EAAE,CAAC;IACV,kFAAkF;IAClF,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,yEAAyE;IACzE,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,8CAA8C;IAC9C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,6EAA6E;IAC7E,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,+EAA+E;IAC/E,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,mBAAmB,CAAC,CAAC,CAAC,KAAK,SAAS,CAAC;IAC5D,wEAAwE;IACxE,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,GAAG,IAAI,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxD,6DAA6D;IAC7D,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,SAAS,CAAC,CAAC,SAAS,WAAW,EAAE,EAC/C,IAAI,EACJ,UAAU,EACV,UAAU,EACV,KAAY,EACZ,MAAa,EACb,mBAAwB,EACxB,aAAa,EACb,aAAa,EACb,cAAqB,EACrB,GAAG,IAAI,EACR,EAAE,cAAc,CAAC,CAAC,CAAC,+BAqGnB"}
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import { type ViewProps } from 'react-native';
|
|
2
|
-
import
|
|
2
|
+
import { VideoManager } from '../core/VideoManager.js';
|
|
3
|
+
import type { VideoEventMap } from '../types/events.js';
|
|
4
|
+
import type { OrientationLock, ResizeMode, VideoError, VideoSource } from '../types/video.js';
|
|
3
5
|
export interface VideoPlayerProps extends ViewProps {
|
|
4
6
|
source: VideoSource;
|
|
5
7
|
/** Default true. */
|
|
@@ -13,6 +15,10 @@ export interface VideoPlayerProps extends ViewProps {
|
|
|
13
15
|
/** Show built-in controls. Default true. */
|
|
14
16
|
controls?: boolean;
|
|
15
17
|
resizeMode?: ResizeMode;
|
|
18
|
+
/** Loop playback when it ends. Default false. */
|
|
19
|
+
repeat?: boolean;
|
|
20
|
+
/** Default false. */
|
|
21
|
+
muted?: boolean;
|
|
16
22
|
/**
|
|
17
23
|
* Force the screen into this orientation while the player is mounted:
|
|
18
24
|
* `'landscape'`, `'inverted-landscape'`, `'portrait'` or
|
|
@@ -26,6 +32,18 @@ export interface VideoPlayerProps extends ViewProps {
|
|
|
26
32
|
* when it closes, so the rest of the app is unaffected.
|
|
27
33
|
*/
|
|
28
34
|
fullscreenOrientation?: OrientationLock;
|
|
35
|
+
/**
|
|
36
|
+
* Pause this player when it loses focus — i.e. the app goes to the
|
|
37
|
+
* background while this player's surface is the one currently playing.
|
|
38
|
+
* Default `true`. Set `false` to keep playing (e.g. background audio).
|
|
39
|
+
* Only the focused player acts, so a video attached elsewhere is untouched.
|
|
40
|
+
*/
|
|
41
|
+
pauseOnFocusLost?: boolean;
|
|
42
|
+
/** Fires once metadata (duration, dimensions) is available. */
|
|
43
|
+
onLoadComplete?: (info: VideoEventMap['onLoad']) => void;
|
|
44
|
+
/** Fires whenever buffering starts or stops. */
|
|
45
|
+
onBuffering?: (buffering: boolean) => void;
|
|
46
|
+
onError?: (error: VideoError) => void;
|
|
29
47
|
}
|
|
30
48
|
/**
|
|
31
49
|
* Convenience all-in-one player: `setSource` (same-video handoff aware) +
|
|
@@ -35,6 +53,10 @@ export interface VideoPlayerProps extends ViewProps {
|
|
|
35
53
|
* ```tsx
|
|
36
54
|
* <VideoPlayer source={{ id: '123', uri }} style={{ aspectRatio: 16 / 9 }} />
|
|
37
55
|
* ```
|
|
56
|
+
*
|
|
57
|
+
* `ref` exposes the underlying `VideoManager` for imperative control
|
|
58
|
+
* (`ref.current.play()`, `.seek()`, …) — the same instance `useVideo()`
|
|
59
|
+
* returns elsewhere in the app.
|
|
38
60
|
*/
|
|
39
|
-
export declare
|
|
61
|
+
export declare const VideoPlayer: import("react").ForwardRefExoticComponent<VideoPlayerProps & import("react").RefAttributes<VideoManager>>;
|
|
40
62
|
//# sourceMappingURL=VideoPlayer.d.ts.map
|