@ray-js/ray-ipc-player 0.0.13-beta-1 → 0.0.14-beta-1

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 (10) hide show
  1. package/README.md +75 -67
  2. package/lib/index.android.js +1 -1
  3. package/lib/index.ios.js +1 -1
  4. package/lib/index.js +30 -43
  5. package/lib/index.module.less +4 -0
  6. package/lib/index.tuya.js +30 -43
  7. package/lib/index.web.js +30 -43
  8. package/lib/index.wechat.js +30 -43
  9. package/lib/typings/index.d.ts +64 -100
  10. package/package.json +1 -1
package/README.md CHANGED
@@ -6,29 +6,29 @@
6
6
 
7
7
  ```ts
8
8
  export type IProps = {
9
- updateLayout?: string; // 主动触发视图更新
10
9
  devId: string; // 设备id
11
- devName?: string; // 设备名称
12
- onInitPreview?: Function; // 初始化预览成功
13
- onPlayerTap?: Function; // videoTap点击事件
14
- onChangeStreamStatus?: Function; // 视频流状态发生变化
15
- onlineStatus?: Boolean; // 设备默认在离线状态
16
- loadDes?: string; // 加载文案
17
- rotateZ?: number; // 摄像头旋转角度
10
+ onlineStatus: Boolean; // 设备是否在线
11
+ privateState?: boolean; // 设备隐私模式
12
+ defaultMute?: Boolean; // 默认静音
13
+ clarity?: string; // 默认标清 normal：标清，hd：高清
14
+ updateLayout?: any; // 外层父节点样式变化，播放器监听不到，需要主动触发播放器视图更新，每次需要设置不同的值
15
+ onChangeStreamStatus?: (statusCode: number) => void; // 视频流状态发生变化
16
+ onCtx?: (playerRef: object) => void; // 获取ipcPlayer实例ctx以及重试方法retry
17
+ onInitPreview?: (devId: string) => void; // 初始化预览成功
18
+ onPlayerTap?: (devId: string) => void; // 播放器区域点击事件
18
19
  scalable?: Boolean; // 是否可缩放
19
20
  scaleMultiple?: number; // 缩放比例
21
+ rotateZ?: number; // 摄像头旋转角度
20
22
  ptzControllable?: Boolean; // 是否开启视频区云平台控制
21
- isOnPlayerPage?: Boolean; // 当前是否在预览页
22
- onCtx?: (playerRef) => void; // 获取ipcPlayer实例ctx以及重试方法retry
23
- defaultMute?: Boolean; // 是否默认静音
24
- clarity?: string; // 默认清晰度 normal：标清，hd：高清
25
- soundMode?: string; // 声音输出方式 speaker：扬声器，ear：听筒
26
- orientation?: string; // 画面方向 vertical：竖直，horizontal：水平
27
- borderRadius?: number | string;
28
- bgColor?: string; // 背景底色
29
- borderStyle?: 'solid' | 'dashed'; // 边框样式
30
- borderColor?: string; // 边框颜色
31
- borderWidth?: string | number; // 边框宽度
23
+ playerStyle?: { // 播放器样式
24
+ bgColor?: string; // 背景底色
25
+ borderRadius?: number | string; // 边框圆角
26
+ borderStyle?: 'solid' | 'dashed'; // 边框样式
27
+ borderColor?: string; // 边框颜色
28
+ borderWidth?: string | number; // 边框宽度
29
+ };
30
+ loadText?: string; // 加载过程中的文案，可结合onChangeStreamStatus事件做文案配置
31
+ extend?: object; // 扩展属性
32
32
  };
33
33
  ```
34
34
 
