@ray-js/ipc-player-integration 0.0.1-beta-38 → 0.0.1-beta-40

package/lib/hooks/index.d.ts

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

package/lib/hooks/index.js

@@ -2,4 +2,5 @@ export * from './useBattery';
 export * from './useHumidity';
 export * from './useTemperature';
 export * from './useDpState';
-export * from './useMemoizedFn';
+export * from './useMemoizedFn';
+export * from './usePtz';

package/lib/hooks/usePtz/index.d.ts

@@ -0,0 +1 @@
+export declare const usePtz: (devId: string) => boolean;

package/lib/hooks/usePtz/index.js

@@ -0,0 +1,13 @@
+import { useMemo } from 'react';
+import { PTZ_CONTROL } from '../../utils/content/dpCode';
+import { useDpState } from '../useDpState';
+export const usePtz = devId => {
+  const [dpState] = useDpState({
+    devId,
+    dpCodes: [PTZ_CONTROL]
+  });
+  const supportPtz = useMemo(() => {
+    return dpState[PTZ_CONTROL];
+  }, [dpState]);
+  return supportPtz;
+};

package/lib/plugins/ptz/ptz.js

@@ -3,6 +3,7 @@ import { View, Text } from '@ray-js/ray';
 import clsx from 'clsx';
 import React, { useEffect, useState, useContext } from 'react';
 import { UIEventContext } from '../../ui/context';
+import { usePtz } from '../../hooks';
 import { useStore } from '../../ctx/store';
 import { ptzControlId } from '../../ui/constant';
 import './ptz.less';
@@ -15,7 +16,8 @@ export const Ptz = props => {
     deleteContent,
     showContent,
     hideContent,
-    className
+    className,
+    devId
   } = props;
   const {
     screenType,
@@ -28,13 +30,14 @@ export const Ptz = props => {
   const {
     event
   } = useContext(UIEventContext);
+  const supportPtz = usePtz(devId);
   useEffect(() => {
     if (screenType === 'vertical') {
       event.emit('ptzControlHide');
       setIsPtzActive(false);
     }
   }, [screenType]);
-  if (screenType === 'vertical') {
+  if (screenType === 'vertical' || !supportPtz) {
     return null;
   }
   return /*#__PURE__*/React.createElement(View, {

package/lib/plugins/resolution/resolution.js

@@ -57,7 +57,9 @@ export const Resolution = props => {
     onClick: onResolution,
     className: clsx(className, screenType === 'vertical' ? 'ipc-player-plugin-resolution-vertical' : 'ipc-player-plugin-resolution-full')
   }, /*#__PURE__*/React.createElement(View, {
-    className: "ipc-player-plugin-resolution"
+    className: clsx('ipc-player-plugin-resolution', {
+      'ipc-player-plugin-resolution-full': screenType === 'full'
+    })
   }, /*#__PURE__*/React.createElement(Text, {
     className: "resolutionText"
   }, Strings.getLang(`ipc_player_resolution_${resolution}`))));

package/lib/plugins/resolution/resolution.less

@@ -2,19 +2,23 @@
 
 .ipc-player-plugin-resolution {
   background-color: rgba(255,255,255,0.2);
-  padding: calc(4px * var(--ipc-player-size-scale, 1)) calc(5px * var(--ipc-player-size-scale, 1)) !important;
+  padding: calc(4px * var(--ipc-player-size-scale, 1)) calc(5px * var(--ipc-player-size-scale, 1));
   display: flex;
   justify-content: center;
   align-items: center;
-  border-radius: calc(8px * var(--ipc-player-size-scale, 1));
+  border-radius: calc(3px * var(--ipc-player-size-scale, 1));
   background-color: rgba(255, 255, 255, 0.3);
   box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
   .resolutionText {
     color: var(--iconColor);
     font-weight: 600;
-    font-size: calc(14px * var(--ipc-player-size-scale, 1));
+    font-size: calc(12px * var(--ipc-player-size-scale, 1));
   }
 }
+.ipc-player-plugin-resolution-full {
+  padding-left: calc(8px * var(--ipc-player-size-scale, 1));
+  padding-right: calc(8px * var(--ipc-player-size-scale, 1));
+}
 
 .ipc-player-plugin-full-resolution-control {
   height: 100%;

package/lib/ports.output.d.ts

@@ -3,6 +3,7 @@ export type UseBattery = (devId: string) => {
     batteryValue: number;
     batteryCharging: boolean;
 };
+export type UsePtz = (devId: string) => boolean;
 export type UseTemperature = (devId: string) => number;
 export type UseHumidity = () => number;
 export type Toast = (options: {

package/lib/ports.output.js

@@ -2,6 +2,8 @@ export { IntercomMode } from '@ray-js/ray-ipc-utils/lib/interface';
 
 // plugin 获取电池电量 todo
 
+// plugin 获取是否支持Ptz
+
 // plugin 获取温度
 
 // plugin 获取湿度

package/lib/ui/ui.less

@@ -191,6 +191,9 @@
    // 左下角子元素容器
    .bottom-left-item-container {
     padding: 0 12px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
   }
 
   .bottom-left-item-container:first-of-type {

package/lib/utils/content/dpCode.d.ts

@@ -2,3 +2,4 @@ export declare const TEMP_UNIT_SELECT = "temp_unit_select";
 export declare const TEMP_REPORT_F = "temp_report_f";
 export declare const SENSOR_TEMPERATURE = "sensor_temperature";
 export declare const SENSOR_HUMIDITY = "sensor_humidity";
+export declare const PTZ_CONTROL = "ptz_control";

package/lib/utils/content/dpCode.js

@@ -4,4 +4,6 @@ export const TEMP_REPORT_F = 'temp_report_f'; //  华氏度
 
 export const SENSOR_TEMPERATURE = 'sensor_temperature'; //  摄氏度
 
-export const SENSOR_HUMIDITY = 'sensor_humidity'; // 湿度
+export const SENSOR_HUMIDITY = 'sensor_humidity'; // 湿度
+
+export const PTZ_CONTROL = 'ptz_control'; // ptz

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ray-js/ipc-player-integration",
-  "version": "0.0.1-beta-38",
+  "version": "0.0.1-beta-40",
   "description": "IPC 播放器功能集成",
   "main": "lib/index",
   "files": [
@@ -36,7 +36,7 @@
     "ahooks": "^3.1.6"
   },
   "dependencies": {
-    "@ray-js/ipc-ptz-zoom": "0.0.2-beta-6",
+    "@ray-js/ipc-ptz-zoom": "0.0.2-beta-7",
     "@ray-js/panel-sdk": "^1.13.1",
     "@ray-js/ray-ipc-player": "2.0.20-beta-6",
     "@ray-js/ray-ipc-utils": "1.1.0-beta-13",