@ray-js/ipc-player-integration 0.0.35-beta.6 → 0.0.35-beta.7

package/lib/features/initPlayerWidgets/index.js

@@ -52,7 +52,6 @@ export async function initPlayerWidgets(ctx, options) {
       newDefaultBottomLeftContent[magnificationIndex].hidden = false;
     }
   }
-  console.log('res===1', newDefaultBottomLeftContent);
   ctx.addContent('bottomLeft', newDefaultBottomLeftContent);
   const newDefaultBottomRightContent = _cloneDeep(options.bottomRightContent || defaultBottomRightContent);
   const fullScreenIndex = newDefaultBottomRightContent.findIndex(item => item.id === 'FullScreen');

package/lib/ui/bottomLeftContent.js

@@ -96,6 +96,7 @@ const BottomLeftContent = _ref => {
     style: {
       paddingBottom: screenType === 'vertical' ? '14px' : '32px',
       paddingLeft: `${paddingLeftPx}px`,
+      paddingRight: '16px',
       width: '100%',
       overflowX: 'auto',
       overflowY: 'hidden',

package/lib/ui/ui.js

@@ -22,7 +22,6 @@ import { useMemoizedFn } from '../hooks';
 import { Storage } from '../utils/storage';
 import './ui.less';
 import { updatePlayerWidgetProps } from '../features';
-import { isSmallScreen } from '../utils';
 import { getSmartImageQualityState } from '../utils/ttt';
 function getCtxInstance(instance, devId) {
   if (instance) return instance;
@@ -116,6 +115,19 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
   // 展示顶部内容
   const [showTopContent, setShowTopContent] = useState(true);
 
+  // pad / 折叠屏小窗口展示面板的情况；getSystemInfoSync 在 onLoad 之后才有准确值，
+  // 这里给安全默认 false，由 onLoad / onResize 实际计算并更新
+  const [isSmallScreen, setIsSmallScreen] = useState(false);
+  const computeIsSmallScreen = useMemoizedFn(() => {
+    const {
+      windowWidth,
+      screenWidth,
+      windowHeight
+    } = getSystemInfoSync();
+    // 取小屏值判断是最准确的 pad / 折叠屏小窗口情况
+    return !(screenWidth === windowWidth || screenWidth === windowHeight);
+  });
+
   // 外部传入的ignoreHideStopPreview变化时，同步更新
   useEffect(() => {
     setIgnoreStopOnHide(ignoreHideStopPreview);
@@ -428,10 +440,14 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
   }, [brandColor, verticalMic]);
   const refreshSmartImageQuality = useMemoizedFn(() => {
     getSmartImageQualityState(devId).then(res => {
+      if (res === undefined) return;
       updatePlayerWidgetProps(instance, 'bottomLeft', 'TryExperience', {
+        isPurchase: res.isPurchase,
         buttonState: res.buttonState,
         trialRemainingSec: res.trialRemainingSec,
         refreshToken: Date.now()
+      }).catch(() => {
+        // ignore
       });
     });
   });
@@ -469,6 +485,13 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
    * 监听播放器实例创建完成
    */
 
+  /**
+   * 页面 onLoad 后才能拿到准确的 systemInfo，这里第一次确定小屏状态
+   */
+  usePageEvent('onLoad', () => {
+    setIsSmallScreen(computeIsSmallScreen());
+  });
+
   /**
    * 监听屏幕布局变化
    */
@@ -482,8 +505,13 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
       const {
         type
       } = sizeData;
+
+      // 折叠屏展开/收起、pad 多窗口拖拽等场景，需要重新计算并同步
+      const small = computeIsSmallScreen();
+      setIsSmallScreen(small);
+
       //  针对pad 和折叠屏展开的情况暂不支持横屏，且在ios pad模式下 会触发onResize事件, 待解决
-      if (isSmallScreen) {
+      if (small) {
         setScreenType('vertical');
       } else {
         setScreenType(type === 'landscape' ? 'full' : 'vertical');

package/lib/utils/index.d.ts

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

package/lib/utils/index.js

@@ -1,14 +1,4 @@
 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/lib/utils/navigation.d.ts

@@ -4,3 +4,4 @@ export declare const miniIdLabs: {
 };
 export declare function gotoAIDrawMiniProgram(devId: string, brandColor: string): void;
 export declare function gotoSecurityCloudService(homeId: string, uuid: string): Promise<void>;
+export declare function gotoSecurityCloudService2(devId: string): Promise<import("@ray-js/ray-ipc-utils/lib/interface").IRes<unknown>>;

package/lib/utils/navigation.js

@@ -1,4 +1,4 @@
-import { goToMiniProgramByShortLink } from '@ray-js/ray-ipc-utils';
+import { getServiceUrl, goToMiniProgramByShortLink } from '@ray-js/ray-ipc-utils';
 import Color from 'color';
 
 // 小程序ID集合
@@ -17,4 +17,7 @@ export function gotoAIDrawMiniProgram(devId, brandColor) {
 export async function gotoSecurityCloudService(homeId, uuid) {
   const url = `godzilla://${miniIdLabs.securityCloudService}${'/pages/serviceList/index'}?homeId=${homeId}&deviceId=${uuid}&categoryCode=${'security_cloud_service'}`;
   goToMiniProgramByShortLink(url, 'right');
+}
+export async function gotoSecurityCloudService2(devId) {
+  return getServiceUrl(devId, 'security_cloud_service', {}, true);
 }

package/lib/utils/ttt.d.ts

@@ -37,3 +37,4 @@ export declare function getAIFrameFeature(devId: string): Promise<GetAIFrameFeat
 export declare function setAIFrameFeature(params: SetAIFrameFeatureParams): Promise<any>;
 export declare function getDeviceInfoRay(devId: string): Promise<unknown>;
 export declare function getCurrentHomeInfoRay(): Promise<unknown>;
+export declare function setTrailFinish(devId: string): Promise<unknown>;

package/lib/utils/ttt.js

@@ -1,11 +1,6 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 export function getSmartImageQualityState(devId) {
-  return new Promise((resolve, reject) => {
-    var _ty;
-    if (typeof ((_ty = ty) === null || _ty === void 0 || (_ty = _ty.ipc) === null || _ty === void 0 ? void 0 : _ty.getSmartImageQualityState) !== 'function') {
-      reject(new Error('getSmartImageQualityState is not supported'));
-      return;
-    }
+  return new Promise(resolve => {
     try {
       ty.ipc.getSmartImageQualityState({
         devId,
@@ -14,24 +9,17 @@ export function getSmartImageQualityState(devId) {
           console.log('res===getSmartImageQualityState data', data);
           resolve(data);
         },
-        fail: e => {
-          console.warn('res===getSmartImageQualityState fail', e);
-          reject(e);
+        fail: () => {
+          resolve(undefined);
         }
       });
     } catch (e) {
-      console.warn('res===getSmartImageQualityState exception', e);
-      reject(e);
+      resolve(undefined);
     }
   });
 }
 export function getAIFrameFeature(devId) {
-  return new Promise((resolve, reject) => {
-    var _ty2;
-    if (typeof ((_ty2 = ty) === null || _ty2 === void 0 || (_ty2 = _ty2.ipc) === null || _ty2 === void 0 ? void 0 : _ty2.getAIFrameFeature) !== 'function') {
-      reject(new Error('getAIFrameFeature is not supported'));
-      return;
-    }
+  return new Promise(resolve => {
     try {
       ty.ipc.getAIFrameFeature({
         devId,
@@ -41,22 +29,16 @@ export function getAIFrameFeature(devId) {
         },
         fail: e => {
           console.warn('res===getAIFrameFeature fail', e);
-          reject(e);
+          resolve(undefined);
         }
       });
     } catch (e) {
-      console.warn('res===getAIFrameFeature exception', e);
-      reject(e);
+      resolve(undefined);
     }
   });
 }
 export function setAIFrameFeature(params) {
-  return new Promise((resolve, reject) => {
-    var _ty3;
-    if (typeof ((_ty3 = ty) === null || _ty3 === void 0 || (_ty3 = _ty3.ipc) === null || _ty3 === void 0 ? void 0 : _ty3.setAIFrameFeature) !== 'function') {
-      reject(new Error('setAIFrameFeature is not supported'));
-      return;
-    }
+  return new Promise(resolve => {
     try {
       ty.ipc.setAIFrameFeature(_objectSpread(_objectSpread({}, params), {}, {
         success: data => {
@@ -65,55 +47,61 @@ export function setAIFrameFeature(params) {
         },
         fail: e => {
           console.warn('res===setAIFrameFeature fail', e);
-          reject(e);
+          resolve(undefined);
         }
       }));
     } catch (e) {
-      console.warn('res===setAIFrameFeature exception', e);
-      reject(e);
+      resolve(undefined);
     }
   });
 }
 export function getDeviceInfoRay(devId) {
-  return new Promise((resolve, reject) => {
-    var _ty4;
-    if (typeof ((_ty4 = ty) === null || _ty4 === void 0 || (_ty4 = _ty4.device) === null || _ty4 === void 0 ? void 0 : _ty4.getDeviceInfo) !== 'function') {
-      reject(new Error('getDeviceInfo is not supported'));
-      return;
-    }
+  return new Promise(resolve => {
     try {
       ty.device.getDeviceInfo({
         deviceId: devId,
         success: res => {
           resolve(res);
         },
-        fail: error => {
-          reject(error);
+        fail: () => {
+          resolve(undefined);
         }
       });
     } catch (e) {
-      reject(e);
+      resolve(undefined);
     }
   });
 }
 export function getCurrentHomeInfoRay() {
-  return new Promise((resolve, reject) => {
-    var _ty5;
-    if (typeof ((_ty5 = ty) === null || _ty5 === void 0 || (_ty5 = _ty5.home) === null || _ty5 === void 0 ? void 0 : _ty5.getCurrentHomeInfo) !== 'function') {
-      reject(new Error('getCurrentHomeInfo is not supported'));
-      return;
-    }
+  return new Promise(resolve => {
     try {
       ty.home.getCurrentHomeInfo({
         success: res => {
           resolve(res);
         },
-        fail: error => {
-          reject(error);
+        fail: () => {
+          resolve(undefined);
+        }
+      });
+    } catch (e) {
+      resolve(undefined);
+    }
+  });
+}
+export function setTrailFinish(devId) {
+  return new Promise(resolve => {
+    try {
+      ty.ipc.setTrailFinish({
+        devId,
+        success: res => {
+          resolve(res);
+        },
+        fail: () => {
+          resolve(undefined);
         }
       });
     } catch (e) {
-      reject(e);
+      resolve(undefined);
     }
   });
 }

package/lib/widgets/trialBadge/useTrialBadge.js

@@ -1,6 +1,6 @@
 import { useCallback, useEffect, useState } from 'react';
-import { getCurrentHomeInfoRay, getDeviceInfoRay } from '../../utils/ttt';
-import { gotoSecurityCloudService } from '../../utils';
+import { setTrailFinish } from '../../utils/ttt';
+import { gotoSecurityCloudService2 } from '../../utils';
 import { trialCountdownEnd } from '../../ui/constant';
 import Strings from '../../i18n';
 export const useTrialBadge = (event, devId, trialRemainingSec) => {
@@ -12,12 +12,14 @@ export const useTrialBadge = (event, devId, trialRemainingSec) => {
   }, [trialRemainingSec]);
   const handleTrialSubscribe = useCallback(async () => {
     try {
-      const homeInfo = await getCurrentHomeInfoRay();
-      const deviceInfo = await getDeviceInfoRay(devId);
-      console.log('res===', deviceInfo, homeInfo);
-      gotoSecurityCloudService(homeInfo.homeId, deviceInfo.uuid);
+      // const homeInfo = await getCurrentHomeInfoRay();
+      // const deviceInfo = await getDeviceInfoRay(devId);
+      // if (homeInfo !== undefined && deviceInfo !== undefined) {
+      // console.log('res===', deviceInfo, homeInfo);
+      // gotoSecurityCloudService(homeInfo.homeId, deviceInfo.uuid);
+      const res = await gotoSecurityCloudService2(devId);
+      console.log('res===gotoSecurityCloudService2', res);
     } catch (error) {
-      console.log('res===handleTrialSubscribe error', error);
       ty.showToast({
         title: Strings.getLang('ipc_player_fetch_error'),
         icon: 'none'
@@ -26,9 +28,9 @@ export const useTrialBadge = (event, devId, trialRemainingSec) => {
   }, [devId]);
   const handleCountdownEnd = useCallback(async () => {
     try {
-      console.log('res===handleCountdownEnd');
       setShowTrialBadge(false);
       event.emit(trialCountdownEnd);
+      await setTrailFinish(devId);
     } catch (error) {
       ty.showToast({
         title: Strings.getLang('ipc_player_fetch_error'),

package/lib/widgets/tryExperience/tryExperience.d.ts

@@ -5,6 +5,8 @@ type Props = ComponentConfigProps & {
     className?: string;
     hideTryExperienceMenu?: boolean;
     buttonState?: number;
+    trialRemainingSec?: number;
+    isPurchase?: boolean;
 };
 export declare const TryExperience: (props: Props) => React.JSX.Element | null;
 export {};

package/lib/widgets/tryExperience/tryExperience.js

@@ -1,6 +1,6 @@
 import { View, Image, getSystemInfoSync } from '@ray-js/ray';
 import clsx from 'clsx';
-import React from 'react';
+import React, { useState, useEffect } from 'react';
 import { useStore } from '../../ctx/store';
 import { gotoAIDrawMiniProgram } from '../../utils';
 import tryZh from '../../res/try/try_zh.png';
@@ -41,27 +41,41 @@ export const TryExperience = props => {
   const {
     className,
     hideTryExperienceMenu,
-    buttonState
+    buttonState,
+    trialRemainingSec,
+    isPurchase
   } = props;
   const {
     brandColor
   } = useStore({
     brandColor: props.brandColor
   });
+  const [imgSrc, setImgSrc] = useState();
+  useEffect(() => {
+    const iconUrl = pickIconByStatus(buttonState);
+    setImgSrc(iconUrl);
+  }, [buttonState]);
   if (hideTryExperienceMenu) {
     return null;
   }
-  const iconUrl = pickIconByStatus(buttonState);
   return /*#__PURE__*/React.createElement(View, {
     className: clsx(className),
     onClick: () => {
-      gotoAIDrawMiniProgram(props.devId, brandColor);
+      if (buttonState === TryExperienceStatus.Open) {
+        setImgSrc(tryOpen);
+      } else if (buttonState === TryExperienceStatus.Close && isPurchase) {
+        setImgSrc(tryClose);
+      } else if (buttonState === TryExperienceStatus.Close && trialRemainingSec < 300 && trialRemainingSec > 0) {
+        setImgSrc(tryClose);
+      } else {
+        gotoAIDrawMiniProgram(props.devId, brandColor);
+      }
     }
   }, /*#__PURE__*/React.createElement(View, {
     className: "try-experience-box"
-  }, /*#__PURE__*/React.createElement(Image, {
+  }, imgSrc && /*#__PURE__*/React.createElement(Image, {
     className: "try-experience-icon",
-    src: iconUrl,
+    src: imgSrc,
     mode: "heightFix"
   })));
 };

package/package.json

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