@cloud-app-dev/vidc 3.0.12 → 3.0.13

package/.prettierrc

@@ -1,7 +1,7 @@
 {
   "singleQuote": true,
   "trailingComma": "all",
-  "printWidth": 150,
+  "printWidth": 160,
   "overrides": [
     {
       "files": ".prettierrc",

package/es/Player/frontend_player.js

@@ -60,6 +60,7 @@ function FrontendPlayer(_a) {
     reload: reload,
     onCanPlayerInit: onInit,
     isLive: false,
+    type: "flv",
     customTimeLine: hasReady ? timeline : /*#__PURE__*/React.createElement(React.Fragment, null)
   }, props));
 }

package/es/ScreenPlayer/Live.d.ts

@@ -1,5 +1,10 @@
 /// <reference types="react" />
 import type { ILivePlayerProps } from './interface';
 import './index.less';
-declare function LivePlayer({ list, children, onIndexChange, onClose, onCloseAll, snapshot, defaultScreen, screenChange, defaultSelectIndex, }: ILivePlayerProps): JSX.Element;
+declare function LivePlayer({ list, children, onIndexChange, onClose, onCloseAll, snapshot, defaultScreen, screenChange, defaultSelectIndex }: ILivePlayerProps): JSX.Element;
+declare namespace LivePlayer {
+    var defaultProps: {
+        list: any[];
+    };
+}
 export default LivePlayer;

package/es/ScreenPlayer/Live.js

@@ -28,8 +28,7 @@ import useVideoFit from './useVideoFit';
 import "./index.css";
 
 function LivePlayer(_ref) {
-  var _ref$list = _ref.list,
-      list = _ref$list === void 0 ? [] : _ref$list,
+  var list = _ref.list,
       children = _ref.children,
       onIndexChange = _ref.onIndexChange,
       onClose = _ref.onClose,
@@ -177,4 +176,7 @@ function LivePlayer(_ref) {
   }));
 }
 
+LivePlayer.defaultProps = {
+  list: []
+};
 export default LivePlayer;

package/es/ScreenPlayer/LiveTools.d.ts

@@ -17,5 +17,5 @@ interface IToolsProps {
     disabled: boolean;
     snapshot?: (base64?: string) => void;
 }
-declare function LiveTools({ containerRef, updateState, screenNum, getPlayerItem, mode, toggleFit, fit, onClose, onCloseAll, disabled, snapshot, }: IToolsProps): JSX.Element;
+declare function LiveTools({ containerRef, updateState, screenNum, getPlayerItem, mode, toggleFit, fit, onClose, onCloseAll, disabled, snapshot }: IToolsProps): JSX.Element;
 export default LiveTools;

package/es/ScreenPlayer/useTimeSlider.js

@@ -16,7 +16,7 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 import moment from 'moment';
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { useEffect, useMemo, useRef, useState } from 'react';
 var hours = [1, 6, 12, 24];
 var currentColor = '#FF000A';
 var normalLineColor = '#ffffff';
@@ -133,10 +133,15 @@ function useTimeSlider(canvasRef, _ref2) {
     });
   };
 
