@cloud-app-dev/vidc 3.0.35 → 3.0.37

package/.umirc.ts

@@ -2,7 +2,7 @@ import { defineConfig } from 'dumi';
 import path from 'path';
 
 const token =
-  'eyJhbGciOiJIUzI1NiJ9.eyJvcmdhbml6YXRpb25JZCI6IjEwMDEwMTAwMDQ0NSIsImV4dCI6MTY2MzkyNzM5NjQzMCwidWlkIjoiMTAxMDAwMDAwNjk5IiwidmFsaWRTdGF0ZSI6MTA0NDA2LCJyb2xlSWQiOlsxMDAwMDAxMTA1MTgsMTAwMDAwMTEwNzI4XSwidmFsaWRUaW1lIjoxNzA0MzgzOTk5MDAwLCJvcHRDZW50ZXJJZCI6IjEwMDEwMDAwMDIzMyIsInVzZXJUeXBlIjoxMDA3MDQsImlhdCI6MTY2MzY2ODE5NjQzMH0.bJbtN-QjTUGGSIJRfR1ycjhtGt6UCEsrS29CYN-AAfw';
+  'eyJhbGciOiJIUzI1NiJ9.eyJvcmdhbml6YXRpb25JZCI6IjEwMDEwMTAwMDQ0NSIsImV4dCI6MTY2NTc0ODU1OTg5MSwidWlkIjoiMTAxMDAwMDAwNjk5IiwidmFsaWRTdGF0ZSI6MTA0NDA2LCJyb2xlSWQiOlsxMDAwMDAxMTA1MTgsMTAwMDAwMTEwNzI4XSwidmFsaWRUaW1lIjoxNzA0MzgzOTk5MDAwLCJvcHRDZW50ZXJJZCI6IjEwMDEwMDAwMDIzMyIsInVzZXJUeXBlIjoxMDA3MDQsImlhdCI6MTY2NTQ4OTM1OTg5MX0.zxxxxoaKjyO6CJhi2cs06gTOtjdLgPA9UI7zAQ0zzss';
 
 export default defineConfig({
   title: 'CloudApp VIDC',

package/es/Player/single_player.js

@@ -280,7 +280,7 @@ SinglePlayer.defaultProps = {
   hlsConfig: {},
   extActions: {},
   oneFpsPlay: false,
-  fpsDelay: 100,
+  fpsDelay: 500,
   fps: 30
 };
 export default SinglePlayer;

package/es/ScreenPlayer/Live.js

@@ -26,6 +26,7 @@ import { ScreenType, mergeFill } from './utils';
 import { LivePlayerWithExt } from './PlayerWithExt';
 import Tools from './LiveTools';
 import useVideoFit from './useVideoFit';
+import DisableMark from '../DisableMark';
 import "./index.css";
 
 function LivePlayer(_a) {
@@ -174,11 +175,13 @@ function LivePlayer(_a) {
         height: screenType.height
       }
     }));
-  })), /*#__PURE__*/React.createElement(Tools, {
+  })), /*#__PURE__*/React.createElement(DisableMark, {
+    disabled: !segmentItem.url,
+    width: "70%"
+  }, /*#__PURE__*/React.createElement(Tools, {
     onClose: onClose,
     onCloseAll: onCloseAll,
     fit: fit,
-    disabled: !segmentItem.url,
     toggleFit: toggleFit,
     getPlayerItem: getPlayerItem,
     screenNum: screenNum,
@@ -190,7 +193,7 @@ function LivePlayer(_a) {
     allWinExtTools: allWinExtTools
   }), children && /*#__PURE__*/React.cloneElement(children, {
     selectIndex: state.selectIndex
-  }));
+  })));
 }
 
 LivePlayer.defaultProps = {

package/es/ScreenPlayer/LiveTools.d.ts

@@ -14,7 +14,6 @@ interface IToolsProps {
     toggleFit?: () => void;
     onClose?: () => void;
     onCloseAll?: () => void;
-    disabled: boolean;
     snapshot?: (base64?: string) => void;
     /**
      * 单窗口拓展工具条,左侧
@@ -25,5 +24,5 @@ interface IToolsProps {
      */
     allWinExtTools?: JSX.Element;
 }
-declare function LiveTools({ containerRef, oneWinExtTools, allWinExtTools, updateState, screenNum, getPlayerItem, mode, toggleFit, fit, onClose, onCloseAll, disabled, snapshot, }: IToolsProps): JSX.Element;
+declare function LiveTools({ containerRef, oneWinExtTools, allWinExtTools, updateState, screenNum, getPlayerItem, mode, toggleFit, fit, onClose, onCloseAll, snapshot, }: IToolsProps): JSX.Element;
 export default LiveTools;

package/es/ScreenPlayer/LiveTools.js

@@ -16,7 +16,6 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import React from 'react';
 import IconFont from '../Player/iconfont';
 import ScreenSelect from './ScreenSelect';
-import DisableMark from '../DisableMark';
 import useFullscreen from '../useFullscreen';
 import Volume from '../Player/contraller_bar/volume';
 
@@ -32,7 +31,6 @@ function LiveTools(_ref) {
       fit = _ref.fit,
       onClose = _ref.onClose,
       onCloseAll = _ref.onCloseAll,
-      disabled = _ref.disabled,
       snapshot = _ref.snapshot;
 
   var _useFullscreen = useFullscreen(containerRef),
@@ -73,9 +71,6 @@ function LiveTools(_ref) {
 
   return /*#__PURE__*/React.createElement("div", {
     className: "player-tools"
-  }, /*#__PURE__*/React.createElement(DisableMark, {
-    disabled: disabled,
-    width: "70%"
   }, /*#__PURE__*/React.createElement("div", {
     className: "player-tools-left"
   }, /*#__PURE__*/React.createElement("span", {
@@ -160,7 +155,7 @@ function LiveTools(_ref) {
   }) : /*#__PURE__*/React.createElement(IconFont, {
     type: "lm-player-quanping",
     title: "\u5168\u5C4F"
-  })))));
+  }))));
 }
 
 export default LiveTools;

