@ray-js/ipc-player-integration 0.0.18-beta-5 → 0.0.18-beta-6

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.
Files changed (2) hide show
  1. package/lib/ui/ui.js +72 -58
  2. package/package.json +1 -1
package/lib/ui/ui.js CHANGED
@@ -88,6 +88,7 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
88
88
  }
89
89
  useImperativeHandle(eventRefProp, () => eventRef.current, [eventRef.current]);
90
90
  const timer = useRef();
91
+ const reGetOrientationTimer = useRef(null);
91
92
  const [scaleMultiple, setScaleMultiple] = useState(playerFit === 'contain' ? 1 : -2);
92
93
  const [currentZoomLevel, setCurrentZoomLevel] = useState(playerFit === 'contain' ? 1 : -2);
93
94
  const [createCtx, setCreateCtx] = useState(false);
@@ -116,44 +117,59 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
116
117
  resolution: instance.resolution,
117
118
  mute: instance.mute
118
119
  });
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') {
120
+ const getAndSetOrientation = () => {
121
+ try {
122
+ var _ty;
123
+ if (typeof ((_ty = ty) === null || _ty === void 0 ? void 0 : _ty.getOrientationSync) === 'function') {
124
+ const {
125
+ orientation
126
+ } = ty.getOrientationSync();
127
+ console.log(`同步获取屏幕方向: ${orientation}`);
128
+ ipcTTTOperatorLog(`同步获取屏幕方向: ${orientation}`);
129
+ if (orientation === 'unknown') {
130
+ // 1秒后重试一次
131
+ reGetOrientationTimer.current = setTimeout(getAndSetOrientation, 500);
132
+ return;
133
+ }
134
+ if (['portrait', 'portrait-upside-down', 'landscape-left', 'landscape-right', 'landscape'].includes(orientation)) {
126
135
  const {
127
- orientation
128
- } = ty.getOrientationSync();
129
- console.log(`同步获取屏幕方向: ${orientation}`);
130
- ipcTTTOperatorLog(`同步获取屏幕方向: ${orientation}`);
131
- if (['portrait', 'portrait-upside-down', 'landscape-left', 'landscape-right', 'landscape'].includes(orientation)) {
132
- const {
133
- deviceType
134
- } = systemInfo.current;
135
- if (deviceType === 'pad') {
136
- setScreenType('vertical');
137
- return;
138
- }
139
- const pageOrientation = orientation === 'landscape-left' || orientation === 'landscape-right' || orientation === 'landscape' ? 'landscape' : 'portrait';
136
+ deviceType
137
+ } = systemInfo.current;
138
+ if (deviceType === 'pad') {
139
+ setScreenType('vertical');
140
+ return;
141
+ }
142
+ const pageOrientation = orientation === 'landscape-left' || orientation === 'landscape-right' || orientation === 'landscape' ? 'landscape' : 'portrait';
143
+ if (pageOrientation === 'landscape') {
144
+ // 如果为横屏的情况下，直接设置为全屏
140
145
  setScreenType(pageOrientation === 'landscape' ? 'full' : 'vertical');
141
- // 强制更改页面转向
142
- setPageOrientation({
143
- pageOrientation,
144
- success: () => {
145
- console.log('success');
146
- },
147
- fail: err => {
148
- console.log('err', err);
149
- }
150
- });
151
146
  }
147
+
148
+ // setPageOrientation({
149
+ // pageOrientation,
150
+ // success: () => {
151
+ // console.log('success');
152
+ // },
153
+ // fail: err => {
154
+ // console.log('err', err);
155
+ // },
156
+ // });
152
157
  }
153
- } catch (e) {
154
- console.log('获取屏幕方向失败');
155
158
  }
159
+ } catch (e) {
160
+ console.log('获取屏幕方向失败');
156
161
  }
162
+ };
163
+ useEffect(() => {
164
+ // 首次进来强制为竖屏
165
+ if (createCtx) {
166
+ getAndSetOrientation();
167
+ }
168
+ return () => {
169
+ if (reGetOrientationTimer.current) {
170
+ clearTimeout(reGetOrientationTimer.current);
171
+ }
172
+ };
157
173
  }, [createCtx]);
