@ray-js/ipc-player-integration 0.0.1-beta-45 → 0.0.1-beta-47

package/lib/ctx/ctx.js

@@ -80,7 +80,9 @@ export const createUseCtx = _ref => {
       eventRef.current = getEventInstance();
     }
     useEffect(() => {
+      console.log('========================+++++');
       if (devId && _playState === PlayState.PLAYING) {
+        console.log('===================');
         // 获取缓存的值且同步
         getMemoryState(devId).then(res => {
           console.log('==== getMemoryState ====', res);

package/lib/hooks/index.d.ts

@@ -4,3 +4,4 @@ export * from './useTemperature';
 export * from './useDpState';
 export * from './useMemoizedFn';
 export * from './usePtz';
+export * from './useSchemaInfo.tsx';

package/lib/hooks/index.js

@@ -3,4 +3,5 @@ export * from './useHumidity';
 export * from './useTemperature';
 export * from './useDpState';
 export * from './useMemoizedFn';
-export * from './usePtz';
+export * from './usePtz';
+export * from './useSchemaInfo.tsx';

package/lib/hooks/useSchemaInfo.tsx/index.d.ts

@@ -0,0 +1,2 @@
+import { Schema } from '../../utils/device';
+export declare function useSchemaInfo<T extends string>(devId: string, dpCodes: T[]): [Record<T, Schema> | null];

package/lib/hooks/useSchemaInfo.tsx/index.js

@@ -0,0 +1,17 @@
+import { useState, useEffect } from 'react';
+import { getDpSchemaByCodes, getDpSchemaByCodesSync } from '../../utils/device';
+export function useSchemaInfo(devId, dpCodes) {
+  const [schemaInfo, setSchemaInfo] = useState(() => {
+    const info = getDpSchemaByCodesSync(devId, dpCodes);
+    if (info) return info;
+    return null;
+  });
+  useEffect(() => {
+    if (!schemaInfo) {
+      getDpSchemaByCodes(devId, dpCodes).then(res => {
+        setSchemaInfo(res);
+      });
+    }
+  }, [schemaInfo]);
+  return [schemaInfo];
+}

package/lib/plugins/battery/battery.composition.d.ts

@@ -39,7 +39,7 @@ export declare const Battery: import("react").FunctionComponent<{
     hideContent: (type: import("../..").ContentPlaceType, id: string) => void;
     showContent: (type: import("../..").ContentPlaceType, id: string) => void;
     toast: import("../../ports.output").Toast;
-    event: import("../../interface").EventInstance;
+    event: import("../..").EventInstance;
 } & {
     className?: string | undefined;
 }>;
@@ -83,7 +83,7 @@ export declare const BatteryFull: import("react").FunctionComponent<{
     hideContent: (type: import("../..").ContentPlaceType, id: string) => void;
     showContent: (type: import("../..").ContentPlaceType, id: string) => void;
     toast: import("../../ports.output").Toast;
-    event: import("../../interface").EventInstance;
+    event: import("../..").EventInstance;
 } & {
     className?: string | undefined;
 }>;

package/lib/plugins/fullScreen/fullScreen.js

@@ -124,7 +124,7 @@ export function FullScreen(props) {
   if (screenType === 'full' || hideHorizontalMenu) return null;
   return /*#__PURE__*/React.createElement(View, {
     className: clsx(className),
-    onClick: () => handClick('full')
+    onTouchStart: () => handClick('full')
   }, /*#__PURE__*/React.createElement(Text, {
     className: clsx('icon-panel', 'icon-panel-landscape', 'ipc-player-plugin-full-screen')
   }));

package/lib/plugins/fullScreen/fullTravelRouteControl.js

@@ -12,6 +12,7 @@ import { useDpState } from '../../hooks';
 import { useComponentHideState } from '../../ui/hooks';
 import { pauseTimeToHideAllComponent, startTimeToHideAllComponent } from '../../ui/constant';
 import { DIRECTION_CONTROL_DP_CODE } from './constant';
+import { useStore } from '../../ctx/store';
 export function FullTravelRouteControl(props) {
   const [shouldHide] = useComponentHideState();
   const [isPtzActive, setIsPtzActive] = useState(false);
@@ -19,6 +20,11 @@ export function FullTravelRouteControl(props) {
     event
   } = useContext(UIEventContext);
   const prevRotate = useRef('-1');
+  const {
+    brandColor
+  } = useStore({
+    brandColor: props.brandColor
+  });
   const [state, _, sendDp] = useDpState({
     devId: props.devId,
     dpCodes: [DIRECTION_CONTROL_DP_CODE],
@@ -38,6 +44,10 @@ export function FullTravelRouteControl(props) {
       event.off('ptzControlHide', onPtzControlHide);
     };
   }, []);
+  const handTouchEnd = () => {
+    event.emit(startTimeToHideAllComponent);
+    sendDpValue('-1');
+  };
   const {
     run: sendDpValue
   } = useDebounceFn(value => {
@@ -65,9 +75,10 @@ export function FullTravelRouteControl(props) {
       event.emit(pauseTimeToHideAllComponent);
       sendDpValue(String(value));
     },
-    onTouchEnd: () => {
-      event.emit(startTimeToHideAllComponent);
-      sendDpValue('-1');
-    }
+    onTouchEnd: handTouchEnd,
+    onMoveNonIntersection: handTouchEnd,
+    showArcOnTouchInEdgeProximity: true,
+    arcEdgeProximityColor: brandColor,
+    touchDistanceThreshold: 50
   }));
 }

package/lib/plugins/moveInteractiveControl/moveInteractiveControl.js

@@ -1,12 +1,27 @@
-import React, { useCallback, useContext, useEffect, useState } from 'react';
+import "core-js/modules/esnext.iterator.constructor.js";
+import "core-js/modules/esnext.iterator.map.js";
+import React, { useCallback, useContext, useEffect, useState, useMemo } from 'react';
 import clsx from 'clsx';
 import { MoveInterActiveControlUI } from './moveInteractiveControlUI';
 import { playerTap, showAllComponent } from '../../ui/constant';
-import { useDpState } from '../../hooks';
+import { useDpState, useSchemaInfo } from '../../hooks';
 import { UIEventContext } from '../../ui/context';
 import './moveInteractiveControl.less';
 const TYPE_CODE = 'ipc_manual_petting';
 const STATE_CODE = 'ipc_manual_petting_state';
+const iconMap = {
+  '0': 'icon-panel-move-control-rotate-place',
+  '1': 'icon-panel-move-control-straight-line',
+  '2': 'icon-panel-move-control-8',
+  '3': 'icon-panel-move-control-rotation',
+  '4': 'icon-panel-move-control-big-rotation',
+  '5': 'icon-panel-move-control-z',
+  '6': 'icon-panel-move-control-wave',
+  '7': 'icon-panel-move-control-p-steering',
+  '8': 'icon-panel-move-control-chacha',
+  '9': 'icon-panel-tange1',
+  '10': 'icon-panel-move-control-waltz'
+};
 export function MoveInteractiveControl(props) {
   const {
     devId
@@ -17,6 +32,17 @@ export function MoveInteractiveControl(props) {
     listenDpChange: false
   });
   console.log('state', state);
+  const [schemaInfo] = useSchemaInfo(devId, [TYPE_CODE]);
+  const menu = useMemo(() => {
+    if (!schemaInfo || !(schemaInfo !== null && schemaInfo !== void 0 && schemaInfo[TYPE_CODE])) {
+      return [];
+    }
+    return schemaInfo[TYPE_CODE].property.range.map(key => ({
+      key,
+      label: I18n.t(`dp_ipc_manual_petting_${key}`),
+      iconName: iconMap[key]
+    }));
+  }, [schemaInfo]);
   const {
     event
   } = useContext(UIEventContext);
@@ -40,6 +66,7 @@ export function MoveInteractiveControl(props) {
     wrapClsName: clsx('ipc-player-plugin-move-control', {
       'ipc-player-plugin-move-control-hide': hide
     }),
+    menu: menu,
     onClick: value => {
       sendDp({
         [TYPE_CODE]: value

package/lib/plugins/moveInteractiveControl/moveInteractiveControlUI.js

@@ -70,7 +70,8 @@ export function MoveInterActiveControlUI(props) {
     activeKey,
     onClick
   } = props;
-  const handClick = item => {
+  const handClick = (item, e) => {
+    e.origin.stopPropagation();
     onClick && onClick(item.key);
   };
   return /*#__PURE__*/React.createElement(View
@@ -88,7 +89,7 @@ export function MoveInterActiveControlUI(props) {
   }, /*#__PURE__*/React.createElement(View, {
     className: clsx('ipc-player-plugin-active-control', contentClsName)
   }, menu.map(item => /*#__PURE__*/React.createElement(View, {
-    onClick: () => handClick(item),
+    onClick: e => handClick(item, e),
     key: item.key,
     className: clsx('ipc-player-plugin-active-control-item', {
       'ipc-player-plugin-active-control-item-active': activeKey === item.key

package/lib/plugins/resolution/resolution.js

@@ -29,7 +29,9 @@ export const Resolution = props => {
     event
   } = useContext(UIEventContext);
   const onResolution = useMemoizedFn(() => {
+    console.log('你触发了高标清点击了吗');
     event.emit('resolutionBtnControlClick');
+    console.log(`screenType: ${screenType}`);
     if (screenType === 'full') {
       event.emit(hideAllComponent);
       if (hasContent('absolute', fullResolutionId)) {
@@ -55,11 +57,12 @@ export const Resolution = props => {
   });
   return /*#__PURE__*/React.createElement(View, {
     onClick: onResolution,
-    className: clsx(className, screenType === 'vertical' ? 'ipc-player-plugin-resolution-vertical' : 'ipc-player-plugin-resolution-full')
+    className: clsx(className)
   }, /*#__PURE__*/React.createElement(View, {
     className: clsx('ipc-player-plugin-resolution', {
       'ipc-player-plugin-resolution-full': screenType === 'full'
-    })
+    }),
+    onClick: onResolution
   }, /*#__PURE__*/React.createElement(Text, {
     className: "resolutionText"
   }, Strings.getLang(`ipc_player_resolution_${resolution}`))));

package/lib/plugins/voiceIntercom/voiceIntercom.js

@@ -71,14 +71,8 @@ export const VoiceIntercom = props => {
   };
   const endVoice = async () => {
     console.log('=== 结束对讲 ====');
-    // 单向对讲，结束对讲之后，强制关闭静态状态
-    if (intercomMode === IntercomMode.OneWay) {
-      console.log('=== 单向对讲，强制关闭静音状态 ===');
-      await setMute(false);
-    } else {
-      console.log(`=== 双向对讲，恢复对讲之前的静音状态 ${originMuteStatusBeforeVoice.current}===`);
-      await setMute(originMuteStatusBeforeVoice.current);
-    }
+    // 对讲结束之后，统一关闭静态状态
+    await setMute(false);
     await setIntercom(false);
     event.emit(startTimeToHideAllComponent);
   };

package/lib/ui/event.d.ts

@@ -1,8 +1,2 @@
-type Task = (...args: any[]) => void;
-export type EventInstance = {
-    on: (type: string, cb: Task) => void;
-    off: (type: string, cb: Task) => void;
-    emit: (type: string, ...args: any[]) => void;
-};
+import { EventInstance } from '../interface';
 export declare function getEventInstance(): EventInstance;
-export {};

package/lib/ui/ui.d.ts

@@ -1,6 +1,5 @@
 import React from 'react';
-import { PlayStatusData, UseCtx } from '../interface';
-import { EventInstance } from './event';
+import { PlayStatusData, UseCtx, EventInstance } from '../interface';
 import './ui.less';
 type CtxInstance = ReturnType<UseCtx>;
 type CSSVariable = {
@@ -26,6 +25,8 @@ type Props = {
     brandColor?: string;
     verticalMic?: boolean;
     eventRef?: React.RefObject<EventInstance>;
+    onPlayerTap?: (data: any) => void;
+    extend?: Record<string, any>;
 };
 export declare const IPCPlayerIntegration: React.MemoExoticComponent<(props: Props) => React.JSX.Element>;
 export {};

package/lib/ui/ui.js

@@ -1,3 +1,4 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import "core-js/modules/esnext.iterator.constructor.js";
 import "core-js/modules/esnext.iterator.map.js";
@@ -49,7 +50,9 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
     deviceOnline = true,
     brandColor = '#FF592A',
     verticalMic = true,
-    eventRef: eventRefProp
+    eventRef: eventRefProp,
+    onPlayerTap,
+    extend = {}
   } = props;
   const instance = getCtxInstance(props.instance, devId);
   const {
@@ -258,7 +261,7 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
       // backgroundColor: 'rgba(0,0,0,0.2)',
       height: screenType === 'vertical' ? (style === null || style === void 0 ? void 0 : style.height) || '100%' : '100vh'
     })
-  }, /*#__PURE__*/React.createElement(IPCPlayer, {
+  }, /*#__PURE__*/React.createElement(IPCPlayer, _extends({
     objectFit: "",
     defaultMute: mute,
     devId: devId,
@@ -266,16 +269,14 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
     ipcPlayerContext: instance.IPCPlayerInstance,
     onChangeStreamStatus: code => {
       var _props$onPlayStatus;
-      console.log(code, 'code');
       const playStateMap = {
         [PlayerStreamStatus.PreviewSuccess]: PlayState.PLAYING,
         // 播放中
         [PlayerStreamStatus.PAUSE]: PlayState.PAUSE // 暂停
       };
-      const playState = playStateMap[code];
-      if (typeof playState !== 'undefined') {
-        setPlayState(playState);
-      }
+      // 合并为三种状态 连接中 暂停 播放中
+      const playState = playStateMap[code] || PlayState.CONNECTING;
+      setPlayState(playState);
       (_props$onPlayStatus = props.onPlayStatus) === null || _props$onPlayStatus === void 0 || _props$onPlayStatus.call(props, {
         playState,
         playCode: code
@@ -285,18 +286,6 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
     // onCtx={getIpcPlayer}
     // onPlayerTap={handlePlayerClick}
     ,
-    onZoomChange: data => {
-      console.log(`zoomChange事件: ${JSON.stringify(data)}`);
-    },
-    onCameraPreviewFailure: data => {
-      console.log(`onCameraPreviewFailure事件: ${JSON.stringify(data)}`);
-      // ty.showToast({
-      //   title: `onCameraPreviewFailure事件: ${JSON.stringify(data)}`,
-      // });
-      // setTimeout(() => {
-      //   ty.hideToast();
-      // }, 3000);
-    },
     onCameraNotifyWeakNetwork: data => {
       console.log(`onCameraNotifyWeakNetwork: ${JSON.stringify(data)}`);
     },
@@ -306,10 +295,11 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
     ptzControllable: screenType === 'vertical',
     privateState: privateState,
     onPlayerTap: data => {
-      if (disablePlayerTap.current) {
-        console.log('playerTap 事件已禁止');
-        return;
-      }
+      onPlayerTap(data);
+      // if (disablePlayerTap.current) {
+      //   console.log('playerTap 事件已禁止');
+      //   return;
+      // }
       console.log('res===on onVideoTap', data);
       eventRef.current.emit(playerTap);
       console.log(prevTriggerEvent.current, 'prevTriggerEvent.current');
@@ -318,11 +308,12 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
       } else {
         triggerEvent(hideAllComponent);
       }
+      // onPlayerTap(data);
       return false; // eslint-disable-line
     } // 对应原来的onVideoTap
     ,
     brandColor: brandColor
-  }), /*#__PURE__*/React.createElement(View, {
+  }, extend)), /*#__PURE__*/React.createElement(View, {
     className: clsx('ipc-player-top-content', {
       'ipc-player-top-content-hide': componentHideState,
       'ipc-player-top-content-show': !componentHideState

package/lib/utils/device/index.js

@@ -43,27 +43,41 @@ export function getDeviceInfo(devId) {
     });
   });
 }
-export function getDpIdsByCodes(devId) {
-  return new Promise((resolve, reject) => {
-    ty.device.getDeviceInfo({
-      deviceId: devId,
-      success: res => {
-        console.log('res', res);
-        // console.log('res', res);
-        // const { dps } = res;
-        // // @ts-ignore
-        // const ret: Record<T, any> = {};
-        // options.dps.forEach(dpId => {
-        //   ret[dpId] = dps[dpId];
-        // });
-        // resolve(ret);
-      },
-      fail: err => {
-        reject(err); // eslint-disable-line
+const memorySchema = {};
+export function getDpSchemaByCodes(devId, dpCodes) {
+  return new Promise(resolve => {
+    const ret = {};
+    if (memorySchema[devId]) {
+      dpCodes.forEach(code => {
+        ret[code] = memorySchema[devId][code];
+      });
+      resolve(ret);
+      return;
+    }
+    getDeviceInfo(devId).then(res => {
+      if (!memorySchema[devId]) {
+        memorySchema[devId] = {};
+        res.schema.forEach(item => {
+          memorySchema[devId][item.code] = item;
+        });
       }
+      dpCodes.forEach(code => {
+        ret[code] = memorySchema[devId][code];
+      });
+      resolve(ret);
     });
   });
 }
+export function getDpSchemaByCodesSync(devId, dpCodes) {
+  const ret = {};
+  if (memorySchema[devId]) {
+    dpCodes.forEach(code => {
+      ret[code] = memorySchema[devId][code];
+    });
+    return ret;
+  }
+  return null;
+}
 export const showMathPowValue = (value, scale) => {
   if (isNaN(Number(value))) {
     return 0;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ray-js/ipc-player-integration",
-  "version": "0.0.1-beta-45",
+  "version": "0.0.1-beta-47",
   "description": "IPC 播放器功能集成",
   "main": "lib/index",
   "files": [
@@ -32,7 +32,7 @@
     "test": "yarn jest"
   },
   "peerDependencies": {
-    "@ray-js/direction-control": "0.0.3-beta-1",
+    "@ray-js/direction-control": "0.0.7-beta-3",
     "ahooks": "^3.1.6"
   },
   "dependencies": {
@@ -48,7 +48,7 @@
     "@commitlint/cli": "^7.2.1",
     "@commitlint/config-conventional": "^9.0.1",
     "@ray-js/cli": "^1.4.9",
-    "@ray-js/direction-control": "0.0.3-beta-1",
+    "@ray-js/direction-control": "0.0.7-beta-3",
     "@ray-js/ray": "^1.4.9",
     "@testing-library/react-hooks": "^8.0.1",
     "@types/jest": "^29.5.14",