-  var clearCanvas = useCallback(function () {
+  var clearCanvas = function clearCanvas() {
     return ctx.clearRect(0, 0, width, height);
-  }, [ctx, width, height]);
-  var drawOverlay = useCallback(function () {
+  };
+  /**
+   * 绘制覆盖时间刻度颜色，表示有录像的部分
+   */
+
+
+  var drawOverlay = function drawOverlay() {
     segments.forEach(function (item) {
       var _a;
 
@@ -147,12 +152,13 @@ function useTimeSlider(canvasRef, _ref2) {
       ctx.fillStyle = item.url ? ((_a = item.style) === null || _a === void 0 ? void 0 : _a.background) || hoverLineColor : '#242C3D';
       ctx.fillRect(beginX, height - 10, scale_width + 1, height);
     });
-  }, [ctx, segments, height, width, state.begin, state.hoursPer]);
+  };
   /**
    * 绘制刻度相关的
    */
 
-  var drawScale = useCallback(function () {
+
+  var drawScale = function drawScale() {
     var px_per_min = width / (state.hoursPer * 60); // px/min
 
     var px_per_ms = width / (state.hoursPer * 60 * 60 * 1000); // px/ms
@@ -226,13 +232,14 @@ function useTimeSlider(canvasRef, _ref2) {
 
       drawLine(ctx, graduation_left, height - lineH, graduation_left, height, normalLineColor, 2);
     }
-  }, [ctx, height, width, state.begin, state.hoursPer]);
+  };
   /**
    * 绘制当前刻度
    * @returns
    */
 
-  var drawCurrentLine = useCallback(function () {
+
+  var drawCurrentLine = function drawCurrentLine() {
     var currentTime = state.currentTime,
         begin = state.begin,
         hoursPer = state.hoursPer;
@@ -255,13 +262,13 @@ function useTimeSlider(canvasRef, _ref2) {
       text: formartTimestemp(time)
     });
     drawLine(ctx, left, 20, left, height, currentColor, 2); //中间当前点线
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [ctx, height, width, state.currentTime, state.begin, state.hoursPer]);
+  };
   /**
    * 绘制提示时间
    */
 
-  var drawHoverLine = useCallback(function () {
+
+  var drawHoverLine = function drawHoverLine() {
     drawText(ctx, {
       fillStyle: hoverLineColor,
       font: '12px Arial',
@@ -270,12 +277,13 @@ function useTimeSlider(canvasRef, _ref2) {
       text: formartTimestemp(state.hover.time)
     });
     drawLine(ctx, state.hover.x, 20, state.hover.x, height, hoverLineColor, 1);
-  }, [ctx, height, state.hover.time, state.hover.x]);
+  };
   /**
    * 获取鼠标posx
    * @param {*} e
    */
 
+
   var get_cursor_x_position = function get_cursor_x_position(e) {
     var posx = 0;
 
@@ -313,8 +321,9 @@ function useTimeSlider(canvasRef, _ref2) {
       drawScale();
       drawCurrentLine();
       state.hover.time && drawHoverLine();
-    }
-  }, [canvas, state.begin, state.currentTime, state.hoursPer, segments, state.hover, clearCanvas, drawOverlay, drawScale, drawCurrentLine, drawHoverLine]);
+    } // eslint-disable-next-line react-hooks/exhaustive-deps
+
+  }, [canvas, state.begin, state.currentTime, state.hoursPer, segments, state.hover]);
 
   _useUpdateEffect(function () {
     return update({
@@ -333,6 +342,10 @@ function useTimeSlider(canvasRef, _ref2) {
       currentTime: currentTime
     });
   }, [currentTime]);
+  /**
+   * 触发绘制范围单位（hour）
+   */
+
 
   _useEventListener('mousewheel', function (event) {
     event.preventDefault();
@@ -358,7 +371,7 @@ function useTimeSlider(canvasRef, _ref2) {
       }
     }
 
-    var new_begin = middle_time - state.hoursPer * 3600 * 1000 / 2; //start_timestamp = 当前中间的时间 - zoom/2
+    var new_begin = middle_time - state.hoursPer * 3600 * 1000 / 2; //new_begin = 当前中间的时间 - hoursPer/2
 
     setState(function (old) {
       return Object.assign(Object.assign({}, old), {
@@ -373,6 +386,10 @@ function useTimeSlider(canvasRef, _ref2) {
   }, {
     target: canvasRef
   });
+  /**
+   * 用于处理canvas移除hover效果
+   */
+
 
   _useEventListener('mouseout', function () {
     return setState(function (old) {
@@ -386,6 +403,10 @@ function useTimeSlider(canvasRef, _ref2) {
   }, {
     target: canvasRef
   });
+  /**
+   * hover效果绘制
+   */
+
 
   _useEventListener('mousemove', function (e) {
     if (extRef.current.mousedownTime) {
@@ -415,6 +436,10 @@ function useTimeSlider(canvasRef, _ref2) {
   }, {
     target: canvasRef
   });
+  /**
+   * 标记点击、拖动的触发器
+   */
+
 
   _useEventListener('mousedown', function (e) {
     extRef.current.mousedownTime = Date.now();
@@ -422,9 +447,14 @@ function useTimeSlider(canvasRef, _ref2) {
   }, {
     target: canvasRef
   });
+  /**
+   * 处理点击、结束拖动的处理
+   */
+
 
   _useEventListener('mouseup', function (e) {
     if (!extRef.current.mousedownTime) {
+      // 未在canvas上触发mousedown 过滤
       return;
     }
 
@@ -461,6 +491,10 @@ function useTimeSlider(canvasRef, _ref2) {
   }, {
     target: document
   });
+  /**
+   * 拖动处理
+   */
+
 
   _useEventListener('mousemove', function (e) {
     if (!extRef.current.mousedownTime) {

package/package.json

@@ -2,7 +2,7 @@
   "private": false,
   "name": "@cloud-app-dev/vidc",
   "description": "Video Image Data Componennts",
-  "version": "3.0.12",
+  "version": "3.0.13",
   "scripts": {
     "start": "dumi dev",
     "docs:build": "dumi build",