package/es/ScreenPlayer/PlayerWithExt.d.ts

@@ -12,8 +12,10 @@ export declare function LivePlayerWithExt({ mode, url, type, style, className, u
 interface ISegmentPlayerWithExtProps extends Omit<ILivePlayerWithExtProps, 'url'> {
     segments?: ISegmentType[];
     begin?: number;
+    fpsDelay?: number;
+    fps?: number;
 }
-export declare function SegmentPlayerWithExt({ begin, style, className, segments, updatePlayer, onClick, mode, ...props }: ISegmentPlayerWithExtProps): JSX.Element;
+export declare function SegmentPlayerWithExt({ begin, style, className, segments, updatePlayer, onClick, mode, fpsDelay, fps, ...props }: ISegmentPlayerWithExtProps): JSX.Element;
 interface IFrontendPlayerWithExtProps extends Omit<ILivePlayerWithExtProps, 'url'> {
     segments?: ISegmentType[];
     begin?: number;

package/es/ScreenPlayer/PlayerWithExt.js

@@ -74,7 +74,9 @@ export function SegmentPlayerWithExt(_a) {
       updatePlayer = _a.updatePlayer,
       onClick = _a.onClick,
       mode = _a.mode,
-      props = __rest(_a, ["begin", "style", "className", "segments", "updatePlayer", "onClick", "mode"]);
+      fpsDelay = _a.fpsDelay,
+      fps = _a.fps,
+      props = __rest(_a, ["begin", "style", "className", "segments", "updatePlayer", "onClick", "mode", "fpsDelay", "fps"]);
 
   var forceUpdate = _useUpdate();
 
@@ -104,6 +106,8 @@ export function SegmentPlayerWithExt(_a) {
     forwordRef: ref,
     begin: begin,
     onCanPlayerInit: update,
+    fps: fps,
+    fpsDelay: fpsDelay,
     customTimeLine: /*#__PURE__*/React.createElement(React.Fragment, null)
   }))));
 }

package/es/ScreenPlayer/Record.d.ts

@@ -6,5 +6,5 @@ import './index.less';
  * @param param0
  * @returns
  */
-declare function RecordPlayer({ list, children, queryRecord, onIndexChange, onClose, onCloseAll, download, snapshot, defaultScreen, screenChange, defaultSelectIndex, oneWinExtTools, allWinExtTools, ...options }: IRecordPlayerProps): JSX.Element;
+declare function RecordPlayer({ list, children, queryRecord, onIndexChange, onClose, onCloseAll, download, snapshot, defaultScreen, screenChange, defaultSelectIndex, oneWinExtTools, allWinExtTools, fpsDelay, fps, ...options }: IRecordPlayerProps): JSX.Element;
 export default RecordPlayer;

package/es/ScreenPlayer/Record.js

@@ -39,6 +39,7 @@ import useRecordList from './useRecordList';
 import useVideoFit from './useVideoFit';
 import DisableMark from '../DisableMark';
 import "./index.css";