@@ -38,70 +38,78 @@ export type IProps = {
38
38
 
39
39
  - -1000: 未知异常
40
40
 
41
- - 1001: connect连接成功
41
+ - 1001: connect 连接成功
42
42
 
43
- - -1001: connect连接失败
43
+ - -1001: connect 连接失败
44
44
 
45
- - 1002: preview成功
45
+ - 1002: preview 成功
46
46
 
47
- - -1002: preview失败
47
+ - -1002: preview 失败
48
48
 
49
49
  - -1010: 网络状态不可用
50
50
 
51
51
  - -1012: 设备被移除
52
52
 
53
- - 1009: disconnect成功
53
+ - 1009: disconnect 成功
54
54
 
55
- - -1009: disconnect失败
55
+ - -1009: disconnect 失败
56
56
 
57
57
  ### 用法
58
58
 
59
59
  ```tsx
60
60
  import React, { useState, useCallback } from 'react';
61
- import Player from "@ray/ray-ipc-player";
62
- import { Button } from '@ray-js/components';
63
- const [state, setState] = useState({}); // player实例
64
- const [previewStatus, setPreviewStatus] = useState(false); // 视频预览状态
65
-
66
- const onChangeStreamStatus = (data) => {
67
- const { type, value } = data
68
- if (type === 'preview_status' && value) {
69
- setPreviewStatus(value);
61
+ import Player from "@ray-js/ray-ipc-player";
62
+ import { Button, View } from '@ray-js/components';
63
+
64
+ const PlayerDemo = () => {
65
+ const [updateLayout, setUpdateLayout] = useState('');
66
+ const [state, setState] = useState({}); // player实例
67
+ const [playerWidth, setPlayerWidth] = useState('200px'); // player宽度
68
+ /** onCtx用法
69
+ * playerCtx.ctx: 拿到的是通过createIpcPlayerContext创建的ipc-player实例，包含预览、清晰度、静音、录像、截图等方法
70
+ * playerCtx.retry: 暴露出的重试方法
71
+ */
72
+ const onCtx = (playerCtx) => {
73
+ setState(playerCtx)
70
74
  }
71
- }
72
75
 
73
- /** onCtx用法
74
- * playerCtx.ctx: 拿到的是通过createIpcPlayerContext创建的ipc-player实例，包含预览、清晰度、静音、录像、截图等方法
75
- * playerCtx.retry: 暴露出的重试方法
76
- */
77
- const onCtx = (playerCtx) => {
78
- setState(playerCtx)
76
+ // 切换清晰度
77
+ const handleClarity = useCallback(() => {
78
+ if (previewStatus) {
79
+ state.ctx.setClarity({
80
+ clarity: 'hd',
81
+ success: res => {
82
+ console.log('切换清晰度成功：', res);
83
+ },
84
+ fail: e => {
85
+ console.log('切换清晰度失败：', e);
86
+ },
87
+ });
88
+ }
89
+ }, [previewStatus])
90
+
91
+ const handleChangeWidth = () => {
92
+ setPlayerWidth(playerWidth);
93
+ // 更新外层父节点宽度样式时，同步通知更新播放器视图
94
+ setUpdateLayout(Math.random().toString());
95
+ }
96
+
97
+ return (
98
+ <View style={{width: playerWidth}}>
99
+ <Player
100
+ devId={devId}
101
+ onCtx={onCtx}
102
+ updateLayout={updateLayout}
103
+ extend={{
104
+ soundMode: 'speaker',
105
+ orientation: 'vertical'
106
+ }}
107
+ />
108
+ <Button onClick={() => handleClarity}>切换清晰度</Button>
109
+ <Button onClick={() => handleChangeWidth}>更新宽度</Button>
110
+ </View>
111
+ )
79
112
  }
80
113
 
81
- // 切换清晰度
82
- const handleClarity = useCallback(() => {
83
- if (previewStatus) {
84
- state.ctx.setClarity({
85
- clarity: 'hd',
86
- success: res => {
87
- console.log('切换清晰度成功：', res);
88
- },
89
- fail: e => {
90
- console.log('切换清晰度失败：', e);
91
- },
92
- });
93
- }
94
- }, [previewStatus])
95
-
96
- <Player
97
- onCtx={onCtx}
98
- onInitPreview={initPreviewSuccess}
99
- onPlayerTap={handlePlayerClick}
100
- onChangeStreamStatus={onChangeStreamStatus}
101
- updateLayout={updateLayout}
102
- devId={devId}
103
- devName={devName}
104
- />
105
-
106
- <Button onClick={() => handleClarity}>切换清晰度</Button>
114
+ export default PlayerDemo;
107
115
  ```
package/lib/index.android.js CHANGED
@@ -1 +1 @@
1
- var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _regenerator=_interopRequireDefault(require("@babel/runtime/regenerator"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _useImmer3=require("use-immer");var _components=require("@ray-js/components");var _classnames=_interopRequireDefault(require("classnames"));var _ray=require("ray");var _i18n=_interopRequireDefault(require("./i18n"));var _indexModule=_interopRequireDefault(require("./index.module.less"));var _constant=require("./constant");var _utils=require("./utils");var _this=this,_jsxFileName="/drone/src/src/index.tsx";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}function _getClassName(){var className=[];var args=arguments[0];var type=Object.prototype.toString.call(args).slice(8,-1).toLowerCase();if(type==='string'){args=args.trim();args&&className.push(args);}else if(type==='array'){args.forEach(function(cls){cls=_getClassName(cls).trim();cls&&className.push(cls);});}else if(type==='object'){for(var k in args){k=k.trim();if(k&&args.hasOwnProperty(k)&&args[k]){className.push(k);}}}return className.join(' ').trim();}function _getStyle(classNameExpression){var className=_getClassName(classNameExpression);var classNameArr=className.split(/\s+/);var style={};classNameArr.reduce((sty,cls)=>Object.assign(sty,_styleSheet[cls.trim()]),style);const sty=Object.keys(style).length>0?style:classNameExpression;let result=sty;if(sty instanceof Array){sty.map(item=>{result={...result,...item};});}return result;}var _styleSheet=_indexModule.default;var Player=function(props){var _props$updateLayout=props.updateLayout,updateLayout=_props$updateLayout===void 0?'':_props$updateLayout,_props$devId=props.devId,devId=_props$devId===void 0?'':_props$devId,_props$devName=props.devName,devName=_props$devName===void 0?'':_props$devName,onChangeStreamStatus=props.onChangeStreamStatus,onPlayerTap=props.onPlayerTap,onInitPreview=props.onInitPreview,_props$defaultMute=props.defaultMute,defaultMute=_props$defaultMute===void 0?true:_props$defaultMute,_props$onlineStatus=props.onlineStatus,onlineStatus=_props$onlineStatus===void 0?true:_props$onlineStatus,_props$loadDes=props.loadDes,loadDes=_props$loadDes===void 0?'':_props$loadDes,_props$rotateZ=props.rotateZ,rotateZ=_props$rotateZ===void 0?0:_props$rotateZ,_props$scalable=props.scalable,scalable=_props$scalable===void 0?true:_props$scalable,_props$scaleMultiple=props.scaleMultiple,scaleMultiple=_props$scaleMultiple===void 0?0:_props$scaleMultiple,_props$ptzControllabl=props.ptzControllable,ptzControllable=_props$ptzControllabl===void 0?true:_props$ptzControllabl,_props$isOnPlayerPage=props.isOnPlayerPage,isOnPlayerPage=_props$isOnPlayerPage===void 0?true:_props$isOnPlayerPage,_props$clarity=props.clarity,clarity=_props$clarity===void 0?'normal':_props$clarity,_props$soundMode=props.soundMode,soundMode=_props$soundMode===void 0?'speaker':_props$soundMode,_props$orientation=props.orientation,orientation=_props$orientation===void 0?'vertical':_props$orientation,onCtx=props.onCtx,_props$borderRadius=props.borderRadius,borderRadius=_props$borderRadius===void 0?0:_props$borderRadius,_props$bgColor=props.bgColor,bgColor=_props$bgColor===void 0?'#000000':_props$bgColor,_props$borderStyle=props.borderStyle,borderStyle=_props$borderStyle===void 0?'solid':_props$borderStyle,_props$borderColor=props.borderColor,borderColor=_props$borderColor===void 0?'':_props$borderColor,_props$borderWidth=props.borderWidth,borderWidth=_props$borderWidth===void 0?0:_props$borderWidth,_props$privateState=props.privateState,privateState=_props$privateState===void 0?false:_props$privateState;var _useImmer=(0,_useImmer3.useImmer)({connectState:false,loadingState:false,errorState:false,errorMsg:'',updateLy:'',devlineState:true,initLy:false}),_useImmer2=(0,_slicedToArray2.default)(_useImmer,2),playState=_useImmer2[0],setPlayState=_useImmer2[1];var ipcCtx=(0,_react.useRef)(null);var retryCount=(0,_react.useRef)(0);var muteRef=(0,_react.useRef)(defaultMute);(0,_ray.usePageEvent)('onShow',(0,_react.useCallback)(function(){if(ipcCtx.current&&playState.connectState){startPreview('');}},[playState.connectState]));(0,_ray.usePageEvent)('onHide',function(){return _regenerator.default.async(function(_context){while(1){switch(_context.prev=_context.next){case 0:setPlayState(function(d){d.loadingState=true;});_context.next=3;return _regenerator.default.awrap(getCurMute());case 3:stopPreview();case 4:case"end":return _context.stop();}}},null,null,null,Promise);});(0,_react.useEffect)(function(){setPlayState(function(d){d.errorState=privateState;});if(!privateState){retry();}},[privateState]);(0,_react.useEffect)(function(){muteRef.current=defaultMute;},[defaultMute]);(0,_react.useEffect)(function(){setPlayState(function(d){d.updateLy=updateLayout;});},[updateLayout]);(0,_react.useEffect)(function(){setPlayState(function(d){d.devlineState=onlineStatus;});if(!onlineStatus){setPlayState(function(d){d.errorState=true;d.errorMsg=_i18n.default.getLang('ipc_player_no_line');});}else if(playState.initLy){retry();}},[onlineStatus,playState.initLy]);(0,_react.useEffect)(function(){if(!isOnPlayerPage){disconnect();}},[isOnPlayerPage]);var _retry=function(){return _regenerator.default.async(function(_context2){while(1){switch(_context2.prev=_context2.next){case 0:setPlayState(function(d){d.connectState=false;d.errorMsg='';d.errorState=false;});_context2.t0=playState.connectState;if(!_context2.t0){_context2.next=5;break;}_context2.next=5;return _regenerator.default.awrap(disconnect());case 5:createConnect();case 6:case"end":return _context2.stop();}}},null,null,null,Promise);};var retry=(0,_react.useCallback)(function(){!privateState&&_retry();},[playState.connectState,privateState]);var createIpcCtx=function(id){var _ty;ipcCtx.current=(_ty=ty)===null||_ty===void 0?void 0:_ty.createIpcPlayerContext(id);onCtx&&onCtx({ctx:ipcCtx.current,retry:retry});};(0,_react.useEffect)(function(){onlineStatus&&createIpcCtx(devId);return function(){disconnect();ipcCtx.current=null;};},[devId,onlineStatus]);var createConnect=function(params){var _ipcCtx$current;setPlayState(function(d){d.loadingState=true;});(_ipcCtx$current=ipcCtx.current)===null||_ipcCtx$current===void 0?void 0:_ipcCtx$current.connect({success:function success(){setPlayState(function(d){d.connectState=true;d.errorState=false;d.errorMsg='';});onChangeStreamStatus&&onChangeStreamStatus(1001);startPreview(params);},fail:function fail(){setPlayState(function(d){d.connectState=false;d.errorState=true;d.errorMsg=_i18n.default.getLang('ipc_player_connect_fail');d.loadingState=false;});onChangeStreamStatus&&onChangeStreamStatus(-1001);}});};var startPreview=function(params){var _ipcCtx$current2;(_ipcCtx$current2=ipcCtx.current)===null||_ipcCtx$current2===void 0?void 0:_ipcCtx$current2.startPreview({success:function success(){setPlayState(function(d){d.loadingState=false;d.errorState=false;d.errorMsg='';});params&&onInitPreview&&onInitPreview(devId);onChangeStreamStatus&&onChangeStreamStatus(1002);},fail:function fail(){setPlayState(function(d){d.errorState=true;d.loadingState=false;d.errorMsg=_i18n.default.getLang('ipc_player_preview_fail');});onChangeStreamStatus&&onChangeStreamStatus(-1002);},complete:function complete(){setMuted(muteRef.current);}});};var stopPreview=function(){var _ipcCtx$current3;(_ipcCtx$current3=ipcCtx.current)===null||_ipcCtx$current3===void 0?void 0:_ipcCtx$current3.stopPreview({success:function success(){return null;},fail:function fail(){return null;},complete:function complete(){return setMuted(true);}});};var setMuted=function(val){var _ipcCtx$current4;(_ipcCtx$current4=ipcCtx.current)===null||_ipcCtx$current4===void 0?void 0:_ipcCtx$current4.setMuted({mute:val,success:function success(){},fail:function fail(){}});};var getCurMute=function(){return new Promise(function(resolve,reject){var _ipcCtx$current5;(_ipcCtx$current5=ipcCtx.current)===null||_ipcCtx$current5===void 0?void 0:_ipcCtx$current5.isMuted({success:function success(res){muteRef.current=res;},fail:function fail(e){reject(e);},complete:function complete(d){resolve(d);}});});};var onError=(0,_react.useCallback)(function(e){var _e$detail;if(playState.errorState){return;}var type=e===null||e===void 0?void 0:(_e$detail=e.detail)===null||_e$detail===void 0?void 0:_e$detail.errCode;if(_constant.IpcFailCode[type]){onChangeStreamStatus&&onChangeStreamStatus(type);setPlayState(function(d){d.loadingState=false;d.errorState=true;d.errorMsg=_i18n.default.getLang(_constant.IpcFailCode[type]);d.connectState=false;});}},[playState.errorState]);var disconnect=function(){return new Promise(function(resolve,reject){var _ipcCtx$current6;(_ipcCtx$current6=ipcCtx.current)===null||_ipcCtx$current6===void 0?void 0:_ipcCtx$current6.disconnect({success:function success(res){resolve(res);setPlayState(function(d){d.connectState=false;});onChangeStreamStatus&&onChangeStreamStatus(1009);},fail:function fail(e){reject(e);onChangeStreamStatus&&onChangeStreamStatus(-1009);}});});};return _react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.ipc_player),__source:{fileName:_jsxFileName,lineNumber:340,columnNumber:10}},isOnPlayerPage&&_react.default.createElement(_components.IpcPlayer,{onVideotap:function handlePlayerClick(){onPlayerTap&&onPlayerTap(devId);},onInitdone:function initdone(){setPlayState(function(d){d.updateLy=Math.random();d.initLy=true;});},onError:onError,onConnectchange:function connectchange(e){var _e$detail2;var code=e===null||e===void 0?void 0:(_e$detail2=e.detail)===null||_e$detail2===void 0?void 0:_e$detail2.state;onChangeStreamStatus&&onChangeStreamStatus(code===0?1001:-1001);if(code===0){setPlayState(function(d){d.connectState=true;});}else if((code===-3||code===-105)&&retryCount.current<1){retryCount.current++;retry();}else{setPlayState(function(d){d.connectState=false;d.loadingState=false;d.errorState=true;d.errorMsg=_i18n.default.getLang(_constant.IpcFailCode[-1001]);});}},deviceId:devId,autoPauseIfNavigate:false,autoPauseIfOpenNative:false,muted:defaultMute,objectFit:"fillCrop",clarity:clarity,soundMode:soundMode,orientation:orientation,rotateZ:rotateZ,scalable:scalable,scaleMultiple:scaleMultiple,ptzControllable:ptzControllable,borderRadius:borderRadius,borderStyle:borderStyle,borderColor:borderColor,borderWidth:borderWidth,updateLayout:playState.updateLy,backgroundColor:bgColor,__self:_this,style:_getStyle(_indexModule.default.player),__source:{fileName:_jsxFileName,lineNumber:341,columnNumber:26}}),_react.default.createElement(_components.View,{style:[_getStyle((0,_classnames.default)(_indexModule.default.load_box,_indexModule.default.bg_center,!playState.loadingState&&_indexModule.default.hide)),{borderRadius:""+borderRadius}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:345,columnNumber:7}},_react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.load_icon),__source:{fileName:_jsxFileName,lineNumber:348,columnNumber:9}}),_react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.load_des),__source:{fileName:_jsxFileName,lineNumber:349,columnNumber:9}},loadDes||_i18n.default.getLang('get_video_stream'))),_react.default.createElement(_components.CoverView,{style:[_getStyle((0,_classnames.default)(_indexModule.default.bg_center,_indexModule.default.state_label,!playState.errorState&&_indexModule.default.hide)),{borderRadius:""+borderRadius}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:354,columnNumber:7}},privateState?_react.default.createElement(_components.View,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:357,columnNumber:25}},_react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.device_sleep),__source:{fileName:_jsxFileName,lineNumber:358,columnNumber:13}},_i18n.default.getLang('device_sleep')),_react.default.createElement(_components.View,{onClick:function handleReWakeCamera(){return _regenerator.default.async(function(_context3){while(1){switch(_context3.prev=_context3.next){case 0:_context3.next=2;return _regenerator.default.awrap((0,_utils.putDpData)({105:false},devId));case 2:case"end":return _context3.stop();}}},null,null,null,Promise);},__self:_this,style:_getStyle(_indexModule.default.re_wake_camera),__source:{fileName:_jsxFileName,lineNumber:359,columnNumber:13}},_i18n.default.getLang('re_wake_camera'))):_react.default.createElement(_components.View,{style:[{width:'95%',textAlign:'center'}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:363,columnNumber:21}},_react.default.createElement(_components.View,{__self:_this,style:_getStyle((0,_classnames.default)(_indexModule.default.iconfont,_indexModule.default.icon_tishi,!playState.devlineState&&_indexModule.default.hide)),__source:{fileName:_jsxFileName,lineNumber:367,columnNumber:13}}),_react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.err_msg),__source:{fileName:_jsxFileName,lineNumber:368,columnNumber:13}},_react.default.createElement(_components.View,{__self:_this,style:_getStyle((0,_classnames.default)(_indexModule.default.msg,_indexModule.default.ellipsis)),__source:{fileName:_jsxFileName,lineNumber:369,columnNumber:15}},playState.errorMsg),_react.default.createElement(_components.Text,{style:[_getStyle(!playState.devlineState&&_indexModule.default.hide),{color:'#fff'}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:370,columnNumber:15}},"\uFF0C"),_react.default.createElement(_components.View,{onClick:retry,__self:_this,style:_getStyle((0,_classnames.default)(_indexModule.default.retry,!playState.devlineState&&_indexModule.default.hide)),__source:{fileName:_jsxFileName,lineNumber:375,columnNumber:15}},_i18n.default.getLang('ipc_player_retry'))))));};var _default=Player;exports.default=_default;
1
+ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _regenerator=_interopRequireDefault(require("@babel/runtime/regenerator"));var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _useImmer3=require("use-immer");var _components=require("@ray-js/components");var _classnames=_interopRequireDefault(require("classnames"));var _ray=require("ray");var _i18n=_interopRequireDefault(require("./i18n"));var _indexModule=_interopRequireDefault(require("./index.module.less"));var _constant=require("./constant");var _utils=require("./utils");var _this=this,_jsxFileName="/drone/src/src/index.tsx";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}function _getClassName(){var className=[];var args=arguments[0];var type=Object.prototype.toString.call(args).slice(8,-1).toLowerCase();if(type==='string'){args=args.trim();args&&className.push(args);}else if(type==='array'){args.forEach(function(cls){cls=_getClassName(cls).trim();cls&&className.push(cls);});}else if(type==='object'){for(var k in args){k=k.trim();if(k&&args.hasOwnProperty(k)&&args[k]){className.push(k);}}}return className.join(' ').trim();}function _getStyle(classNameExpression){var className=_getClassName(classNameExpression);var classNameArr=className.split(/\s+/);var style={};classNameArr.reduce((sty,cls)=>Object.assign(sty,_styleSheet[cls.trim()]),style);const sty=Object.keys(style).length>0?style:classNameExpression;let result=sty;if(sty instanceof Array){sty.map(item=>{result={...result,...item};});}return result;}var _styleSheet=_indexModule.default;var Player=function(props){var _props$updateLayout=props.updateLayout,updateLayout=_props$updateLayout===void 0?'':_props$updateLayout,_props$devId=props.devId,devId=_props$devId===void 0?'':_props$devId,onChangeStreamStatus=props.onChangeStreamStatus,onPlayerTap=props.onPlayerTap,onInitPreview=props.onInitPreview,_props$defaultMute=props.defaultMute,defaultMute=_props$defaultMute===void 0?true:_props$defaultMute,_props$onlineStatus=props.onlineStatus,onlineStatus=_props$onlineStatus===void 0?true:_props$onlineStatus,_props$loadText=props.loadText,loadText=_props$loadText===void 0?'':_props$loadText,_props$rotateZ=props.rotateZ,rotateZ=_props$rotateZ===void 0?0:_props$rotateZ,_props$scalable=props.scalable,scalable=_props$scalable===void 0?true:_props$scalable,_props$scaleMultiple=props.scaleMultiple,scaleMultiple=_props$scaleMultiple===void 0?0:_props$scaleMultiple,_props$ptzControllabl=props.ptzControllable,ptzControllable=_props$ptzControllabl===void 0?true:_props$ptzControllabl,_props$clarity=props.clarity,clarity=_props$clarity===void 0?'normal':_props$clarity,onCtx=props.onCtx,_props$playerStyle=props.playerStyle,playerStyle=_props$playerStyle===void 0?{borderRadius:0,bgColor:'#000000',borderStyle:'solid',borderColor:'',borderWidth:0}:_props$playerStyle,_props$privateState=props.privateState,privateState=_props$privateState===void 0?false:_props$privateState,_props$extend=props.extend,extend=_props$extend===void 0?{}:_props$extend;var borderRadius=playerStyle.borderRadius,bgColor=playerStyle.bgColor,borderStyle=playerStyle.borderStyle,borderColor=playerStyle.borderColor,borderWidth=playerStyle.borderWidth;var _useImmer=(0,_useImmer3.useImmer)({connectState:false,loadingState:false,errorState:false,errorMsg:'',updateLy:'',deviceOnlineState:true,initLy:false}),_useImmer2=(0,_slicedToArray2.default)(_useImmer,2),playState=_useImmer2[0],setPlayState=_useImmer2[1];var ipcCtx=(0,_react.useRef)(null);var retryCount=(0,_react.useRef)(0);var muteRef=(0,_react.useRef)(defaultMute);(0,_ray.usePageEvent)('onShow',(0,_react.useCallback)(function(){if(ipcCtx.current&&playState.connectState){startPreview('');}},[playState.connectState]));(0,_ray.usePageEvent)('onHide',function(){return _regenerator.default.async(function(_context){while(1){switch(_context.prev=_context.next){case 0:setPlayState(function(d){d.loadingState=true;});_context.next=3;return _regenerator.default.awrap(getCurMute());case 3:stopPreview();case 4:case"end":return _context.stop();}}},null,null,null,Promise);});(0,_react.useEffect)(function(){setPlayState(function(d){d.errorState=privateState;});if(!privateState){retry();}},[privateState]);(0,_react.useEffect)(function(){muteRef.current=defaultMute;},[defaultMute]);(0,_react.useEffect)(function(){setPlayState(function(d){d.updateLy=updateLayout;});},[updateLayout]);(0,_react.useEffect)(function(){setPlayState(function(d){d.deviceOnlineState=onlineStatus;});if(!onlineStatus){setPlayState(function(d){d.errorState=true;d.errorMsg=_i18n.default.getLang('ipc_player_no_line');});}else if(playState.initLy){retry();}},[onlineStatus,playState.initLy]);var _retry=function(){return _regenerator.default.async(function(_context2){while(1){switch(_context2.prev=_context2.next){case 0:setPlayState(function(d){d.connectState=false;d.errorMsg='';d.errorState=false;d.loadingState=true;});_context2.t0=playState.connectState;if(!_context2.t0){_context2.next=5;break;}_context2.next=5;return _regenerator.default.awrap(disconnect());case 5:createConnect();case 6:case"end":return _context2.stop();}}},null,null,null,Promise);};var retry=(0,_react.useCallback)(function(){!privateState&&_retry();},[playState.connectState,privateState]);var createIpcCtx=function(id){var _ty;ipcCtx.current=(_ty=ty)===null||_ty===void 0?void 0:_ty.createIpcPlayerContext(id);onCtx&&onCtx({ctx:ipcCtx.current,retry:retry});};(0,_react.useEffect)(function(){onlineStatus&&createIpcCtx(devId);return function(){disconnect();ipcCtx.current=null;};},[devId,onlineStatus]);var createConnect=function(params){var _ipcCtx$current;setPlayState(function(d){d.loadingState=true;});(_ipcCtx$current=ipcCtx.current)===null||_ipcCtx$current===void 0?void 0:_ipcCtx$current.connect({success:function success(){setPlayState(function(d){d.connectState=true;d.errorState=false;d.errorMsg='';});onChangeStreamStatus&&onChangeStreamStatus(1001);startPreview(params);},fail:function fail(){setPlayState(function(d){d.connectState=false;d.errorState=true;d.errorMsg=_i18n.default.getLang('ipc_player_connect_fail');d.loadingState=false;});onChangeStreamStatus&&onChangeStreamStatus(-1001);}});};var startPreview=function(params){var _ipcCtx$current2;(_ipcCtx$current2=ipcCtx.current)===null||_ipcCtx$current2===void 0?void 0:_ipcCtx$current2.startPreview({success:function success(){setPlayState(function(d){d.loadingState=false;d.errorState=false;d.errorMsg='';});params&&onInitPreview&&onInitPreview(devId);onChangeStreamStatus&&onChangeStreamStatus(1002);},fail:function fail(){setPlayState(function(d){d.errorState=true;d.loadingState=false;d.errorMsg=_i18n.default.getLang('ipc_player_preview_fail');});onChangeStreamStatus&&onChangeStreamStatus(-1002);},complete:function complete(){setMuted(muteRef.current);}});};var stopPreview=function(){var _ipcCtx$current3;(_ipcCtx$current3=ipcCtx.current)===null||_ipcCtx$current3===void 0?void 0:_ipcCtx$current3.stopPreview({success:function success(){return null;},fail:function fail(){return null;},complete:function complete(){return setMuted(true);}});};var setMuted=function(val){var _ipcCtx$current4;(_ipcCtx$current4=ipcCtx.current)===null||_ipcCtx$current4===void 0?void 0:_ipcCtx$current4.setMuted({mute:val,success:function success(){},fail:function fail(){}});};var getCurMute=function(){return new Promise(function(resolve,reject){var _ipcCtx$current5;(_ipcCtx$current5=ipcCtx.current)===null||_ipcCtx$current5===void 0?void 0:_ipcCtx$current5.isMuted({success:function success(res){muteRef.current=res;},fail:function fail(e){reject(e);},complete:function complete(d){resolve(d);}});});};var onError=(0,_react.useCallback)(function(e){var _e$detail;if(playState.errorState){return;}var type=e===null||e===void 0?void 0:(_e$detail=e.detail)===null||_e$detail===void 0?void 0:_e$detail.errCode;if(_constant.IpcFailCode[type]){onChangeStreamStatus&&onChangeStreamStatus(type);setPlayState(function(d){d.loadingState=false;d.errorState=true;d.errorMsg=_i18n.default.getLang(_constant.IpcFailCode[type]);d.connectState=false;});}},[playState.errorState]);var disconnect=function(){return new Promise(function(resolve,reject){var _ipcCtx$current6;(_ipcCtx$current6=ipcCtx.current)===null||_ipcCtx$current6===void 0?void 0:_ipcCtx$current6.disconnect({success:function success(res){resolve(res);setPlayState(function(d){d.connectState=false;});onChangeStreamStatus&&onChangeStreamStatus(1009);},fail:function fail(e){reject(e);onChangeStreamStatus&&onChangeStreamStatus(-1009);}});});};return _react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.ipc_player),__source:{fileName:_jsxFileName,lineNumber:342,columnNumber:10}},_react.default.createElement(_components.IpcPlayer,(0,_extends2.default)({onVideotap:function handlePlayerClick(){onPlayerTap&&onPlayerTap(devId);},onInitdone:function initdone(){setPlayState(function(d){d.updateLy=Math.random();d.initLy=true;});},onError:onError,onConnectchange:function connectchange(e){var _e$detail2;var code=e===null||e===void 0?void 0:(_e$detail2=e.detail)===null||_e$detail2===void 0?void 0:_e$detail2.state;onChangeStreamStatus&&onChangeStreamStatus(code===0?1001:-1001);if(code===0){setPlayState(function(d){d.connectState=true;});}else if((code===-3||code===-105)&&retryCount.current<1){retryCount.current++;retry();}else{setPlayState(function(d){d.connectState=false;d.loadingState=false;d.errorState=true;d.errorMsg=_i18n.default.getLang(_constant.IpcFailCode[-1001]);});}},deviceId:devId,autoPauseIfNavigate:false,autoPauseIfOpenNative:false,muted:defaultMute,objectFit:"fillCrop",clarity:clarity,rotateZ:rotateZ,scalable:scalable,scaleMultiple:scaleMultiple,ptzControllable:ptzControllable,borderRadius:borderRadius,borderStyle:borderStyle,borderColor:borderColor,borderWidth:borderWidth,updateLayout:playState.updateLy,backgroundColor:bgColor},extend,{__self:_this,style:_getStyle(_indexModule.default.player),__source:{fileName:_jsxFileName,lineNumber:343,columnNumber:7}})),_react.default.createElement(_components.View,{style:[_getStyle((0,_classnames.default)(_indexModule.default.load_box,_indexModule.default.bg_center,!playState.loadingState&&_indexModule.default.hide)),{borderRadius:""+borderRadius}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:347,columnNumber:7}},_react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.load_icon),__source:{fileName:_jsxFileName,lineNumber:350,columnNumber:9}}),_react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.load_des),__source:{fileName:_jsxFileName,lineNumber:351,columnNumber:9}},loadText||_i18n.default.getLang('get_video_stream'))),_react.default.createElement(_components.CoverView,{style:[_getStyle((0,_classnames.default)(_indexModule.default.bg_center,_indexModule.default.state_label,!playState.errorState&&_indexModule.default.hide)),{borderRadius:""+borderRadius}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:356,columnNumber:7}},privateState?_react.default.createElement(_components.View,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:359,columnNumber:25}},_react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.device_sleep),__source:{fileName:_jsxFileName,lineNumber:360,columnNumber:13}},_i18n.default.getLang('device_sleep')),_react.default.createElement(_components.View,{onClick:function handleReWakeCamera(){return _regenerator.default.async(function(_context3){while(1){switch(_context3.prev=_context3.next){case 0:_context3.next=2;return _regenerator.default.awrap((0,_utils.putDpData)({105:false},devId));case 2:case"end":return _context3.stop();}}},null,null,null,Promise);},__self:_this,style:_getStyle(_indexModule.default.re_wake_camera),__source:{fileName:_jsxFileName,lineNumber:361,columnNumber:13}},_i18n.default.getLang('re_wake_camera'))):_react.default.createElement(_components.View,{style:[{width:'95%',textAlign:'center'}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:365,columnNumber:21}},_react.default.createElement(_components.View,{__self:_this,style:_getStyle((0,_classnames.default)(_indexModule.default.iconfont,_indexModule.default.icon_tishi,!playState.deviceOnlineState&&_indexModule.default.hide)),__source:{fileName:_jsxFileName,lineNumber:369,columnNumber:13}}),_react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.err_msg),__source:{fileName:_jsxFileName,lineNumber:370,columnNumber:13}},_react.default.createElement(_components.View,{__self:_this,style:_getStyle((0,_classnames.default)(_indexModule.default.msg,_indexModule.default.ellipsis)),__source:{fileName:_jsxFileName,lineNumber:371,columnNumber:15}},playState.errorMsg),_react.default.createElement(_components.View,{onClick:retry,__self:_this,style:_getStyle((0,_classnames.default)(_indexModule.default.retry,!playState.deviceOnlineState&&_indexModule.default.hide)),__source:{fileName:_jsxFileName,lineNumber:372,columnNumber:15}},_i18n.default.getLang('ipc_player_retry'))))));};var _default=Player;exports.default=_default;
package/lib/index.ios.js CHANGED
@@ -1 +1 @@
1
- var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _regenerator=_interopRequireDefault(require("@babel/runtime/regenerator"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _useImmer3=require("use-immer");var _components=require("@ray-js/components");var _classnames=_interopRequireDefault(require("classnames"));var _ray=require("ray");var _i18n=_interopRequireDefault(require("./i18n"));var _indexModule=_interopRequireDefault(require("./index.module.less"));var _constant=require("./constant");var _utils=require("./utils");var _this=this,_jsxFileName="/drone/src/src/index.tsx";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}function _getClassName(){var className=[];var args=arguments[0];var type=Object.prototype.toString.call(args).slice(8,-1).toLowerCase();if(type==='string'){args=args.trim();args&&className.push(args);}else if(type==='array'){args.forEach(function(cls){cls=_getClassName(cls).trim();cls&&className.push(cls);});}else if(type==='object'){for(var k in args){k=k.trim();if(k&&args.hasOwnProperty(k)&&args[k]){className.push(k);}}}return className.join(' ').trim();}function _getStyle(classNameExpression){var className=_getClassName(classNameExpression);var classNameArr=className.split(/\s+/);var style={};classNameArr.reduce((sty,cls)=>Object.assign(sty,_styleSheet[cls.trim()]),style);const sty=Object.keys(style).length>0?style:classNameExpression;let result=sty;if(sty instanceof Array){sty.map(item=>{result={...result,...item};});}return result;}var _styleSheet=_indexModule.default;var Player=function(props){var _props$updateLayout=props.updateLayout,updateLayout=_props$updateLayout===void 0?'':_props$updateLayout,_props$devId=props.devId,devId=_props$devId===void 0?'':_props$devId,_props$devName=props.devName,devName=_props$devName===void 0?'':_props$devName,onChangeStreamStatus=props.onChangeStreamStatus,onPlayerTap=props.onPlayerTap,onInitPreview=props.onInitPreview,_props$defaultMute=props.defaultMute,defaultMute=_props$defaultMute===void 0?true:_props$defaultMute,_props$onlineStatus=props.onlineStatus,onlineStatus=_props$onlineStatus===void 0?true:_props$onlineStatus,_props$loadDes=props.loadDes,loadDes=_props$loadDes===void 0?'':_props$loadDes,_props$rotateZ=props.rotateZ,rotateZ=_props$rotateZ===void 0?0:_props$rotateZ,_props$scalable=props.scalable,scalable=_props$scalable===void 0?true:_props$scalable,_props$scaleMultiple=props.scaleMultiple,scaleMultiple=_props$scaleMultiple===void 0?0:_props$scaleMultiple,_props$ptzControllabl=props.ptzControllable,ptzControllable=_props$ptzControllabl===void 0?true:_props$ptzControllabl,_props$isOnPlayerPage=props.isOnPlayerPage,isOnPlayerPage=_props$isOnPlayerPage===void 0?true:_props$isOnPlayerPage,_props$clarity=props.clarity,clarity=_props$clarity===void 0?'normal':_props$clarity,_props$soundMode=props.soundMode,soundMode=_props$soundMode===void 0?'speaker':_props$soundMode,_props$orientation=props.orientation,orientation=_props$orientation===void 0?'vertical':_props$orientation,onCtx=props.onCtx,_props$borderRadius=props.borderRadius,borderRadius=_props$borderRadius===void 0?0:_props$borderRadius,_props$bgColor=props.bgColor,bgColor=_props$bgColor===void 0?'#000000':_props$bgColor,_props$borderStyle=props.borderStyle,borderStyle=_props$borderStyle===void 0?'solid':_props$borderStyle,_props$borderColor=props.borderColor,borderColor=_props$borderColor===void 0?'':_props$borderColor,_props$borderWidth=props.borderWidth,borderWidth=_props$borderWidth===void 0?0:_props$borderWidth,_props$privateState=props.privateState,privateState=_props$privateState===void 0?false:_props$privateState;var _useImmer=(0,_useImmer3.useImmer)({connectState:false,loadingState:false,errorState:false,errorMsg:'',updateLy:'',devlineState:true,initLy:false}),_useImmer2=(0,_slicedToArray2.default)(_useImmer,2),playState=_useImmer2[0],setPlayState=_useImmer2[1];var ipcCtx=(0,_react.useRef)(null);var retryCount=(0,_react.useRef)(0);var muteRef=(0,_react.useRef)(defaultMute);(0,_ray.usePageEvent)('onShow',(0,_react.useCallback)(function(){if(ipcCtx.current&&playState.connectState){startPreview('');}},[playState.connectState]));(0,_ray.usePageEvent)('onHide',function(){return _regenerator.default.async(function(_context){while(1){switch(_context.prev=_context.next){case 0:setPlayState(function(d){d.loadingState=true;});_context.next=3;return _regenerator.default.awrap(getCurMute());case 3:stopPreview();case 4:case"end":return _context.stop();}}},null,null,null,Promise);});(0,_react.useEffect)(function(){setPlayState(function(d){d.errorState=privateState;});if(!privateState){retry();}},[privateState]);(0,_react.useEffect)(function(){muteRef.current=defaultMute;},[defaultMute]);(0,_react.useEffect)(function(){setPlayState(function(d){d.updateLy=updateLayout;});},[updateLayout]);(0,_react.useEffect)(function(){setPlayState(function(d){d.devlineState=onlineStatus;});if(!onlineStatus){setPlayState(function(d){d.errorState=true;d.errorMsg=_i18n.default.getLang('ipc_player_no_line');});}else if(playState.initLy){retry();}},[onlineStatus,playState.initLy]);(0,_react.useEffect)(function(){if(!isOnPlayerPage){disconnect();}},[isOnPlayerPage]);var _retry=function(){return _regenerator.default.async(function(_context2){while(1){switch(_context2.prev=_context2.next){case 0:setPlayState(function(d){d.connectState=false;d.errorMsg='';d.errorState=false;});_context2.t0=playState.connectState;if(!_context2.t0){_context2.next=5;break;}_context2.next=5;return _regenerator.default.awrap(disconnect());case 5:createConnect();case 6:case"end":return _context2.stop();}}},null,null,null,Promise);};var retry=(0,_react.useCallback)(function(){!privateState&&_retry();},[playState.connectState,privateState]);var createIpcCtx=function(id){var _ty;ipcCtx.current=(_ty=ty)===null||_ty===void 0?void 0:_ty.createIpcPlayerContext(id);onCtx&&onCtx({ctx:ipcCtx.current,retry:retry});};(0,_react.useEffect)(function(){onlineStatus&&createIpcCtx(devId);return function(){disconnect();ipcCtx.current=null;};},[devId,onlineStatus]);var createConnect=function(params){var _ipcCtx$current;setPlayState(function(d){d.loadingState=true;});(_ipcCtx$current=ipcCtx.current)===null||_ipcCtx$current===void 0?void 0:_ipcCtx$current.connect({success:function success(){setPlayState(function(d){d.connectState=true;d.errorState=false;d.errorMsg='';});onChangeStreamStatus&&onChangeStreamStatus(1001);startPreview(params);},fail:function fail(){setPlayState(function(d){d.connectState=false;d.errorState=true;d.errorMsg=_i18n.default.getLang('ipc_player_connect_fail');d.loadingState=false;});onChangeStreamStatus&&onChangeStreamStatus(-1001);}});};var startPreview=function(params){var _ipcCtx$current2;(_ipcCtx$current2=ipcCtx.current)===null||_ipcCtx$current2===void 0?void 0:_ipcCtx$current2.startPreview({success:function success(){setPlayState(function(d){d.loadingState=false;d.errorState=false;d.errorMsg='';});params&&onInitPreview&&onInitPreview(devId);onChangeStreamStatus&&onChangeStreamStatus(1002);},fail:function fail(){setPlayState(function(d){d.errorState=true;d.loadingState=false;d.errorMsg=_i18n.default.getLang('ipc_player_preview_fail');});onChangeStreamStatus&&onChangeStreamStatus(-1002);},complete:function complete(){setMuted(muteRef.current);}});};var stopPreview=function(){var _ipcCtx$current3;(_ipcCtx$current3=ipcCtx.current)===null||_ipcCtx$current3===void 0?void 0:_ipcCtx$current3.stopPreview({success:function success(){return null;},fail:function fail(){return null;},complete:function complete(){return setMuted(true);}});};var setMuted=function(val){var _ipcCtx$current4;(_ipcCtx$current4=ipcCtx.current)===null||_ipcCtx$current4===void 0?void 0:_ipcCtx$current4.setMuted({mute:val,success:function success(){},fail:function fail(){}});};var getCurMute=function(){return new Promise(function(resolve,reject){var _ipcCtx$current5;(_ipcCtx$current5=ipcCtx.current)===null||_ipcCtx$current5===void 0?void 0:_ipcCtx$current5.isMuted({success:function success(res){muteRef.current=res;},fail:function fail(e){reject(e);},complete:function complete(d){resolve(d);}});});};var onError=(0,_react.useCallback)(function(e){var _e$detail;if(playState.errorState){return;}var type=e===null||e===void 0?void 0:(_e$detail=e.detail)===null||_e$detail===void 0?void 0:_e$detail.errCode;if(_constant.IpcFailCode[type]){onChangeStreamStatus&&onChangeStreamStatus(type);setPlayState(function(d){d.loadingState=false;d.errorState=true;d.errorMsg=_i18n.default.getLang(_constant.IpcFailCode[type]);d.connectState=false;});}},[playState.errorState]);var disconnect=function(){return new Promise(function(resolve,reject){var _ipcCtx$current6;(_ipcCtx$current6=ipcCtx.current)===null||_ipcCtx$current6===void 0?void 0:_ipcCtx$current6.disconnect({success:function success(res){resolve(res);setPlayState(function(d){d.connectState=false;});onChangeStreamStatus&&onChangeStreamStatus(1009);},fail:function fail(e){reject(e);onChangeStreamStatus&&onChangeStreamStatus(-1009);}});});};return _react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.ipc_player),__source:{fileName:_jsxFileName,lineNumber:340,columnNumber:10}},isOnPlayerPage&&_react.default.createElement(_components.IpcPlayer,{onVideotap:function handlePlayerClick(){onPlayerTap&&onPlayerTap(devId);},onInitdone:function initdone(){setPlayState(function(d){d.updateLy=Math.random();d.initLy=true;});},onError:onError,onConnectchange:function connectchange(e){var _e$detail2;var code=e===null||e===void 0?void 0:(_e$detail2=e.detail)===null||_e$detail2===void 0?void 0:_e$detail2.state;onChangeStreamStatus&&onChangeStreamStatus(code===0?1001:-1001);if(code===0){setPlayState(function(d){d.connectState=true;});}else if((code===-3||code===-105)&&retryCount.current<1){retryCount.current++;retry();}else{setPlayState(function(d){d.connectState=false;d.loadingState=false;d.errorState=true;d.errorMsg=_i18n.default.getLang(_constant.IpcFailCode[-1001]);});}},deviceId:devId,autoPauseIfNavigate:false,autoPauseIfOpenNative:false,muted:defaultMute,objectFit:"fillCrop",clarity:clarity,soundMode:soundMode,orientation:orientation,rotateZ:rotateZ,scalable:scalable,scaleMultiple:scaleMultiple,ptzControllable:ptzControllable,borderRadius:borderRadius,borderStyle:borderStyle,borderColor:borderColor,borderWidth:borderWidth,updateLayout:playState.updateLy,backgroundColor:bgColor,__self:_this,style:_getStyle(_indexModule.default.player),__source:{fileName:_jsxFileName,lineNumber:341,columnNumber:26}}),_react.default.createElement(_components.View,{style:[_getStyle((0,_classnames.default)(_indexModule.default.load_box,_indexModule.default.bg_center,!playState.loadingState&&_indexModule.default.hide)),{borderRadius:""+borderRadius}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:345,columnNumber:7}},_react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.load_icon),__source:{fileName:_jsxFileName,lineNumber:348,columnNumber:9}}),_react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.load_des),__source:{fileName:_jsxFileName,lineNumber:349,columnNumber:9}},loadDes||_i18n.default.getLang('get_video_stream'))),_react.default.createElement(_components.CoverView,{style:[_getStyle((0,_classnames.default)(_indexModule.default.bg_center,_indexModule.default.state_label,!playState.errorState&&_indexModule.default.hide)),{borderRadius:""+borderRadius}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:354,columnNumber:7}},privateState?_react.default.createElement(_components.View,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:357,columnNumber:25}},_react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.device_sleep),__source:{fileName:_jsxFileName,lineNumber:358,columnNumber:13}},_i18n.default.getLang('device_sleep')),_react.default.createElement(_components.View,{onClick:function handleReWakeCamera(){return _regenerator.default.async(function(_context3){while(1){switch(_context3.prev=_context3.next){case 0:_context3.next=2;return _regenerator.default.awrap((0,_utils.putDpData)({105:false},devId));case 2:case"end":return _context3.stop();}}},null,null,null,Promise);},__self:_this,style:_getStyle(_indexModule.default.re_wake_camera),__source:{fileName:_jsxFileName,lineNumber:359,columnNumber:13}},_i18n.default.getLang('re_wake_camera'))):_react.default.createElement(_components.View,{style:[{width:'95%',textAlign:'center'}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:363,columnNumber:21}},_react.default.createElement(_components.View,{__self:_this,style:_getStyle((0,_classnames.default)(_indexModule.default.iconfont,_indexModule.default.icon_tishi,!playState.devlineState&&_indexModule.default.hide)),__source:{fileName:_jsxFileName,lineNumber:367,columnNumber:13}}),_react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.err_msg),__source:{fileName:_jsxFileName,lineNumber:368,columnNumber:13}},_react.default.createElement(_components.View,{__self:_this,style:_getStyle((0,_classnames.default)(_indexModule.default.msg,_indexModule.default.ellipsis)),__source:{fileName:_jsxFileName,lineNumber:369,columnNumber:15}},playState.errorMsg),_react.default.createElement(_components.Text,{style:[_getStyle(!playState.devlineState&&_indexModule.default.hide),{color:'#fff'}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:370,columnNumber:15}},"\uFF0C"),_react.default.createElement(_components.View,{onClick:retry,__self:_this,style:_getStyle((0,_classnames.default)(_indexModule.default.retry,!playState.devlineState&&_indexModule.default.hide)),__source:{fileName:_jsxFileName,lineNumber:375,columnNumber:15}},_i18n.default.getLang('ipc_player_retry'))))));};var _default=Player;exports.default=_default;
1
+ var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _regenerator=_interopRequireDefault(require("@babel/runtime/regenerator"));var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _useImmer3=require("use-immer");var _components=require("@ray-js/components");var _classnames=_interopRequireDefault(require("classnames"));var _ray=require("ray");var _i18n=_interopRequireDefault(require("./i18n"));var _indexModule=_interopRequireDefault(require("./index.module.less"));var _constant=require("./constant");var _utils=require("./utils");var _this=this,_jsxFileName="/drone/src/src/index.tsx";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}function _getClassName(){var className=[];var args=arguments[0];var type=Object.prototype.toString.call(args).slice(8,-1).toLowerCase();if(type==='string'){args=args.trim();args&&className.push(args);}else if(type==='array'){args.forEach(function(cls){cls=_getClassName(cls).trim();cls&&className.push(cls);});}else if(type==='object'){for(var k in args){k=k.trim();if(k&&args.hasOwnProperty(k)&&args[k]){className.push(k);}}}return className.join(' ').trim();}function _getStyle(classNameExpression){var className=_getClassName(classNameExpression);var classNameArr=className.split(/\s+/);var style={};classNameArr.reduce((sty,cls)=>Object.assign(sty,_styleSheet[cls.trim()]),style);const sty=Object.keys(style).length>0?style:classNameExpression;let result=sty;if(sty instanceof Array){sty.map(item=>{result={...result,...item};});}return result;}var _styleSheet=_indexModule.default;var Player=function(props){var _props$updateLayout=props.updateLayout,updateLayout=_props$updateLayout===void 0?'':_props$updateLayout,_props$devId=props.devId,devId=_props$devId===void 0?'':_props$devId,onChangeStreamStatus=props.onChangeStreamStatus,onPlayerTap=props.onPlayerTap,onInitPreview=props.onInitPreview,_props$defaultMute=props.defaultMute,defaultMute=_props$defaultMute===void 0?true:_props$defaultMute,_props$onlineStatus=props.onlineStatus,onlineStatus=_props$onlineStatus===void 0?true:_props$onlineStatus,_props$loadText=props.loadText,loadText=_props$loadText===void 0?'':_props$loadText,_props$rotateZ=props.rotateZ,rotateZ=_props$rotateZ===void 0?0:_props$rotateZ,_props$scalable=props.scalable,scalable=_props$scalable===void 0?true:_props$scalable,_props$scaleMultiple=props.scaleMultiple,scaleMultiple=_props$scaleMultiple===void 0?0:_props$scaleMultiple,_props$ptzControllabl=props.ptzControllable,ptzControllable=_props$ptzControllabl===void 0?true:_props$ptzControllabl,_props$clarity=props.clarity,clarity=_props$clarity===void 0?'normal':_props$clarity,onCtx=props.onCtx,_props$playerStyle=props.playerStyle,playerStyle=_props$playerStyle===void 0?{borderRadius:0,bgColor:'#000000',borderStyle:'solid',borderColor:'',borderWidth:0}:_props$playerStyle,_props$privateState=props.privateState,privateState=_props$privateState===void 0?false:_props$privateState,_props$extend=props.extend,extend=_props$extend===void 0?{}:_props$extend;var borderRadius=playerStyle.borderRadius,bgColor=playerStyle.bgColor,borderStyle=playerStyle.borderStyle,borderColor=playerStyle.borderColor,borderWidth=playerStyle.borderWidth;var _useImmer=(0,_useImmer3.useImmer)({connectState:false,loadingState:false,errorState:false,errorMsg:'',updateLy:'',deviceOnlineState:true,initLy:false}),_useImmer2=(0,_slicedToArray2.default)(_useImmer,2),playState=_useImmer2[0],setPlayState=_useImmer2[1];var ipcCtx=(0,_react.useRef)(null);var retryCount=(0,_react.useRef)(0);var muteRef=(0,_react.useRef)(defaultMute);(0,_ray.usePageEvent)('onShow',(0,_react.useCallback)(function(){if(ipcCtx.current&&playState.connectState){startPreview('');}},[playState.connectState]));(0,_ray.usePageEvent)('onHide',function(){return _regenerator.default.async(function(_context){while(1){switch(_context.prev=_context.next){case 0:setPlayState(function(d){d.loadingState=true;});_context.next=3;return _regenerator.default.awrap(getCurMute());case 3:stopPreview();case 4:case"end":return _context.stop();}}},null,null,null,Promise);});(0,_react.useEffect)(function(){setPlayState(function(d){d.errorState=privateState;});if(!privateState){retry();}},[privateState]);(0,_react.useEffect)(function(){muteRef.current=defaultMute;},[defaultMute]);(0,_react.useEffect)(function(){setPlayState(function(d){d.updateLy=updateLayout;});},[updateLayout]);(0,_react.useEffect)(function(){setPlayState(function(d){d.deviceOnlineState=onlineStatus;});if(!onlineStatus){setPlayState(function(d){d.errorState=true;d.errorMsg=_i18n.default.getLang('ipc_player_no_line');});}else if(playState.initLy){retry();}},[onlineStatus,playState.initLy]);var _retry=function(){return _regenerator.default.async(function(_context2){while(1){switch(_context2.prev=_context2.next){case 0:setPlayState(function(d){d.connectState=false;d.errorMsg='';d.errorState=false;d.loadingState=true;});_context2.t0=playState.connectState;if(!_context2.t0){_context2.next=5;break;}_context2.next=5;return _regenerator.default.awrap(disconnect());case 5:createConnect();case 6:case"end":return _context2.stop();}}},null,null,null,Promise);};var retry=(0,_react.useCallback)(function(){!privateState&&_retry();},[playState.connectState,privateState]);var createIpcCtx=function(id){var _ty;ipcCtx.current=(_ty=ty)===null||_ty===void 0?void 0:_ty.createIpcPlayerContext(id);onCtx&&onCtx({ctx:ipcCtx.current,retry:retry});};(0,_react.useEffect)(function(){onlineStatus&&createIpcCtx(devId);return function(){disconnect();ipcCtx.current=null;};},[devId,onlineStatus]);var createConnect=function(params){var _ipcCtx$current;setPlayState(function(d){d.loadingState=true;});(_ipcCtx$current=ipcCtx.current)===null||_ipcCtx$current===void 0?void 0:_ipcCtx$current.connect({success:function success(){setPlayState(function(d){d.connectState=true;d.errorState=false;d.errorMsg='';});onChangeStreamStatus&&onChangeStreamStatus(1001);startPreview(params);},fail:function fail(){setPlayState(function(d){d.connectState=false;d.errorState=true;d.errorMsg=_i18n.default.getLang('ipc_player_connect_fail');d.loadingState=false;});onChangeStreamStatus&&onChangeStreamStatus(-1001);}});};var startPreview=function(params){var _ipcCtx$current2;(_ipcCtx$current2=ipcCtx.current)===null||_ipcCtx$current2===void 0?void 0:_ipcCtx$current2.startPreview({success:function success(){setPlayState(function(d){d.loadingState=false;d.errorState=false;d.errorMsg='';});params&&onInitPreview&&onInitPreview(devId);onChangeStreamStatus&&onChangeStreamStatus(1002);},fail:function fail(){setPlayState(function(d){d.errorState=true;d.loadingState=false;d.errorMsg=_i18n.default.getLang('ipc_player_preview_fail');});onChangeStreamStatus&&onChangeStreamStatus(-1002);},complete:function complete(){setMuted(muteRef.current);}});};var stopPreview=function(){var _ipcCtx$current3;(_ipcCtx$current3=ipcCtx.current)===null||_ipcCtx$current3===void 0?void 0:_ipcCtx$current3.stopPreview({success:function success(){return null;},fail:function fail(){return null;},complete:function complete(){return setMuted(true);}});};var setMuted=function(val){var _ipcCtx$current4;(_ipcCtx$current4=ipcCtx.current)===null||_ipcCtx$current4===void 0?void 0:_ipcCtx$current4.setMuted({mute:val,success:function success(){},fail:function fail(){}});};var getCurMute=function(){return new Promise(function(resolve,reject){var _ipcCtx$current5;(_ipcCtx$current5=ipcCtx.current)===null||_ipcCtx$current5===void 0?void 0:_ipcCtx$current5.isMuted({success:function success(res){muteRef.current=res;},fail:function fail(e){reject(e);},complete:function complete(d){resolve(d);}});});};var onError=(0,_react.useCallback)(function(e){var _e$detail;if(playState.errorState){return;}var type=e===null||e===void 0?void 0:(_e$detail=e.detail)===null||_e$detail===void 0?void 0:_e$detail.errCode;if(_constant.IpcFailCode[type]){onChangeStreamStatus&&onChangeStreamStatus(type);setPlayState(function(d){d.loadingState=false;d.errorState=true;d.errorMsg=_i18n.default.getLang(_constant.IpcFailCode[type]);d.connectState=false;});}},[playState.errorState]);var disconnect=function(){return new Promise(function(resolve,reject){var _ipcCtx$current6;(_ipcCtx$current6=ipcCtx.current)===null||_ipcCtx$current6===void 0?void 0:_ipcCtx$current6.disconnect({success:function success(res){resolve(res);setPlayState(function(d){d.connectState=false;});onChangeStreamStatus&&onChangeStreamStatus(1009);},fail:function fail(e){reject(e);onChangeStreamStatus&&onChangeStreamStatus(-1009);}});});};return _react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.ipc_player),__source:{fileName:_jsxFileName,lineNumber:342,columnNumber:10}},_react.default.createElement(_components.IpcPlayer,(0,_extends2.default)({onVideotap:function handlePlayerClick(){onPlayerTap&&onPlayerTap(devId);},onInitdone:function initdone(){setPlayState(function(d){d.updateLy=Math.random();d.initLy=true;});},onError:onError,onConnectchange:function connectchange(e){var _e$detail2;var code=e===null||e===void 0?void 0:(_e$detail2=e.detail)===null||_e$detail2===void 0?void 0:_e$detail2.state;onChangeStreamStatus&&onChangeStreamStatus(code===0?1001:-1001);if(code===0){setPlayState(function(d){d.connectState=true;});}else if((code===-3||code===-105)&&retryCount.current<1){retryCount.current++;retry();}else{setPlayState(function(d){d.connectState=false;d.loadingState=false;d.errorState=true;d.errorMsg=_i18n.default.getLang(_constant.IpcFailCode[-1001]);});}},deviceId:devId,autoPauseIfNavigate:false,autoPauseIfOpenNative:false,muted:defaultMute,objectFit:"fillCrop",clarity:clarity,rotateZ:rotateZ,scalable:scalable,scaleMultiple:scaleMultiple,ptzControllable:ptzControllable,borderRadius:borderRadius,borderStyle:borderStyle,borderColor:borderColor,borderWidth:borderWidth,updateLayout:playState.updateLy,backgroundColor:bgColor},extend,{__self:_this,style:_getStyle(_indexModule.default.player),__source:{fileName:_jsxFileName,lineNumber:343,columnNumber:7}})),_react.default.createElement(_components.View,{style:[_getStyle((0,_classnames.default)(_indexModule.default.load_box,_indexModule.default.bg_center,!playState.loadingState&&_indexModule.default.hide)),{borderRadius:""+borderRadius}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:347,columnNumber:7}},_react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.load_icon),__source:{fileName:_jsxFileName,lineNumber:350,columnNumber:9}}),_react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.load_des),__source:{fileName:_jsxFileName,lineNumber:351,columnNumber:9}},loadText||_i18n.default.getLang('get_video_stream'))),_react.default.createElement(_components.CoverView,{style:[_getStyle((0,_classnames.default)(_indexModule.default.bg_center,_indexModule.default.state_label,!playState.errorState&&_indexModule.default.hide)),{borderRadius:""+borderRadius}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:356,columnNumber:7}},privateState?_react.default.createElement(_components.View,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:359,columnNumber:25}},_react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.device_sleep),__source:{fileName:_jsxFileName,lineNumber:360,columnNumber:13}},_i18n.default.getLang('device_sleep')),_react.default.createElement(_components.View,{onClick:function handleReWakeCamera(){return _regenerator.default.async(function(_context3){while(1){switch(_context3.prev=_context3.next){case 0:_context3.next=2;return _regenerator.default.awrap((0,_utils.putDpData)({105:false},devId));case 2:case"end":return _context3.stop();}}},null,null,null,Promise);},__self:_this,style:_getStyle(_indexModule.default.re_wake_camera),__source:{fileName:_jsxFileName,lineNumber:361,columnNumber:13}},_i18n.default.getLang('re_wake_camera'))):_react.default.createElement(_components.View,{style:[{width:'95%',textAlign:'center'}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:365,columnNumber:21}},_react.default.createElement(_components.View,{__self:_this,style:_getStyle((0,_classnames.default)(_indexModule.default.iconfont,_indexModule.default.icon_tishi,!playState.deviceOnlineState&&_indexModule.default.hide)),__source:{fileName:_jsxFileName,lineNumber:369,columnNumber:13}}),_react.default.createElement(_components.View,{__self:_this,style:_getStyle(_indexModule.default.err_msg),__source:{fileName:_jsxFileName,lineNumber:370,columnNumber:13}},_react.default.createElement(_components.View,{__self:_this,style:_getStyle((0,_classnames.default)(_indexModule.default.msg,_indexModule.default.ellipsis)),__source:{fileName:_jsxFileName,lineNumber:371,columnNumber:15}},playState.errorMsg),_react.default.createElement(_components.View,{onClick:retry,__self:_this,style:_getStyle((0,_classnames.default)(_indexModule.default.retry,!playState.deviceOnlineState&&_indexModule.default.hide)),__source:{fileName:_jsxFileName,lineNumber:372,columnNumber:15}},_i18n.default.getLang('ipc_player_retry'))))));};var _default=Player;exports.default=_default;
package/lib/index.js CHANGED
@@ -1,3 +1,4 @@
1
+ import _extends from "@babel/runtime/helpers/esm/extends";
1
2
  import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
