@ray-js/ipc-player-integration 0.0.29-beta.13 → 0.0.29-beta.15

package/lib/ui/ui.js

@@ -20,6 +20,7 @@ import { useMemoizedFn } from '../hooks';
 import { Storage } from '../utils/storage';
 import './ui.less';
 import { updatePlayerWidgetProps } from '../features';
+import { isSmallScreen } from '../utils';
 function getCtxInstance(instance, devId) {
   if (instance) return instance;
   // eslint-disable-next-line react-hooks/rules-of-hooks
@@ -114,7 +115,6 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
     const {
       orientation
     } = data;
-    console.log(orientation, 'orientation=-====');
     if (['portrait', 'landscape-left', 'landscape-right'].includes(orientation)) {
       var _ty;
       if (typeof ((_ty = ty) === null || _ty === void 0 ? void 0 : _ty.getDeviceOrientationSync) !== 'function') return;
@@ -122,15 +122,15 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
         // 不是Player首页的话，禁止以下行为
         return;
       }
-      console.log('屏幕方向变化调用吗');
+      console.log('屏幕方向变化调用');
       setPageOrientation({
         pageOrientation: orientation === 'landscape-left' || orientation === 'landscape-right' ? 'landscape' : 'portrait',
         reverse: orientation === 'landscape-left',
         success: () => {
-          console.log('set page orientation success');
+          console.log('setPageOrientation success');
         },
         fail: err => {
-          console.log('set page orientation fail', err);
+          console.log('setPageOrientation fail', err);
         }
       });
     }
@@ -151,7 +151,7 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
       const {
         orientation
       } = ty.getDeviceOrientationSync();
-      console.log(orientation, 'initial orientation');
+      console.log('initial orientation', orientation);
       if (orientation === 'landscape-left' || orientation === 'landscape-right') {
         setScreenType('full');
       }
@@ -419,12 +419,8 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
       const {
         type
       } = sizeData;
-      console.log('监听到屏幕布局变化', type);
-      const {
-        deviceType
-      } = getSystemInfoSync();
-      //  针对pad 暂不支持横屏，且在ios pad模式下 会触发onResize事件, 待解决
-      if (deviceType === 'pad') {
+      //  针对pad 和折叠屏展开的情况暂不支持横屏，且在ios pad模式下 会触发onResize事件, 待解决
+      if (isSmallScreen) {
         setScreenType('vertical');
       } else {
         setScreenType(type === 'landscape' ? 'full' : 'vertical');
@@ -739,6 +735,7 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
     return false;
   });
   const playerContainerHeight = screenType === 'vertical' ? (style === null || style === void 0 ? void 0 : style.height) || '100%' : '100vh';
+  const isVerticalFullMode = isVerticalFullLayout && screenType === 'vertical';
   return /*#__PURE__*/React.createElement(UIEventContext.Provider, {
     value: {
       event: eventRef.current,
@@ -751,7 +748,7 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
     })
   }, /*#__PURE__*/React.createElement(View, {
     style: {
-      height: isVerticalFullLayout ? `calc(${playerContainerHeight} - 48px)` : playerContainerHeight
+      height: isVerticalFullMode ? `calc(${playerContainerHeight} - 48px)` : playerContainerHeight
     }
   }, /*#__PURE__*/React.createElement(IPCPlayer, {
     defaultMute: mute,
@@ -835,7 +832,7 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
     className: clsx('ipc-player-bottom-content', {
       'ipc-player-bottom-content-hide': componentHideState,
       'ipc-player-bottom-content-show': !componentHideState,
-      'ipc-player-bottom-content-full': isVerticalFullLayout
+      'ipc-player-bottom-content-full': isVerticalFullMode
     }),
     style: {
       height: screenType === 'vertical' ? '48px' : '72px'

package/lib/ui/ui.less

@@ -26,11 +26,11 @@
   }
 
   .ipc-player-bottom-content-full {
-    @media (prefers-color-scheme: dark) {
+    :root[theme='dark'] & {
       background: #000;
     }
 
-    @media (prefers-color-scheme: light) {
+    :root[theme='light'] & {
       background: #fff;
       --iconColor: #000;
 

package/lib/utils/index.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="jest" />
+export declare const isSmallScreen: boolean;
 /**
  * 麦克风对讲按钮径向渐变
  */

package/lib/utils/index.js

@@ -1,4 +1,14 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import { getSystemInfoSync } from '@ray-js/ray';
+const {
+  windowWidth,
+  screenWidth,
+  windowHeight
+} = getSystemInfoSync();
+
+// pad和折叠屏小窗口展示面板的情况
+export const isSmallScreen = !(screenWidth === windowWidth || screenWidth === windowHeight);
+
 /**
  * 麦克风对讲按钮径向渐变
  */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ray-js/ipc-player-integration",
-  "version": "0.0.29-beta.13",
+  "version": "0.0.29-beta.15",
   "description": "IPC 融合播放器",
   "main": "lib/index",
   "files": [