+import { cloneDeep } from 'lodash-es';
 var defaultState = {
   screenNum: 4,
   selectIndex: 0,
@@ -71,9 +72,11 @@ function RecordPlayer(_a) {
       defaultSelectIndex = _a.defaultSelectIndex,
       oneWinExtTools = _a.oneWinExtTools,
       allWinExtTools = _a.allWinExtTools,
-      options = __rest(_a, ["list", "children", "queryRecord", "onIndexChange", "onClose", "onCloseAll", "download", "snapshot", "defaultScreen", "screenChange", "defaultSelectIndex", "oneWinExtTools", "allWinExtTools"]);
+      fpsDelay = _a.fpsDelay,
+      fps = _a.fps,
+      options = __rest(_a, ["list", "children", "queryRecord", "onIndexChange", "onClose", "onCloseAll", "download", "snapshot", "defaultScreen", "screenChange", "defaultSelectIndex", "oneWinExtTools", "allWinExtTools", "fpsDelay", "fps"]);
 
-  var _useState = useState(Object.assign(Object.assign({}, defaultState), {
+  var _useState = useState(Object.assign(Object.assign({}, cloneDeep(defaultState)), {
     screenNum: defaultScreen !== null && defaultScreen !== void 0 ? defaultScreen : defaultState.screenNum
   })),
       _useState2 = _slicedToArray(_useState, 2),
@@ -129,10 +132,8 @@ function RecordPlayer(_a) {
     return recordList[state.selectIndex] || {};
   }, [state.selectIndex, recordList]);
   var timeBegin = useMemo(function () {
-    var _a;
-
-    return (_a = state.currentTimes[state.selectIndex]) !== null && _a !== void 0 ? _a : segmentItem.date;
-  }, [segmentItem.date, state.currentTimes, state.selectIndex]);
+    return segmentItem.date;
+  }, [segmentItem.date]);
   /**
    * @desc 用户缓存接收list的变化。
    */
@@ -403,7 +404,9 @@ function RecordPlayer(_a) {
         width: screenType.width,
         height: screenType.height
       },
-      mode: (_d = item.mode) !== null && _d !== void 0 ? _d : state.modes[index]
+      mode: (_d = item.mode) !== null && _d !== void 0 ? _d : state.modes[index],
+      fps: fps,
+      fpsDelay: fpsDelay
     })) : /*#__PURE__*/React.createElement(FrontendPlayerWithExt, Object.assign({}, item, {
       className: state.selectIndex === index ? 'player-current-index' : '',
       segments: ((_e = recordList[index]) === null || _e === void 0 ? void 0 : _e.segments) || [],

package/es/ScreenPlayer/SegmentTimeLine.js

@@ -24,7 +24,7 @@ function SegmentTimeLine(_ref) {
     }).valueOf();
   }, [begin]);
   useTimeSlider(ref, {
-    begin: time - timeMode / 2 * 3600 * 1000,
+    begin: time,
     currentTime: time,
     onTimeChange: run,
     segments: segments,

package/es/ScreenPlayer/demo2.js

@@ -28,7 +28,7 @@ import RecordPlayer from './Record';
 import moment from 'moment';
 import Service from '../Service';
 import { completionSegments } from './utils';
-var token = "eyJhbGciOiJIUzI1NiJ9.eyJvcmdhbml6YXRpb25JZCI6IjEwMDEwMTAwMDQ0NSIsImV4dCI6MTY2MzkyNzM5NjQzMCwidWlkIjoiMTAxMDAwMDAwNjk5IiwidmFsaWRTdGF0ZSI6MTA0NDA2LCJyb2xlSWQiOlsxMDAwMDAxMTA1MTgsMTAwMDAwMTEwNzI4XSwidmFsaWRUaW1lIjoxNzA0MzgzOTk5MDAwLCJvcHRDZW50ZXJJZCI6IjEwMDEwMDAwMDIzMyIsInVzZXJUeXBlIjoxMDA3MDQsImlhdCI6MTY2MzY2ODE5NjQzMH0.bJbtN-QjTUGGSIJRfR1ycjhtGt6UCEsrS29CYN-AAfw";
+var token = "eyJhbGciOiJIUzI1NiJ9.eyJvcmdhbml6YXRpb25JZCI6IjEwMDEwMTAwMDQ0NSIsImV4dCI6MTY2NTc0ODU1OTg5MSwidWlkIjoiMTAxMDAwMDAwNjk5IiwidmFsaWRTdGF0ZSI6MTA0NDA2LCJyb2xlSWQiOlsxMDAwMDAxMTA1MTgsMTAwMDAwMTEwNzI4XSwidmFsaWRUaW1lIjoxNzA0MzgzOTk5MDAwLCJvcHRDZW50ZXJJZCI6IjEwMDEwMDAwMDIzMyIsInVzZXJUeXBlIjoxMDA3MDQsImlhdCI6MTY2NTQ4OTM1OTg5MX0.zxxxxoaKjyO6CJhi2cs06gTOtjdLgPA9UI7zAQ0zzss";
 var cids = ['538509097', '539172446'];
 
 var query = function query(_ref) {

package/es/ScreenPlayer/interface.d.ts

@@ -77,6 +77,9 @@ export interface IRecordPlayerProps {
    * 全局窗口工具条，右侧
    */
   allWinExtTools?: JSX.Element;
+
+  fpsDelay?: number;
+  fps?: number;
 }
 
 export interface IRecordPlayerState {

package/es/ScreenPlayer/useTimeSlider.js

@@ -17,8 +17,8 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 import moment from 'moment';
 import { useEffect, useMemo, useRef, useState } from 'react';
-var hours = [1, 6, 12, 24];
-var currentColor = '#FF000A';
+var hours = [1, 6, 12, 24]; // const currentColor = '#FF000A';
+
 var normalLineColor = '#ffffff';
 var hoverLineColor = '#319BFF';
 var minPerStep = [1, 2, 5, 10, 15, 20, 30, 60, 120, 180, 240, 360, 720, 1440];
@@ -237,32 +237,20 @@ function useTimeSlider(canvasRef, _ref2) {
    * 绘制当前刻度
    * @returns
    */
+  // const drawCurrentLine = () => {
+  //   const { currentTime, begin, hoursPer } = state;
+  //   const time = currentTime;
+  //   const range = [begin, currentTime + hoursPer * 3600 * 1000];
+  //   if (time < range[0] || time > range[1]) {
+  //     return;
+  //   }
+  //   const ms_current = time - begin;
+  //   const px_per_ms = width / (hoursPer * 60 * 60 * 1000); // px/ms
+  //   const left = px_per_ms * ms_current;
+  //   drawText(ctx, { fillStyle: '#ffffff', font: '12px Arial', x: left - 64, y: 14, text: formartTimestemp(time) });
+  //   drawLine(ctx, left, 20, left, height, currentColor, 2); //中间当前点线
+  // };
 
-
-  var drawCurrentLine = function drawCurrentLine() {
-    var currentTime = state.currentTime,
-        begin = state.begin,
-        hoursPer = state.hoursPer;
-    var time = currentTime;
-    var range = [begin, currentTime + hoursPer * 3600 * 1000];
-
-    if (time < range[0] || time > range[1]) {
-      return;
-    }
-
-    var ms_current = time - begin;
-    var px_per_ms = width / (hoursPer * 60 * 60 * 1000); // px/ms
-
-    var left = px_per_ms * ms_current;
-    drawText(ctx, {
-      fillStyle: '#ffffff',
-      font: '12px Arial',
-      x: left - 64,
-      y: 14,
-      text: formartTimestemp(time)
-    });
-    drawLine(ctx, left, 20, left, height, currentColor, 2); //中间当前点线
-  };
   /**
    * 绘制提示时间
    */
@@ -303,15 +291,16 @@ function useTimeSlider(canvasRef, _ref2) {
     if (canvas) {
       clearCanvas();
       drawOverlay();
-      drawScale();
-      drawCurrentLine();
+      drawScale(); // drawCurrentLine();
+
       state.hover.time && drawHoverLine();
     } // eslint-disable-next-line react-hooks/exhaustive-deps
 
   }, [canvas, state.begin, state.currentTime, state.hoursPer, segments, state.hover]);
 
   _useUpdateEffect(function () {
-    return update({
+    console.log(begin);
+    update({
       begin: begin
     });
   }, [begin]);
@@ -320,13 +309,8 @@ function useTimeSlider(canvasRef, _ref2) {
     return update({
       hoursPer: hoursPer
     });
-  }, [hoursPer]);
+  }, [hoursPer]); // useUpdateEffect(() => update({ currentTime }), [currentTime]);
 
-  _useUpdateEffect(function () {
-    return update({
-      currentTime: currentTime
-    });
-  }, [currentTime]);
   /**
    * 触发绘制范围单位（hour）
    */
@@ -456,14 +440,9 @@ function useTimeSlider(canvasRef, _ref2) {
         return new_current >= v.beginTime && new_current < v.endTime;
       }); // 当前片段没有录像的时候
 
-      var outTimeline = segmentItem && !segmentItem.url;
-      var new_begin = new_current - state.hoursPer * 60 * 60 * 1000 / 2;
-      setState(function (old) {
-        return Object.assign(Object.assign({}, old), {
-          begin: new_begin,
-          current: new_current
-        });
-      });
+      var outTimeline = segmentItem && !segmentItem.url; // const new_begin = new_current - (state.hoursPer * 60 * 60 * 1000) / 2;
+      // setState((old) => ({ ...old, begin: new_begin, current: new_current }));
+      // setState((old) => ({ ...old, begin: new_begin, current: new_current }));
 
       _nextTick(function () {
         return onTimeChange === null || onTimeChange === void 0 ? void 0 : onTimeChange(new_current, outTimeline);

package/package.json

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