2
3
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
3
4
  import "core-js/modules/es.object.to-string.js";
@@ -5,7 +6,7 @@ import "core-js/modules/es.promise.js";
5
6
  import _regeneratorRuntime from "@babel/runtime/regenerator";
6
7
  import React, { useEffect, useRef, useCallback } from 'react';
7
8
  import { useImmer } from 'use-immer';
8
- import { IpcPlayer, View, Text, CoverView } from '@ray-js/components';
9
+ import { IpcPlayer, View, CoverView } from '@ray-js/components';
9
10
  import cx from 'classnames';
10
11
  import { usePageEvent } from 'ray';
11
12
  import locals from './i18n';
@@ -18,8 +19,6 @@ var Player = function (props) {
18
19
  updateLayout = _props$updateLayout === void 0 ? '' : _props$updateLayout,
19
20
  _props$devId = props.devId,
20
21
  devId = _props$devId === void 0 ? '' : _props$devId,
21
- _props$devName = props.devName,
22
- devName = _props$devName === void 0 ? '' : _props$devName,
23
22
  onChangeStreamStatus = props.onChangeStreamStatus,
24
23
  onPlayerTap = props.onPlayerTap,
25
24
  onInitPreview = props.onInitPreview,
@@ -27,8 +26,8 @@ var Player = function (props) {
27
26
  defaultMute = _props$defaultMute === void 0 ? true : _props$defaultMute,
28
27
  _props$onlineStatus = props.onlineStatus,
29
28
  onlineStatus = _props$onlineStatus === void 0 ? true : _props$onlineStatus,
30
- _props$loadDes = props.loadDes,
31
- loadDes = _props$loadDes === void 0 ? '' : _props$loadDes,
29
+ _props$loadText = props.loadText,
30
+ loadText = _props$loadText === void 0 ? '' : _props$loadText,
32
31
  _props$rotateZ = props.rotateZ,
33
32
  rotateZ = _props$rotateZ === void 0 ? 0 : _props$rotateZ,
34
33
  _props$scalable = props.scalable,
@@ -37,27 +36,26 @@ var Player = function (props) {
37
36
  scaleMultiple = _props$scaleMultiple === void 0 ? 0 : _props$scaleMultiple,
38
37
  _props$ptzControllabl = props.ptzControllable,
39
38
  ptzControllable = _props$ptzControllabl === void 0 ? true : _props$ptzControllabl,
40
- _props$isOnPlayerPage = props.isOnPlayerPage,
41
- isOnPlayerPage = _props$isOnPlayerPage === void 0 ? true : _props$isOnPlayerPage,
42
39
  _props$clarity = props.clarity,
43
40
  clarity = _props$clarity === void 0 ? 'normal' : _props$clarity,
44
- _props$soundMode = props.soundMode,
45
- soundMode = _props$soundMode === void 0 ? 'speaker' : _props$soundMode,
46
- _props$orientation = props.orientation,
47
- orientation = _props$orientation === void 0 ? 'vertical' : _props$orientation,
48
41
  onCtx = props.onCtx,
49
- _props$borderRadius = props.borderRadius,
50
- borderRadius = _props$borderRadius === void 0 ? 0 : _props$borderRadius,
51
- _props$bgColor = props.bgColor,
52
- bgColor = _props$bgColor === void 0 ? '#000000' : _props$bgColor,
53
- _props$borderStyle = props.borderStyle,
54
- borderStyle = _props$borderStyle === void 0 ? 'solid' : _props$borderStyle,
55
- _props$borderColor = props.borderColor,
56
- borderColor = _props$borderColor === void 0 ? '' : _props$borderColor,
57
- _props$borderWidth = props.borderWidth,
58
- borderWidth = _props$borderWidth === void 0 ? 0 : _props$borderWidth,
42
+ _props$playerStyle = props.playerStyle,
43
+ playerStyle = _props$playerStyle === void 0 ? {
44
+ borderRadius: 0,
45
+ bgColor: '#000000',
46
+ borderStyle: 'solid',
47
+ borderColor: '',
48
+ borderWidth: 0
49
+ } : _props$playerStyle,
59
50
  _props$privateState = props.privateState,
60
- privateState = _props$privateState === void 0 ? false : _props$privateState;
51
+ privateState = _props$privateState === void 0 ? false : _props$privateState,
52
+ _props$extend = props.extend,
53
+ extend = _props$extend === void 0 ? {} : _props$extend;
54
+ var borderRadius = playerStyle.borderRadius,
55
+ bgColor = playerStyle.bgColor,
56
+ borderStyle = playerStyle.borderStyle,
57
+ borderColor = playerStyle.borderColor,
58
+ borderWidth = playerStyle.borderWidth;
61
59
 
62
60
  var _useImmer = useImmer({
63
61
  connectState: false,
@@ -69,7 +67,7 @@ var Player = function (props) {
69
67
  errorMsg: '',
70
68
  // 异常信息
71
69
  updateLy: '',
72
- devlineState: true,
70
+ deviceOnlineState: true,
73
71
  initLy: false
74
72
  }),
75
73
  _useImmer2 = _slicedToArray(_useImmer, 2),
@@ -131,7 +129,7 @@ var Player = function (props) {
131
129
 
132
130
  useEffect(function () {
133
131
  setPlayState(function (d) {
134
- d.devlineState = onlineStatus;
132
+ d.deviceOnlineState = onlineStatus;
135
133
  });
136
134
 
137
135
  if (!onlineStatus) {
@@ -142,12 +140,7 @@ var Player = function (props) {
142
140
  } else if (playState.initLy) {
143
141
  retry();
144
142
  }
145
- }, [onlineStatus, playState.initLy]);
146
- useEffect(function () {
147
- if (!isOnPlayerPage) {
148
- disconnect();
149
- }
150
- }, [isOnPlayerPage]); // 重试
143
+ }, [onlineStatus, playState.initLy]); // 重试
151
144
 
152
145
  var _retry = /*#__PURE__*/function () {
153
146
  var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
@@ -159,6 +152,7 @@ var Player = function (props) {
159
152
  d.connectState = false;
160
153
  d.errorMsg = '';
161
154
  d.errorState = false;
155
+ d.loadingState = true;
162
156
  });
163
157
  _context2.t0 = playState.connectState;
164
158
 
@@ -395,7 +389,7 @@ var Player = function (props) {
395
389
 
396
390
  return /*#__PURE__*/React.createElement(View, {
397
391
  className: Styles.ipc_player
398
- }, isOnPlayerPage && /*#__PURE__*/React.createElement(IpcPlayer, {
392
+ }, /*#__PURE__*/React.createElement(IpcPlayer, _extends({
399
393
  className: Styles.player,
400
394
  onVideotap: function handlePlayerClick() {
401
395
  // console.log("videoTap:", devId);
@@ -439,8 +433,6 @@ var Player = function (props) {
439
433
  muted: defaultMute,
440
434
  objectFit: "fillCrop",
441
435
  clarity: clarity,
442
- soundMode: soundMode,
443
- orientation: orientation,
444
436
  rotateZ: rotateZ,
445
437
  scalable: scalable,
446
438
  scaleMultiple: scaleMultiple,
@@ -451,7 +443,7 @@ var Player = function (props) {
451
443
  borderWidth: borderWidth,
452
444
  updateLayout: playState.updateLy,
453
445
  backgroundColor: bgColor
454
- }), /*#__PURE__*/React.createElement(View, {
446
+ }, extend)), /*#__PURE__*/React.createElement(View, {
455
447
  style: {
456
448
  borderRadius: "".concat(borderRadius)
457
449
  },
@@ -460,7 +452,7 @@ var Player = function (props) {
460
452
  className: Styles.load_icon
461
453
  }), /*#__PURE__*/React.createElement(View, {
462
454
  className: Styles.load_des
463
- }, loadDes || locals.getLang('get_video_stream'))), /*#__PURE__*/React.createElement(CoverView, {
455
+ }, loadText || locals.getLang('get_video_stream'))), /*#__PURE__*/React.createElement(CoverView, {
464
456
  style: {
465
457
  borderRadius: "".concat(borderRadius)
466
458
  },
@@ -477,20 +469,15 @@ var Player = function (props) {
477
469
  textAlign: 'center'
478
470
  }
479
471
  }, /*#__PURE__*/React.createElement(View, {
480
- className: cx(Styles.iconfont, Styles.icon_tishi, !playState.devlineState && Styles.hide)
472
+ className: cx(Styles.iconfont, Styles.icon_tishi, !playState.deviceOnlineState && Styles.hide)
481
473
  }), /*#__PURE__*/React.createElement(View, {
482
474
  className: Styles.err_msg
483
475
  }, /*#__PURE__*/React.createElement(View, {
484
476
  className: cx(Styles.msg, Styles.ellipsis)
485
- }, playState.errorMsg), /*#__PURE__*/React.createElement(Text, {
486
- style: {
487
- color: '#fff'
488
- },
489
- className: !playState.devlineState && Styles.hide
490
- }, "\uFF0C"), /*#__PURE__*/React.createElement(View // @ts-ignore
477
+ }, playState.errorMsg), /*#__PURE__*/React.createElement(View // @ts-ignore
491
478
  , {
492
479
  onClick: retry,
493
- className: cx(Styles.retry, !playState.devlineState && Styles.hide)
480
+ className: cx(Styles.retry, !playState.deviceOnlineState && Styles.hide)
494
481
  }, locals.getLang('ipc_player_retry'))))));
495
482
  };
496
483
 
package/lib/index.module.less CHANGED
@@ -105,6 +105,10 @@
105
105
  color: #5583F5;
106
106
  }
107
107
 
108
+ .retry {
109
+ padding-left: 0.1rem;
110
+ }
111
+
108
112
  .device_sleep, .re_wake_camera {
109
113
  width: 100%;
110
114
  }
package/lib/index.tuya.js CHANGED
@@ -1,3 +1,4 @@
1
+ import _extends from "@babel/runtime/helpers/esm/extends";
1
2
  import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
2
3
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
3
4
  import "core-js/modules/es.object.to-string.js";
@@ -5,7 +6,7 @@ import "core-js/modules/es.promise.js";
5
6
  import _regeneratorRuntime from "@babel/runtime/regenerator";
6
7
  import React, { useEffect, useRef, useCallback } from 'react';
7
8
  import { useImmer } from 'use-immer';
8
- import { IpcPlayer, View, Text, CoverView } from '@ray-js/components';
9
+ import { IpcPlayer, View, CoverView } from '@ray-js/components';
9
10
  import cx from 'classnames';
10
11
  import { usePageEvent } from 'ray';
11
12
  import locals from './i18n';
@@ -18,8 +19,6 @@ var Player = function (props) {
18
19
  updateLayout = _props$updateLayout === void 0 ? '' : _props$updateLayout,
19
20
  _props$devId = props.devId,
20
21
  devId = _props$devId === void 0 ? '' : _props$devId,
21
- _props$devName = props.devName,
22
- devName = _props$devName === void 0 ? '' : _props$devName,
23
22
  onChangeStreamStatus = props.onChangeStreamStatus,
24
23
  onPlayerTap = props.onPlayerTap,
25
24
  onInitPreview = props.onInitPreview,
@@ -27,8 +26,8 @@ var Player = function (props) {
27
26
  defaultMute = _props$defaultMute === void 0 ? true : _props$defaultMute,
28
27
  _props$onlineStatus = props.onlineStatus,
29
28
  onlineStatus = _props$onlineStatus === void 0 ? true : _props$onlineStatus,
30
- _props$loadDes = props.loadDes,
31
- loadDes = _props$loadDes === void 0 ? '' : _props$loadDes,
29
+ _props$loadText = props.loadText,
30
+ loadText = _props$loadText === void 0 ? '' : _props$loadText,
32
31
  _props$rotateZ = props.rotateZ,
33
32
  rotateZ = _props$rotateZ === void 0 ? 0 : _props$rotateZ,
34
33
  _props$scalable = props.scalable,
@@ -37,27 +36,26 @@ var Player = function (props) {
37
36
  scaleMultiple = _props$scaleMultiple === void 0 ? 0 : _props$scaleMultiple,
38
37
  _props$ptzControllabl = props.ptzControllable,
39
38
  ptzControllable = _props$ptzControllabl === void 0 ? true : _props$ptzControllabl,
40
- _props$isOnPlayerPage = props.isOnPlayerPage,
41
- isOnPlayerPage = _props$isOnPlayerPage === void 0 ? true : _props$isOnPlayerPage,
42
39
  _props$clarity = props.clarity,
43
40
  clarity = _props$clarity === void 0 ? 'normal' : _props$clarity,
44
- _props$soundMode = props.soundMode,
45
- soundMode = _props$soundMode === void 0 ? 'speaker' : _props$soundMode,
46
- _props$orientation = props.orientation,
47
- orientation = _props$orientation === void 0 ? 'vertical' : _props$orientation,
48
41
  onCtx = props.onCtx,
49
- _props$borderRadius = props.borderRadius,
50
- borderRadius = _props$borderRadius === void 0 ? 0 : _props$borderRadius,
51
- _props$bgColor = props.bgColor,
52
- bgColor = _props$bgColor === void 0 ? '#000000' : _props$bgColor,
53
- _props$borderStyle = props.borderStyle,
54
- borderStyle = _props$borderStyle === void 0 ? 'solid' : _props$borderStyle,
55
- _props$borderColor = props.borderColor,
56
- borderColor = _props$borderColor === void 0 ? '' : _props$borderColor,
57
- _props$borderWidth = props.borderWidth,
58
- borderWidth = _props$borderWidth === void 0 ? 0 : _props$borderWidth,
42
+ _props$playerStyle = props.playerStyle,
43
+ playerStyle = _props$playerStyle === void 0 ? {
44
+ borderRadius: 0,
45
+ bgColor: '#000000',
46
+ borderStyle: 'solid',
47
+ borderColor: '',
48
+ borderWidth: 0
49
+ } : _props$playerStyle,
59
50
  _props$privateState = props.privateState,
60
- privateState = _props$privateState === void 0 ? false : _props$privateState;
51
+ privateState = _props$privateState === void 0 ? false : _props$privateState,
52
+ _props$extend = props.extend,
53
+ extend = _props$extend === void 0 ? {} : _props$extend;
54
+ var borderRadius = playerStyle.borderRadius,
55
+ bgColor = playerStyle.bgColor,
56
+ borderStyle = playerStyle.borderStyle,
57
+ borderColor = playerStyle.borderColor,
58
+ borderWidth = playerStyle.borderWidth;
61
59
 
62
60
  var _useImmer = useImmer({
63
61
  connectState: false,
@@ -69,7 +67,7 @@ var Player = function (props) {
69
67
  errorMsg: '',
70
68
  // 异常信息
71
69
  updateLy: '',
72
- devlineState: true,
70
+ deviceOnlineState: true,
73
71
  initLy: false
74
72
  }),
75
73
  _useImmer2 = _slicedToArray(_useImmer, 2),
@@ -131,7 +129,7 @@ var Player = function (props) {
131
129
 
132
130
  useEffect(function () {
133
131
  setPlayState(function (d) {
134
- d.devlineState = onlineStatus;
132
+ d.deviceOnlineState = onlineStatus;
135
133
  });
136
134
 
137
135
  if (!onlineStatus) {
@@ -142,12 +140,7 @@ var Player = function (props) {
142
140
  } else if (playState.initLy) {
143
141
  retry();
144
142
  }
145
- }, [onlineStatus, playState.initLy]);
146
- useEffect(function () {
147
- if (!isOnPlayerPage) {
148
- disconnect();
149
- }
150
- }, [isOnPlayerPage]); // 重试
143
+ }, [onlineStatus, playState.initLy]); // 重试
151
144
 
152
145
  var _retry = /*#__PURE__*/function () {
153
146
  var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
@@ -159,6 +152,7 @@ var Player = function (props) {
159
152
  d.connectState = false;
160
153
  d.errorMsg = '';
161
154
  d.errorState = false;
155
+ d.loadingState = true;
162
156
  });
163
157
  _context2.t0 = playState.connectState;
164
158
 
@@ -395,7 +389,7 @@ var Player = function (props) {
395
389
 
396
390
  return /*#__PURE__*/React.createElement(View, {
397
391
  className: Styles.ipc_player
398
- }, isOnPlayerPage && /*#__PURE__*/React.createElement(IpcPlayer, {
392
+ }, /*#__PURE__*/React.createElement(IpcPlayer, _extends({
399
393
  className: Styles.player,
400
394
  onVideotap: function handlePlayerClick() {
401
395
  // console.log("videoTap:", devId);
@@ -439,8 +433,6 @@ var Player = function (props) {
439
433
  muted: defaultMute,
440
434
  objectFit: "fillCrop",
441
435
  clarity: clarity,
442
- soundMode: soundMode,
443
- orientation: orientation,
444
436
  rotateZ: rotateZ,
445
437
  scalable: scalable,
446
438
  scaleMultiple: scaleMultiple,
@@ -451,7 +443,7 @@ var Player = function (props) {
451
443
  borderWidth: borderWidth,
452
444
  updateLayout: playState.updateLy,
453
445
  backgroundColor: bgColor
454
- }), /*#__PURE__*/React.createElement(View, {
446
+ }, extend)), /*#__PURE__*/React.createElement(View, {
455
447
  style: {
456
448
  borderRadius: "".concat(borderRadius)
457
449
  },
@@ -460,7 +452,7 @@ var Player = function (props) {
460
452
  className: Styles.load_icon
461
453
  }), /*#__PURE__*/React.createElement(View, {
462
454
  className: Styles.load_des
463
- }, loadDes || locals.getLang('get_video_stream'))), /*#__PURE__*/React.createElement(CoverView, {
455
+ }, loadText || locals.getLang('get_video_stream'))), /*#__PURE__*/React.createElement(CoverView, {
464
456
  style: {
465
457
  borderRadius: "".concat(borderRadius)
466
458
  },
@@ -477,20 +469,15 @@ var Player = function (props) {
477
469
  textAlign: 'center'
478
470
  }
479
471
  }, /*#__PURE__*/React.createElement(View, {
480
- className: cx(Styles.iconfont, Styles.icon_tishi, !playState.devlineState && Styles.hide)
472
+ className: cx(Styles.iconfont, Styles.icon_tishi, !playState.deviceOnlineState && Styles.hide)
481
473
  }), /*#__PURE__*/React.createElement(View, {
482
474
  className: Styles.err_msg
483
475
  }, /*#__PURE__*/React.createElement(View, {
484
476
  className: cx(Styles.msg, Styles.ellipsis)
485
- }, playState.errorMsg), /*#__PURE__*/React.createElement(Text, {
486
- style: {
487
- color: '#fff'
488
- },
489
- className: !playState.devlineState && Styles.hide
490
- }, "\uFF0C"), /*#__PURE__*/React.createElement(View // @ts-ignore
477
+ }, playState.errorMsg), /*#__PURE__*/React.createElement(View // @ts-ignore
491
478
  , {
492
479
  onClick: retry,
493
- className: cx(Styles.retry, !playState.devlineState && Styles.hide)
480
+ className: cx(Styles.retry, !playState.deviceOnlineState && Styles.hide)
494
481
  }, locals.getLang('ipc_player_retry'))))));
495
482
  };
496
483
 
package/lib/index.web.js CHANGED
@@ -1,3 +1,4 @@
1
+ import _extends from "@babel/runtime/helpers/esm/extends";
1
2
  import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
2
3
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
3
4
  import "core-js/modules/es.object.to-string.js";
@@ -5,7 +6,7 @@ import "core-js/modules/es.promise.js";
5
6
  import _regeneratorRuntime from "@babel/runtime/regenerator";
6
7
  import React, { useEffect, useRef, useCallback } from 'react';
7
8
  import { useImmer } from 'use-immer';
8
- import { IpcPlayer, View, Text, CoverView } from '@ray-js/components';
9
+ import { IpcPlayer, View, CoverView } from '@ray-js/components';
9
10
  import cx from 'classnames';
10
11
  import { usePageEvent } from 'ray';
11
12
  import locals from './i18n';
@@ -18,8 +19,6 @@ var Player = function (props) {
18
19
  updateLayout = _props$updateLayout === void 0 ? '' : _props$updateLayout,
19
20
  _props$devId = props.devId,
20
21
  devId = _props$devId === void 0 ? '' : _props$devId,
21
- _props$devName = props.devName,
22
- devName = _props$devName === void 0 ? '' : _props$devName,
23
22
  onChangeStreamStatus = props.onChangeStreamStatus,
24
23
  onPlayerTap = props.onPlayerTap,
25
24
  onInitPreview = props.onInitPreview,
@@ -27,8 +26,8 @@ var Player = function (props) {
27
26
  defaultMute = _props$defaultMute === void 0 ? true : _props$defaultMute,
28
27
  _props$onlineStatus = props.onlineStatus,
29
28
  onlineStatus = _props$onlineStatus === void 0 ? true : _props$onlineStatus,
30
- _props$loadDes = props.loadDes,
31
- loadDes = _props$loadDes === void 0 ? '' : _props$loadDes,
29
+ _props$loadText = props.loadText,
30
+ loadText = _props$loadText === void 0 ? '' : _props$loadText,
32
31
  _props$rotateZ = props.rotateZ,
33
32
  rotateZ = _props$rotateZ === void 0 ? 0 : _props$rotateZ,
34
33
  _props$scalable = props.scalable,
@@ -37,27 +36,26 @@ var Player = function (props) {
37
36
  scaleMultiple = _props$scaleMultiple === void 0 ? 0 : _props$scaleMultiple,
38
37
  _props$ptzControllabl = props.ptzControllable,
39
38
  ptzControllable = _props$ptzControllabl === void 0 ? true : _props$ptzControllabl,
40
- _props$isOnPlayerPage = props.isOnPlayerPage,
41
- isOnPlayerPage = _props$isOnPlayerPage === void 0 ? true : _props$isOnPlayerPage,
42
39
  _props$clarity = props.clarity,
43
40
  clarity = _props$clarity === void 0 ? 'normal' : _props$clarity,
44
- _props$soundMode = props.soundMode,
45
- soundMode = _props$soundMode === void 0 ? 'speaker' : _props$soundMode,
46
- _props$orientation = props.orientation,
47
- orientation = _props$orientation === void 0 ? 'vertical' : _props$orientation,
48
41
  onCtx = props.onCtx,
49
- _props$borderRadius = props.borderRadius,
50
- borderRadius = _props$borderRadius === void 0 ? 0 : _props$borderRadius,
51
- _props$bgColor = props.bgColor,
52
- bgColor = _props$bgColor === void 0 ? '#000000' : _props$bgColor,
53
- _props$borderStyle = props.borderStyle,
54
- borderStyle = _props$borderStyle === void 0 ? 'solid' : _props$borderStyle,
55
- _props$borderColor = props.borderColor,
56
- borderColor = _props$borderColor === void 0 ? '' : _props$borderColor,
57
- _props$borderWidth = props.borderWidth,
58
- borderWidth = _props$borderWidth === void 0 ? 0 : _props$borderWidth,
42
+ _props$playerStyle = props.playerStyle,
43
+ playerStyle = _props$playerStyle === void 0 ? {
44
+ borderRadius: 0,
45
+ bgColor: '#000000',
46
+ borderStyle: 'solid',
47
+ borderColor: '',
48
+ borderWidth: 0
49
+ } : _props$playerStyle,
59
50
  _props$privateState = props.privateState,
60
- privateState = _props$privateState === void 0 ? false : _props$privateState;
51
+ privateState = _props$privateState === void 0 ? false : _props$privateState,
52
+ _props$extend = props.extend,
53
+ extend = _props$extend === void 0 ? {} : _props$extend;
54
+ var borderRadius = playerStyle.borderRadius,
55
+ bgColor = playerStyle.bgColor,
56
+ borderStyle = playerStyle.borderStyle,
57
+ borderColor = playerStyle.borderColor,
58
+ borderWidth = playerStyle.borderWidth;
61
59
 
62
60
  var _useImmer = useImmer({
63
61
  connectState: false,
@@ -69,7 +67,7 @@ var Player = function (props) {
69
67
  errorMsg: '',
70
68
  // 异常信息
71
69
  updateLy: '',
72
- devlineState: true,
70
+ deviceOnlineState: true,
73
71
  initLy: false
74
72
  }),
75
73
  _useImmer2 = _slicedToArray(_useImmer, 2),
@@ -131,7 +129,7 @@ var Player = function (props) {
131
129
 
132
130
  useEffect(function () {
133
131
  setPlayState(function (d) {
134
- d.devlineState = onlineStatus;
132
+ d.deviceOnlineState = onlineStatus;
135
133
  });
136
134
 
137
135
  if (!onlineStatus) {
@@ -142,12 +140,7 @@ var Player = function (props) {
142
140
  } else if (playState.initLy) {
143
141
  retry();
144
142
  }
145
- }, [onlineStatus, playState.initLy]);
146
- useEffect(function () {
147
- if (!isOnPlayerPage) {
148
- disconnect();
149
- }
150
- }, [isOnPlayerPage]); // 重试
143
+ }, [onlineStatus, playState.initLy]); // 重试
151
144
 
152
145
  var _retry = /*#__PURE__*/function () {
153
146
  var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
@@ -159,6 +152,7 @@ var Player = function (props) {
159
152
  d.connectState = false;
160
153
  d.errorMsg = '';
161
154
  d.errorState = false;
155
+ d.loadingState = true;
162
156
  });
163
157
  _context2.t0 = playState.connectState;
164
158
 
@@ -395,7 +389,7 @@ var Player = function (props) {
395
389
 
396
390
  return /*#__PURE__*/React.createElement(View, {
397
391
  className: Styles.ipc_player
398
- }, isOnPlayerPage && /*#__PURE__*/React.createElement(IpcPlayer, {
392
+ }, /*#__PURE__*/React.createElement(IpcPlayer, _extends({
399
393
  className: Styles.player,
400
394
  onVideotap: function handlePlayerClick() {
401
395
  // console.log("videoTap:", devId);
@@ -439,8 +433,6 @@ var Player = function (props) {
439
433
  muted: defaultMute,
440
434
  objectFit: "fillCrop",
441
435
  clarity: clarity,
442
- soundMode: soundMode,
443
- orientation: orientation,
444
436
  rotateZ: rotateZ,
445
437
  scalable: scalable,
446
438
  scaleMultiple: scaleMultiple,
@@ -451,7 +443,7 @@ var Player = function (props) {
451
443
  borderWidth: borderWidth,
452
444
  updateLayout: playState.updateLy,
453
445
  backgroundColor: bgColor
454
- }), /*#__PURE__*/React.createElement(View, {
446
+ }, extend)), /*#__PURE__*/React.createElement(View, {
455
447
  style: {
456
448
  borderRadius: "".concat(borderRadius)
457
449
  },
@@ -460,7 +452,7 @@ var Player = function (props) {
460
452
  className: Styles.load_icon
461
453
  }), /*#__PURE__*/React.createElement(View, {
462
454
  className: Styles.load_des
463
- }, loadDes || locals.getLang('get_video_stream'))), /*#__PURE__*/React.createElement(CoverView, {
455
+ }, loadText || locals.getLang('get_video_stream'))), /*#__PURE__*/React.createElement(CoverView, {
464
456
  style: {
465
457
  borderRadius: "".concat(borderRadius)
466
458
  },
@@ -477,20 +469,15 @@ var Player = function (props) {
477
469
  textAlign: 'center'
478
470
  }
479
471
  }, /*#__PURE__*/React.createElement(View, {
480
- className: cx(Styles.iconfont, Styles.icon_tishi, !playState.devlineState && Styles.hide)
472
+ className: cx(Styles.iconfont, Styles.icon_tishi, !playState.deviceOnlineState && Styles.hide)
481
473
  }), /*#__PURE__*/React.createElement(View, {
482
474
  className: Styles.err_msg
483
475
  }, /*#__PURE__*/React.createElement(View, {
484
476
  className: cx(Styles.msg, Styles.ellipsis)
485
- }, playState.errorMsg), /*#__PURE__*/React.createElement(Text, {
486
- style: {
487
- color: '#fff'
488
- },
489
- className: !playState.devlineState && Styles.hide
490
- }, "\uFF0C"), /*#__PURE__*/React.createElement(View // @ts-ignore
477
+ }, playState.errorMsg), /*#__PURE__*/React.createElement(View // @ts-ignore
491
478
  , {
492
479
  onClick: retry,
493
- className: cx(Styles.retry, !playState.devlineState && Styles.hide)
480
+ className: cx(Styles.retry, !playState.deviceOnlineState && Styles.hide)
494
481
  }, locals.getLang('ipc_player_retry'))))));
495
482
  };
496
483
 
package/lib/index.wechat.js CHANGED
@@ -1,3 +1,4 @@
1
+ import _extends from "@babel/runtime/helpers/esm/extends";
1
2
  import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
2
3
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
3
4
  import "core-js/modules/es.object.to-string.js";
@@ -5,7 +6,7 @@ import "core-js/modules/es.promise.js";
5
6
  import _regeneratorRuntime from "@babel/runtime/regenerator";
6
7
  import React, { useEffect, useRef, useCallback } from 'react';
7
8
  import { useImmer } from 'use-immer';
8
- import { IpcPlayer, View, Text, CoverView } from '@ray-js/components';
9
+ import { IpcPlayer, View, CoverView } from '@ray-js/components';
9
10
  import cx from 'classnames';
10
11
  import { usePageEvent } from 'ray';
11
12
  import locals from './i18n';
@@ -18,8 +19,6 @@ var Player = function (props) {
18
19
  updateLayout = _props$updateLayout === void 0 ? '' : _props$updateLayout,
19
20
  _props$devId = props.devId,
20
21
  devId = _props$devId === void 0 ? '' : _props$devId,
21
- _props$devName = props.devName,
22
- devName = _props$devName === void 0 ? '' : _props$devName,
23
22
  onChangeStreamStatus = props.onChangeStreamStatus,
24
23
  onPlayerTap = props.onPlayerTap,
25
24
  onInitPreview = props.onInitPreview,
@@ -27,8 +26,8 @@ var Player = function (props) {
27
26
  defaultMute = _props$defaultMute === void 0 ? true : _props$defaultMute,
28
27
  _props$onlineStatus = props.onlineStatus,
29
28
  onlineStatus = _props$onlineStatus === void 0 ? true : _props$onlineStatus,
30
- _props$loadDes = props.loadDes,
31
- loadDes = _props$loadDes === void 0 ? '' : _props$loadDes,
29
+ _props$loadText = props.loadText,
30
+ loadText = _props$loadText === void 0 ? '' : _props$loadText,
32
31
  _props$rotateZ = props.rotateZ,
33
32
  rotateZ = _props$rotateZ === void 0 ? 0 : _props$rotateZ,
34
33
  _props$scalable = props.scalable,
@@ -37,27 +36,26 @@ var Player = function (props) {
37
36
  scaleMultiple = _props$scaleMultiple === void 0 ? 0 : _props$scaleMultiple,
38
37
  _props$ptzControllabl = props.ptzControllable,
39
38
  ptzControllable = _props$ptzControllabl === void 0 ? true : _props$ptzControllabl,
40
- _props$isOnPlayerPage = props.isOnPlayerPage,
41
- isOnPlayerPage = _props$isOnPlayerPage === void 0 ? true : _props$isOnPlayerPage,
42
39
  _props$clarity = props.clarity,
43
40
  clarity = _props$clarity === void 0 ? 'normal' : _props$clarity,
44
- _props$soundMode = props.soundMode,
45
- soundMode = _props$soundMode === void 0 ? 'speaker' : _props$soundMode,
46
- _props$orientation = props.orientation,
47
- orientation = _props$orientation === void 0 ? 'vertical' : _props$orientation,
48
41
  onCtx = props.onCtx,
49
- _props$borderRadius = props.borderRadius,
50
- borderRadius = _props$borderRadius === void 0 ? 0 : _props$borderRadius,
51
- _props$bgColor = props.bgColor,
52
- bgColor = _props$bgColor === void 0 ? '#000000' : _props$bgColor,
53
- _props$borderStyle = props.borderStyle,
54
- borderStyle = _props$borderStyle === void 0 ? 'solid' : _props$borderStyle,
55
- _props$borderColor = props.borderColor,
56
- borderColor = _props$borderColor === void 0 ? '' : _props$borderColor,
57
- _props$borderWidth = props.borderWidth,
58
- borderWidth = _props$borderWidth === void 0 ? 0 : _props$borderWidth,
42
+ _props$playerStyle = props.playerStyle,
43
+ playerStyle = _props$playerStyle === void 0 ? {
44
+ borderRadius: 0,
45
+ bgColor: '#000000',
46
+ borderStyle: 'solid',
47
+ borderColor: '',
48
+ borderWidth: 0
49
+ } : _props$playerStyle,
59
50
  _props$privateState = props.privateState,
60
- privateState = _props$privateState === void 0 ? false : _props$privateState;
51
+ privateState = _props$privateState === void 0 ? false : _props$privateState,
52
+ _props$extend = props.extend,
53
+ extend = _props$extend === void 0 ? {} : _props$extend;
54
+ var borderRadius = playerStyle.borderRadius,
55
+ bgColor = playerStyle.bgColor,
56
+ borderStyle = playerStyle.borderStyle,
57
+ borderColor = playerStyle.borderColor,
58
+ borderWidth = playerStyle.borderWidth;
61
59
 
62
60
  var _useImmer = useImmer({
63
61
  connectState: false,
@@ -69,7 +67,7 @@ var Player = function (props) {
69
67
  errorMsg: '',
70
68
  // 异常信息
71
69
  updateLy: '',
72
- devlineState: true,
70
+ deviceOnlineState: true,
73
71
  initLy: false
74
72
  }),
75
73
  _useImmer2 = _slicedToArray(_useImmer, 2),
@@ -131,7 +129,7 @@ var Player = function (props) {
131
129
 
132
130
  useEffect(function () {
133
131
  setPlayState(function (d) {
134
- d.devlineState = onlineStatus;
132
+ d.deviceOnlineState = onlineStatus;
135
133
  });
136
134
 
137
135
  if (!onlineStatus) {
@@ -142,12 +140,7 @@ var Player = function (props) {
142
140
  } else if (playState.initLy) {
143
141
  retry();
144
142
  }
145
- }, [onlineStatus, playState.initLy]);
146
- useEffect(function () {
147
- if (!isOnPlayerPage) {
148
- disconnect();
149
- }
150
- }, [isOnPlayerPage]); // 重试
143
+ }, [onlineStatus, playState.initLy]); // 重试
151
144
 
152
145
  var _retry = /*#__PURE__*/function () {
153
146
  var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
@@ -159,6 +152,7 @@ var Player = function (props) {
159
152
  d.connectState = false;
160
153
  d.errorMsg = '';
161
154
  d.errorState = false;
155
+ d.loadingState = true;
162
156
  });
163
157
  _context2.t0 = playState.connectState;
164
158
 
@@ -395,7 +389,7 @@ var Player = function (props) {
395
389
 
396
390
  return /*#__PURE__*/React.createElement(View, {
397
391
  className: Styles.ipc_player
398
- }, isOnPlayerPage && /*#__PURE__*/React.createElement(IpcPlayer, {
392
+ }, /*#__PURE__*/React.createElement(IpcPlayer, _extends({
399
393
  className: Styles.player,
400
394
  onVideotap: function handlePlayerClick() {
401
395
  // console.log("videoTap:", devId);
@@ -439,8 +433,6 @@ var Player = function (props) {
439
433
  muted: defaultMute,
440
434
  objectFit: "fillCrop",
441
435
  clarity: clarity,
442
- soundMode: soundMode,
443
- orientation: orientation,
444
436
  rotateZ: rotateZ,
445
437
  scalable: scalable,
446
438
  scaleMultiple: scaleMultiple,
@@ -451,7 +443,7 @@ var Player = function (props) {
451
443
  borderWidth: borderWidth,
452
444
  updateLayout: playState.updateLy,
453
445
  backgroundColor: bgColor
454
- }), /*#__PURE__*/React.createElement(View, {
446
+ }, extend)), /*#__PURE__*/React.createElement(View, {
455
447
  style: {
456
448
  borderRadius: "".concat(borderRadius)
457
449
  },
@@ -460,7 +452,7 @@ var Player = function (props) {
460
452
  className: Styles.load_icon
461
453
  }), /*#__PURE__*/React.createElement(View, {
462
454
  className: Styles.load_des
463
- }, loadDes || locals.getLang('get_video_stream'))), /*#__PURE__*/React.createElement(CoverView, {
455
+ }, loadText || locals.getLang('get_video_stream'))), /*#__PURE__*/React.createElement(CoverView, {
464
456
  style: {
465
457
  borderRadius: "".concat(borderRadius)
466
458
  },
@@ -477,20 +469,15 @@ var Player = function (props) {
477
469
  textAlign: 'center'
478
470
  }
479
471
  }, /*#__PURE__*/React.createElement(View, {
480
- className: cx(Styles.iconfont, Styles.icon_tishi, !playState.devlineState && Styles.hide)
472
+ className: cx(Styles.iconfont, Styles.icon_tishi, !playState.deviceOnlineState && Styles.hide)
481
473
  }), /*#__PURE__*/React.createElement(View, {
482
474
  className: Styles.err_msg
483
475
  }, /*#__PURE__*/React.createElement(View, {
484
476
  className: cx(Styles.msg, Styles.ellipsis)
485
- }, playState.errorMsg), /*#__PURE__*/React.createElement(Text, {
486
- style: {
487
- color: '#fff'
488
- },
489
- className: !playState.devlineState && Styles.hide
490
- }, "\uFF0C"), /*#__PURE__*/React.createElement(View // @ts-ignore
477
+ }, playState.errorMsg), /*#__PURE__*/React.createElement(View // @ts-ignore
491
478
  , {
492
479
  onClick: retry,
493
- className: cx(Styles.retry, !playState.devlineState && Styles.hide)
480
+ className: cx(Styles.retry, !playState.deviceOnlineState && Styles.hide)
494
481
  }, locals.getLang('ipc_player_retry'))))));
495
482
  };
496
483
 
package/lib/typings/index.d.ts CHANGED
@@ -6,12 +6,6 @@ declare module '*.module.less' {
6
6
  declare module '*.less';
7
7
  }
8
8
  export type IProps = {
9
- /**
10
- * @description.en updateLayout
11
- * @description.zh 主动触发视图更新
12
- * @default ""
13
- */
14
- updateLayout?: any;
15
9
  /**
16
10
  * @description.en devId
17
11
  * @description.zh 设备id
@@ -19,23 +13,35 @@ export type IProps = {
19
13
  */
20
14
  devId: string;
21
15
  /**
22
- * @description.en devName
23
- * @description.zh 设备名称
24
- * @default ""
16
+ * @description.en onlineStatus
17
+ * @description.zh 设备是否在线
18
+ * @default true
19
+ */
20
+ onlineStatus: boolean;
21
+ /**
22
+ * @description.en privateState
23
+ * @description.zh 隐私模式
24
+ * @default false
25
25
  */
26
- devName?: string;
26
+ privateState?: boolean;
27
27
  /**
28
- * @description.en onInitPreview
29
- * @description.zh 初始化预览成功通知
30
- * @default (data) => void
28
+ * @description.en defaultMute
29
+ * @description.zh 默认静音
30
+ * @default true
31
31
  */
32
- onInitPreview?: (data) => void;
32
+ defaultMute?: boolean;
33
33
  /**
34
- * @description.en onPlayerTap
35
- * @description.zh videoTap点击事件
36
- * @default (data) => void
34
+ * @description.en clarity
35
+ * @description.zh 清晰度 normal：标清，hd：高清
36
+ * @default "normal"
37
+ */
38
+ clarity?: 'normal' | 'hd';
39
+ /**
40
+ * @description.en updateLayout
41
+ * @description.zh 外层父节点样式变化，播放器监听不到，需要主动触发播放器视图更新，每次需要设置不同的字符串值
42
+ * @default ""
37
43
  */
38
- onPlayerTap?: (data) => void;
44
+ updateLayout?: any;
39
45
  /**
40
46
  * @description.en onChangeStreamStatus
41
47
  * @description.zh 通知视频流状态发生变化
@@ -43,23 +49,23 @@ export type IProps = {
43
49
  */
44
50
  onChangeStreamStatus?: (data) => void;
45
51
  /**
46
- * @description.en onlineStatus
47
- * @description.zh 设备默认在离线状态,true:在线、false:离线
48
- * @default true
49
- */
50
- onlineStatus?: boolean;
52
+ * @description.en onCtx
53
+ * @description.zh 获取ipcPlayer实例ctx以及重试方法retry
54
+ * @default (playerRef) => void
55
+ */
56
+ onCtx?: (playerRef) => void;
51
57
  /**
52
- * @description.en loadDes
53
- * @description.zh 加载文案
54
- * @default "正在获取视频流..."
58
+ * @description.en onInitPreview
59
+ * @description.zh 初始化预览成功通知
60
+ * @default (devId) => void
55
61
  */
56
- loadDes?: string;
62
+ onInitPreview?: (data) => void;
57
63
  /**
58
- * @description.en rotateZ
59
- * @description.zh 摄像头旋转角度
60
- * @default 0
64
+ * @description.en onPlayerTap
65
+ * @description.zh 播放器区域点击事件
66
+ * @default (devId) => void
61
67
  */
62
- rotateZ?: number;
68
+ onPlayerTap?: (data) => void;
63
69
  /**
64
70
  * @description.en scalable
65
71
  * @description.zh 是否可缩放
@@ -67,11 +73,17 @@ export type IProps = {
67
73
  */
68
74
  scalable?: boolean;
69
75
  /**
70
- * @description.en scaleMultiple
71
- * @description.zh 缩放比例
76
+ * @description.en scaleMultiple
77
+ * @description.zh 缩放比例
78
+ * @default 0
79
+ */
80
+ scaleMultiple?: number;
81
+ /**
82
+ * @description.en rotateZ
83
+ * @description.zh 摄像头旋转角度
72
84
  * @default 0
73
85
  */
74
- scaleMultiple?: number;
86
+ rotateZ?: number;
75
87
  /**
76
88
  * @description.en ptzControllable
77
89
  * @description.zh 是否开启视频区云平台控制
@@ -79,75 +91,27 @@ export type IProps = {
79
91
  */
80
92
  ptzControllable?: boolean;
81
93
  /**
82
- * @description.en isOnPlayerPage
83
- * @description.zh 当前是否在预览页
84
- * @default true
85
- */
86
- isOnPlayerPage?: boolean;
87
- /**
88
- * @description.en onCtx
89
- * @description.zh 获取ipcPlayer实例ctx以及重试方法retry
90
- * @default (playerRef) => void
94
+ * @description.en playerStyle
95
+ * @description.zh 播放器样式
96
+ * @default {}
91
97
  */
92
- onCtx?: (playerRef) => void;
93
- /**
94
- * @description.en defaultMute
95
- * @description.zh 是否静音
96
- * @default true
97
- */
98
- defaultMute?: boolean;
99
- /**
100
- * @description.en clarity
101
- * @description.zh 清晰度 normal：标清，hd：高清
102
- * @default "normal"
103
- */
104
- clarity?: 'normal' | 'hd';
105
- /**
106
- * @description.en soundMode
107
- * @description.zh 声音输出方式 speaker：扬声器，ear：听筒
108
- * @default "speaker"
109
- */
110
- soundMode?: 'speaker' | 'ear';
111
- /**
112
- * @description.en orientation
113
- * @description.zh 画面方向 vertical：竖直，horizontal：水平
114
- * @default "vertical"
115
- */
116
- orientation?: 'vertical' | 'horizontal';
117
- /**
118
- * @description.en borderRadius
119
- * @description.zh player边框圆角
120
- * @default 0
121
- */
122
- borderRadius?: number | string;
123
- /**
124
- * @description.en bgColor
125
- * @description.zh 背景底色
126
- * @default "#000000"
127
- */
128
- bgColor?: string;
129
- /**
130
- * @description.en borderStyle
131
- * @description.zh 边框样式
132
- * @default "solid"
133
- */
134
- borderStyle?: 'solid' | 'dashed';
135
- /**
136
- * @description.en borderColor
137
- * @description.zh 边框颜色
138
- * @default ""
139
- */
140
- borderColor?: string;
98
+ playerStyle?: {
99
+ bgColor?: string; // 背景底色
100
+ borderRadius?: number | string; // 边框圆角
101
+ borderStyle?: 'solid' | 'dashed'; // 边框样式
102
+ borderColor?: string; // 边框颜色
103
+ borderWidth?: string | number; // 边框宽度
104
+ };
141
105
  /**
142
- * @description.en borderWidth
143
- * @description.zh 边框宽度
144
- * @default ""
106
+ * @description.en loadText
107
+ * @description.zh 加载过程中的文案，可结合onChangeStreamStatus事件做文案配置
108
+ * @default "正在获取视频流..."
145
109
  */
146
- borderWidth?: string | number;
110
+ loadText?: string;
147
111
  /**
148
- * @description.en privateState
149
- * @description.zh 隐私模式
150
- * @default false
112
+ * @description.en extend
113
+ * @description.zh 扩展属性
114
+ * @default {}
151
115
  */
152
- privateState?: boolean;
116
+ extend?: Record<string, any>;
153
117
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ray-js/ray-ipc-player",
3
- "version": "0.0.13-beta-1",
3
+ "version": "0.0.14-beta-1",
4
4
  "description": "ray小程序播放器",
5
5
  "keywords": [
6
6
  "tuya-panel",