@ray-js/ipc-player-integration 0.0.17 → 0.0.18-beta-2
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/lib/ui/ui.js +80 -23
- package/package.json +2 -2
package/lib/ui/ui.js
CHANGED
|
@@ -73,6 +73,7 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
|
|
|
73
73
|
setRecording
|
|
74
74
|
} = instance;
|
|
75
75
|
const prevTriggerEvent = useRef();
|
|
76
|
+
const hasPlayedRef = useRef(false);
|
|
76
77
|
/*
|
|
77
78
|
player 的UI效果期望有一些控件在初始化的时候都展示,在点击 Player 之后隐藏:
|
|
78
79
|
在控件显示时,点击播放器期望隐藏控件
|
|
@@ -94,6 +95,75 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
|
|
|
94
95
|
// const [verticalCoverZoom, setVerticalCoverZoom] = useState(-2);
|
|
95
96
|
// const [verticalZoomLevel, setVerticalZoomLevel] = useState(playerFit === 'contain' ? 1 : -2);
|
|
96
97
|
|
|
98
|
+
const {
|
|
99
|
+
topLeftContent,
|
|
100
|
+
topRightContent,
|
|
101
|
+
bottomLeftContent,
|
|
102
|
+
bottomRightContent,
|
|
103
|
+
absoluteContent,
|
|
104
|
+
screenType,
|
|
105
|
+
playState,
|
|
106
|
+
resolution,
|
|
107
|
+
mute
|
|
108
|
+
} = useStore({
|
|
109
|
+
topLeftContent: instance.topLeftContent,
|
|
110
|
+
topRightContent: instance.topRightContent,
|
|
111
|
+
bottomLeftContent: instance.bottomLeftContent,
|
|
112
|
+
bottomRightContent: instance.bottomRightContent,
|
|
113
|
+
absoluteContent: instance.absoluteContent,
|
|
114
|
+
screenType: instance.screenType,
|
|
115
|
+
playState: instance.playState,
|
|
116
|
+
resolution: instance.resolution,
|
|
117
|
+
mute: instance.mute
|
|
118
|
+
});
|
|
119
|
+
useEffect(() => {
|
|
120
|
+
// 首次进来强制为竖屏
|
|
121
|
+
if (createCtx) {
|
|
122
|
+
// 获取屏幕方向比例
|
|
123
|
+
try {
|
|
124
|
+
var _ty;
|
|
125
|
+
if (typeof ((_ty = ty) === null || _ty === void 0 ? void 0 : _ty.getOrientationSync) === 'function') {
|
|
126
|
+
const {
|
|
127
|
+
orientation
|
|
128
|
+
} = ty.getOrientationSync();
|
|
129
|
+
ipcTTTOperatorLog(`同步获取屏幕方向: ${orientation}`);
|
|
130
|
+
setScreenType(orientation === 'landscape' ? 'full' : 'vertical');
|
|
131
|
+
}
|
|
132
|
+
} catch (e) {
|
|
133
|
+
console.log('获取屏幕方向失败');
|
|
134
|
+
}
|
|
135
|
+
}
|
|
136
|
+
}, [createCtx]);
|
|
137
|
+
const handleOrientationChange = data => {
|
|
138
|
+
const {
|
|
139
|
+
orientation
|
|
140
|
+
} = data;
|
|
141
|
+
if (['portrait', 'portrait-upside-down', 'landscape-left', 'landscape-right'].includes(orientation)) {
|
|
142
|
+
setScreenType(orientation === 'landscape-left' || orientation === 'landscape-right' ? 'full' : 'vertical');
|
|
143
|
+
const pageOrientation = orientation === 'landscape-left' || orientation === 'landscape-right' ? 'landscape' : 'portrait';
|
|
144
|
+
setPageOrientation({
|
|
145
|
+
pageOrientation,
|
|
146
|
+
success: () => {
|
|
147
|
+
console.log('success');
|
|
148
|
+
},
|
|
149
|
+
fail: err => {
|
|
150
|
+
console.log('err', err);
|
|
151
|
+
}
|
|
152
|
+
});
|
|
153
|
+
}
|
|
154
|
+
};
|
|
155
|
+
useEffect(() => {
|
|
156
|
+
var _ty2;
|
|
157
|
+
if (typeof ((_ty2 = ty) === null || _ty2 === void 0 ? void 0 : _ty2.onOrientationChange) === 'function') {
|
|
158
|
+
ty.onOrientationChange(handleOrientationChange);
|
|
159
|
+
}
|
|
160
|
+
return () => {
|
|
161
|
+
var _ty3;
|
|
162
|
+
if (typeof ((_ty3 = ty) === null || _ty3 === void 0 ? void 0 : _ty3.offOrientationChange) === 'function') {
|
|
163
|
+
ty.offOrientationChange(handleOrientationChange);
|
|
164
|
+
}
|
|
165
|
+
};
|
|
166
|
+
}, []);
|
|
97
167
|
useEffect(() => {
|
|
98
168
|
if (createCtx) {
|
|
99
169
|
setScaleMultiple(playerFit === 'contain' ? 1 : -2);
|
|
@@ -124,7 +194,6 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
|
|
|
124
194
|
} = sizeData;
|
|
125
195
|
console.log('监听到屏幕布局变化', type);
|
|
126
196
|
const {
|
|
127
|
-
platform,
|
|
128
197
|
deviceType
|
|
129
198
|
} = systemInfo.current;
|
|
130
199
|
// 针对pad 暂不支持横屏,且在ios pad模式下 会触发onResize事件, 待解决
|
|
@@ -200,27 +269,6 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
|
|
|
200
269
|
if (!systemInfo.current) {
|
|
201
270
|
systemInfo.current = getSystemInfoSync();
|
|
202
271
|
}
|
|
203
|
-
const {
|
|
204
|
-
topLeftContent,
|
|
205
|
-
topRightContent,
|
|
206
|
-
bottomLeftContent,
|
|
207
|
-
bottomRightContent,
|
|
208
|
-
absoluteContent,
|
|
209
|
-
screenType,
|
|
210
|
-
playState,
|
|
211
|
-
resolution,
|
|
212
|
-
mute
|
|
213
|
-
} = useStore({
|
|
214
|
-
topLeftContent: instance.topLeftContent,
|
|
215
|
-
topRightContent: instance.topRightContent,
|
|
216
|
-
bottomLeftContent: instance.bottomLeftContent,
|
|
217
|
-
bottomRightContent: instance.bottomRightContent,
|
|
218
|
-
absoluteContent: instance.absoluteContent,
|
|
219
|
-
screenType: instance.screenType,
|
|
220
|
-
playState: instance.playState,
|
|
221
|
-
resolution: instance.resolution,
|
|
222
|
-
mute: instance.mute
|
|
223
|
-
});
|
|
224
272
|
|
|
225
273
|
// 监听物理返回按键
|
|
226
274
|
const hackHandle = () => {
|
|
@@ -336,7 +384,16 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
|
|
|
336
384
|
if (playState !== PlayState.PLAYING) {
|
|
337
385
|
console.log('非播放状态=======');
|
|
338
386
|
console.log(currentZoomLevel, 'currentZoomLevel');
|
|
339
|
-
|
|
387
|
+
if (hasPlayedRef.current) {
|
|
388
|
+
setScaleMultiple(currentZoomLevel);
|
|
389
|
+
}
|
|
390
|
+
}
|
|
391
|
+
if (playState === PlayState.PLAYING) {
|
|
392
|
+
// 仅在第一次播放成功时,针对竖屏并且为cover模式时,设置为-2
|
|
393
|
+
if (screenType === 'vertical' && playerFit === 'cover' && !hasPlayedRef.current) {
|
|
394
|
+
setScaleMultiple(-2);
|
|
395
|
+
}
|
|
396
|
+
hasPlayedRef.current = true;
|
|
340
397
|
}
|
|
341
398
|
setPlayState(playState);
|
|
342
399
|
(_props$onPlayStatus = props.onPlayStatus) === null || _props$onPlayStatus === void 0 || _props$onPlayStatus.call(props, {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ray-js/ipc-player-integration",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.18-beta-2",
|
|
4
4
|
"description": "IPC 融合播放器",
|
|
5
5
|
"main": "lib/index",
|
|
6
6
|
"files": [
|
|
@@ -38,7 +38,7 @@
|
|
|
38
38
|
"@ray-js/ipc-ptz-zoom": "^0.0.2",
|
|
39
39
|
"@ray-js/panel-sdk": "^1.13.1",
|
|
40
40
|
"@ray-js/direction-control": "^0.0.8",
|
|
41
|
-
"@ray-js/ray-ipc-player": "
|
|
41
|
+
"@ray-js/ray-ipc-player": "2.0.26-beta-1",
|
|
42
42
|
"@ray-js/ray-ipc-utils": "^1.1.10",
|
|
43
43
|
"@ray-js/svg": "0.2.0",
|
|
44
44
|
"clsx": "^1.2.1",
|