158
174
  useEffect(() => {
159
175
  var _ty2;
@@ -195,29 +211,28 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
195
211
  if (['portrait', 'portrait-upside-down', 'landscape-left', 'landscape-right'].includes(orientation)) {
196
212
  setScreenType(orientation === 'landscape-left' || orientation === 'landscape-right' ? 'full' : 'vertical');
197
213
  const pageOrientation = orientation === 'landscape-left' || orientation === 'landscape-right' ? 'landscape' : 'portrait';
198
- const {
199
- deviceType
200
- } = systemInfo.current;
201
- // 针对pad 暂不支持横屏，且在ios pad模式下 会触发onResize事件, 待解决
202
- if (deviceType === 'pad') {
203
- setScreenType('vertical');
204
- } else {
205
- setScreenType(pageOrientation === 'landscape' ? 'full' : 'vertical');
206
- triggerEvent(showAllComponent);
207
- }
208
- // 若为全屏模式并且要求按宽填充，即横屏时充满，主动设置模式为-1即可
209
- if (pageOrientation === 'landscape' && landscapeMode === 'fill') {
210
- console.log(scaleMultiple, '===========fill');
211
- setScaleMultiple(-1);
212
- } else if (pageOrientation === 'landscape' && landscapeMode === 'standard') {
213
- console.log(scaleMultiple, '===========landscape');
214
- setScaleMultiple(-2);
215
- } else {
216
- // 竖屏时 将屏幕播放比例设为按宽按高
217
214
 
218
- console.log(scaleMultiple, '===========landscape');
219
- setScaleMultiple(playerFit === 'contain' ? scaleMultiple === 1 ? -1 : 1 : -2);
220
- }
215
+ // const { deviceType } = systemInfo.current;
216
+ // // 针对pad 暂不支持横屏，且在ios pad模式下 会触发onResize事件, 待解决
217
+ // if (deviceType === 'pad') {
218
+ // setScreenType('vertical');
219
+ // } else {
220
+ // setScreenType(pageOrientation === 'landscape' ? 'full' : 'vertical');
221
+ // triggerEvent(showAllComponent);
222
+ // }
223
+ // // 若为全屏模式并且要求按宽填充，即横屏时充满，主动设置模式为-1即可
224
+ // if (pageOrientation === 'landscape' && landscapeMode === 'fill') {
225
+ // console.log(scaleMultiple, '===========fill');
226
+ // setScaleMultiple(-1);
227
+ // } else if (pageOrientation === 'landscape' && landscapeMode === 'standard') {
228
+ // console.log(scaleMultiple, '===========landscape');
229
+ // setScaleMultiple(-2);
230
+ // } else {
231
+ // // 竖屏时 将屏幕播放比例设为按宽按高
232
+
233
+ // console.log(scaleMultiple, '===========landscape');
234
+ // setScaleMultiple(playerFit === 'contain' ? (scaleMultiple === 1 ? -1 : 1) : -2);
235
+ // }
221
236
  // 强制更改页面转向
222
237
  setPageOrientation({
223
238
  pageOrientation,
@@ -235,10 +250,9 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
235
250
  * 监听屏幕布局变化
236
251
  */
237
252
  usePageEvent('onResize', useMemoizedFn(sizeData => {
238
- var _ty4;
239
- if (typeof ((_ty4 = ty) === null || _ty4 === void 0 ? void 0 : _ty4.onOrientationChange) === 'function') {
240
- return;
241
- }
253
+ // if (typeof ty?.onOrientationChange === 'function') {
254
+ // return;
255
+ // }
242
256
  try {
243
257
  const {
244
258
  type
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ray-js/ipc-player-integration",
3
- "version": "0.0.18-beta-5",
3
+ "version": "0.0.18-beta-6",
4
4
  "description": "IPC 融合播放器",
5
5
  "main": "lib/index",
6
6
  "files": [