@cloud-app-dev/vidc 4.0.0 → 4.0.2
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.
- package/es/AppContext/index.js +20 -61
- package/es/AutoExit/index.js +5 -9
- package/es/Config/index.js +0 -5
- package/es/Config/utils.js +7 -27
- package/es/ConfigContext/index.d.ts +1 -1
- package/es/ConfigContext/index.js +1 -3
- package/es/CustomRenderSelect/index.js +19 -39
- package/es/DynamicGridList/index.js +16 -28
- package/es/FullScreen/index.js +10 -22
- package/es/GridList/hook.js +36 -67
- package/es/GridList/index.d.ts +1 -1
- package/es/GridList/index.js +1 -1
- package/es/ImageView/index.js +16 -31
- package/es/LabelValue/index.d.ts +0 -8
- package/es/LabelValue/index.js +11 -16
- package/es/List/index.js +5 -7
- package/es/ListWithSizeAnimate/demo.js +3 -15
- package/es/LoaderScript/utils.js +100 -153
- package/es/Map/InfoWindow/MakerLikeWindow.js +35 -29
- package/es/Map/InfoWindow/demo.js +17 -29
- package/es/Picture/component/Tools/index.js +5 -7
- package/es/Picture/demo.js +15 -19
- package/es/Picture/index.js +70 -104
- package/es/Picture/utils.js +14 -28
- package/es/Player/api/index.d.ts +4 -4
- package/es/Player/api/index.js +47 -92
- package/es/Player/contraller_bar/right_bar.js +12 -23
- package/es/Player/demo.js +47 -62
- package/es/Player/event/errorEvent.d.ts +1 -1
- package/es/Player/event/errorEvent.js +16 -41
- package/es/Player/fps_play.js +15 -33
- package/es/Player/frontend_timeline.js +28 -48
- package/es/Player/player.d.ts +3 -2
- package/es/Player/segment_timeline.js +45 -69
- package/es/Player/single_player.js +111 -117
- package/es/Player/util.d.ts +1 -1
- package/es/Player/util.js +9 -28
- package/es/Progress/index.js +5 -16
- package/es/ROI/index.d.ts +0 -6
- package/es/ROI/index.js +17 -26
- package/es/RefDrawer/Footer.js +3 -5
- package/es/RefDrawer/demo.js +0 -3
- package/es/RefDrawer/index.js +17 -27
- package/es/RefModal/demo.js +0 -3
- package/es/RefModal/index.js +27 -27
- package/es/ScreenPlayer/Live.d.ts +1 -1
- package/es/ScreenPlayer/Live.js +36 -70
- package/es/ScreenPlayer/LiveTools.js +20 -39
- package/es/ScreenPlayer/PlayerWithExt.js +48 -85
- package/es/ScreenPlayer/RecordTools.d.ts +1 -1
- package/es/ScreenPlayer/RecordTools.js +27 -53
- package/es/ScreenPlayer/SegmentTimeLine.js +8 -13
- package/es/ScreenPlayer/TimeSelect.js +9 -24
- package/es/ScreenPlayer/demo.js +3 -2
- package/es/ScreenPlayer/demo2.js +76 -108
- package/es/ScreenPlayer/useTimeSlider.js +63 -141
- package/es/Service/http.js +14 -34
- package/es/TableLayout/index.js +6 -10
- package/es/ThemeAntd/index.js +0 -1
- package/es/Timeout/index.js +16 -31
- package/es/VList/index.d.ts +1 -9
- package/es/VList/index.js +18 -30
- package/es/index.d.ts +0 -1
- package/es/index.js +0 -1
- package/es/typings.d.ts +1 -0
- package/es/useDrawROI/index.js +61 -115
- package/es/useInfiniteScroll/index.js +24 -45
- package/es/utils.js +18 -42
- package/package.json +5 -6
- package/es/LoaderApp/index.d.ts +0 -31
- package/es/LoaderApp/index.js +0 -138
- package/es/LoaderApp/index.less +0 -3
- package/es/LoaderApp/interface.d.ts +0 -9
- package/es/LoaderApp/loader.d.ts +0 -19
- package/es/LoaderApp/loader.js +0 -85
- package/es/LoaderApp/sandbox.back.d.ts +0 -18
- package/es/LoaderApp/sandbox.back.js +0 -368
- package/es/LoaderApp/sandbox.d.ts +0 -12
- package/es/LoaderApp/sandbox.js +0 -113
- package/es/LoaderApp/utils.d.ts +0 -19
- package/es/LoaderApp/utils.js +0 -275
- package/es/ROI/utils.d.ts +0 -1
- package/es/ROI/utils.js +0 -1
|
@@ -1,70 +1,49 @@
|
|
|
1
1
|
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
2
|
-
|
|
3
2
|
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
4
|
-
|
|
5
3
|
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
6
|
-
|
|
7
4
|
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
8
|
-
|
|
9
5
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
10
|
-
|
|
11
6
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
12
|
-
|
|
13
7
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
14
|
-
|
|
15
|
-
function
|
|
16
|
-
|
|
17
|
-
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
18
|
-
|
|
8
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
9
|
+
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
19
10
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
20
|
-
|
|
21
|
-
import Flvjs from '@cloud-app-dev/flv.js';
|
|
11
|
+
import Flvjs from '@cloud-app-dev/mpegts.js';
|
|
22
12
|
import Hls from 'hls.js';
|
|
23
13
|
import { useEffect, useRef, useState } from 'react';
|
|
24
14
|
import { useRegisterPlayerEvent, useVideoEvent } from '.';
|
|
25
15
|
import EventName from "./eventName";
|
|
26
|
-
|
|
27
16
|
function useErrorEvent(_ref) {
|
|
28
17
|
var event = _ref.event,
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
18
|
+
reload = _ref.reload,
|
|
19
|
+
unload = _ref.unload,
|
|
20
|
+
errorReloadTimer = _ref.errorReloadTimer,
|
|
21
|
+
flv = _ref.flv,
|
|
22
|
+
hls = _ref.hls,
|
|
23
|
+
errorHandleAdapter = _ref.errorHandleAdapter;
|
|
36
24
|
var _useState = useState(0),
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
25
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
26
|
+
errorTimer = _useState2[0],
|
|
27
|
+
setErrorTime = _useState2[1];
|
|
41
28
|
var errorInfo = useRef(null);
|
|
42
29
|
var reloadTimer = useRef();
|
|
43
|
-
|
|
44
30
|
var errorHandle = function errorHandle() {
|
|
45
31
|
var _console;
|
|
46
|
-
|
|
47
32
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
48
33
|
args[_key] = arguments[_key];
|
|
49
34
|
}
|
|
50
|
-
|
|
51
35
|
if (args[2] && args[2].msg && args[2].msg.includes('Unsupported audio')) {
|
|
52
36
|
return;
|
|
53
37
|
}
|
|
54
|
-
|
|
55
38
|
(_console = console).error.apply(_console, args);
|
|
56
|
-
|
|
57
39
|
errorInfo.current = args;
|
|
58
|
-
|
|
59
40
|
if (!(errorHandleAdapter !== null && errorHandleAdapter !== void 0 && errorHandleAdapter(args))) {
|
|
60
41
|
setErrorTime(errorTimer + 1);
|
|
61
42
|
}
|
|
62
43
|
};
|
|
63
|
-
|
|
64
44
|
var clearErrorTimer = function clearErrorTimer() {
|
|
65
45
|
return setErrorTime(0);
|
|
66
46
|
};
|
|
67
|
-
|
|
68
47
|
var reloadSuccess = function reloadSuccess() {
|
|
69
48
|
if (errorTimer > 0) {
|
|
70
49
|
console.warn('视频重连成功!');
|
|
@@ -72,7 +51,6 @@ function useErrorEvent(_ref) {
|
|
|
72
51
|
clearErrorTimer();
|
|
73
52
|
}
|
|
74
53
|
};
|
|
75
|
-
|
|
76
54
|
useVideoEvent('error', errorHandle);
|
|
77
55
|
useVideoEvent('canplay', reloadSuccess);
|
|
78
56
|
useRegisterPlayerEvent(EventName.ERROR, errorHandle);
|
|
@@ -81,24 +59,21 @@ function useErrorEvent(_ref) {
|
|
|
81
59
|
if (flv) {
|
|
82
60
|
flv.on(Flvjs.Events.ERROR, errorHandle);
|
|
83
61
|
}
|
|
84
|
-
|
|
85
62
|
if (hls) {
|
|
86
63
|
hls.on(Hls.Events.ERROR, errorHandle);
|
|
87
|
-
}
|
|
64
|
+
}
|
|
65
|
+
//事件销毁由flv、hls销毁时控制
|
|
88
66
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
89
|
-
|
|
90
67
|
}, [flv, hls]);
|
|
91
68
|
useEffect(function () {
|
|
92
69
|
if (errorTimer === 0) {
|
|
93
70
|
return undefined;
|
|
94
71
|
}
|
|
95
|
-
|
|
96
72
|
if (errorTimer > errorReloadTimer) {
|
|
97
73
|
unload();
|
|
98
74
|
event === null || event === void 0 ? void 0 : event.emit(EventName.RELOAD_FAIL);
|
|
99
75
|
return undefined;
|
|
100
76
|
}
|
|
101
|
-
|
|
102
77
|
console.warn("\u89C6\u9891\u64AD\u653E\u51FA\u9519\uFF0C\u6B63\u5728\u8FDB\u884C\u91CD\u8FDE".concat(errorTimer));
|
|
103
78
|
reloadTimer.current = setTimeout(function () {
|
|
104
79
|
event === null || event === void 0 ? void 0 : event.emit.apply(event, [EventName.ERROR_RELOAD, errorTimer].concat(_toConsumableArray(errorInfo.current)));
|
|
@@ -106,8 +81,8 @@ function useErrorEvent(_ref) {
|
|
|
106
81
|
}, 2 * 1000);
|
|
107
82
|
return function () {
|
|
108
83
|
clearTimeout(reloadTimer.current);
|
|
109
|
-
};
|
|
84
|
+
};
|
|
85
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
110
86
|
}, [errorTimer, event, flv, hls]);
|
|
111
87
|
}
|
|
112
|
-
|
|
113
88
|
export default useErrorEvent;
|
package/es/Player/fps_play.js
CHANGED
|
@@ -1,15 +1,9 @@
|
|
|
1
1
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
2
|
-
|
|
3
2
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
4
|
-
|
|
5
3
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
6
|
-
|
|
7
|
-
function
|
|
8
|
-
|
|
9
|
-
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
10
|
-
|
|
4
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
5
|
+
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
11
6
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
12
|
-
|
|
13
7
|
import React, { useEffect, useMemo, useRef, useState } from 'react';
|
|
14
8
|
import useRafInterval from "../useRafInterval";
|
|
15
9
|
import { useRegisterPlayerEvent } from "./event";
|
|
@@ -17,18 +11,15 @@ import Events from "./event/eventName";
|
|
|
17
11
|
import { getDomStyleValue } from "./util";
|
|
18
12
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
19
13
|
var oneFps = 1 / 30;
|
|
20
|
-
|
|
21
14
|
function FPSPlay(_ref) {
|
|
22
15
|
var api = _ref.api,
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
16
|
+
event = _ref.event,
|
|
17
|
+
fpsDelay = _ref.fpsDelay,
|
|
18
|
+
fps = _ref.fps;
|
|
27
19
|
var _useState = useState(Date.now()),
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
20
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
21
|
+
forceKey = _useState2[0],
|
|
22
|
+
update = _useState2[1];
|
|
32
23
|
var ref = useRef(null);
|
|
33
24
|
var timerRef = useRef();
|
|
34
25
|
var fps_second = useMemo(function () {
|
|
@@ -36,33 +27,25 @@ function FPSPlay(_ref) {
|
|
|
36
27
|
}, [fps]);
|
|
37
28
|
useEffect(function () {
|
|
38
29
|
var fpsCapture = function fpsCapture() {
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
if (!ref.current || !(event !== null && event !== void 0 && event.video)) {
|
|
30
|
+
if (!ref.current || !(event !== null && event !== void 0 && event.video) || !api) {
|
|
42
31
|
return;
|
|
43
32
|
}
|
|
44
|
-
|
|
45
33
|
var video = event.video;
|
|
46
|
-
var fpsTime =
|
|
34
|
+
var fpsTime = api.getCurrentTime() + fps_second;
|
|
47
35
|
video.currentTime = fpsTime;
|
|
48
|
-
|
|
49
|
-
if (video.currentTime >= ((_api$getDuration = api === null || api === void 0 ? void 0 : api.getDuration()) !== null && _api$getDuration !== void 0 ? _api$getDuration : 0)) {
|
|
36
|
+
if (video.currentTime >= api.getDuration()) {
|
|
50
37
|
clearInterval(timerRef.current);
|
|
51
38
|
video.currentTime = 0;
|
|
52
39
|
event.emit(Events.PLAY_ENDED);
|
|
53
40
|
}
|
|
54
|
-
|
|
55
41
|
var canvas = ref.current;
|
|
56
42
|
var ctx = canvas.getContext('2d');
|
|
57
|
-
|
|
58
43
|
var _video$getBoundingCli = video.getBoundingClientRect(),
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
44
|
+
width = _video$getBoundingCli.width,
|
|
45
|
+
height = _video$getBoundingCli.height;
|
|
62
46
|
canvas.width = width;
|
|
63
47
|
canvas.height = height;
|
|
64
48
|
var fit = getDomStyleValue(video, 'object-fit');
|
|
65
|
-
|
|
66
49
|
if (fit === 'fill') {
|
|
67
50
|
//全画面绘制,存在拉伸
|
|
68
51
|
ctx === null || ctx === void 0 ? void 0 : ctx.drawImage(video, 0, 0, width, height);
|
|
@@ -76,7 +59,6 @@ function FPSPlay(_ref) {
|
|
|
76
59
|
ctx === null || ctx === void 0 ? void 0 : ctx.drawImage(video, paddingSize, 0, s_vw, height);
|
|
77
60
|
}
|
|
78
61
|
};
|
|
79
|
-
|
|
80
62
|
fpsCapture();
|
|
81
63
|
timerRef.current = setInterval(fpsCapture, fpsDelay);
|
|
82
64
|
return function () {
|
|
@@ -88,8 +70,9 @@ function FPSPlay(_ref) {
|
|
|
88
70
|
});
|
|
89
71
|
useRegisterPlayerEvent(Events.CANVAS_PLAY, function () {
|
|
90
72
|
update(Date.now());
|
|
91
|
-
});
|
|
73
|
+
});
|
|
92
74
|
|
|
75
|
+
// TODO: 未知情况,video会自动播放,轮训检测并暂停零时解决
|
|
93
76
|
useRafInterval(function () {
|
|
94
77
|
return !(api !== null && api !== void 0 && api.paused) ? api === null || api === void 0 ? void 0 : api.pause() : null;
|
|
95
78
|
}, 10);
|
|
@@ -98,5 +81,4 @@ function FPSPlay(_ref) {
|
|
|
98
81
|
ref: ref
|
|
99
82
|
});
|
|
100
83
|
}
|
|
101
|
-
|
|
102
84
|
export default FPSPlay;
|
|
@@ -1,23 +1,16 @@
|
|
|
1
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
1
2
|
import _useUpdateEffect from "ahooks/es/useUpdateEffect";
|
|
2
|
-
|
|
3
3
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
4
|
-
|
|
5
4
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
6
|
-
|
|
7
|
-
function
|
|
8
|
-
|
|
5
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
6
|
+
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
7
|
+
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
9
8
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
10
|
-
|
|
11
9
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
12
|
-
|
|
13
10
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
14
|
-
|
|
15
|
-
function
|
|
16
|
-
|
|
17
|
-
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
18
|
-
|
|
11
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
12
|
+
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
19
13
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
20
|
-
|
|
21
14
|
import moment from 'dayjs';
|
|
22
15
|
import React, { startTransition, useMemo, useState } from 'react';
|
|
23
16
|
import useBarStatus from "./contraller_bar/useBarStatus";
|
|
@@ -26,18 +19,15 @@ import { useTimes } from "./timeline";
|
|
|
26
19
|
import { FMT } from "./util";
|
|
27
20
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
28
21
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
29
|
-
|
|
30
22
|
function TipTitle(_ref) {
|
|
31
23
|
var end = _ref.end,
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
24
|
+
begin = _ref.begin,
|
|
25
|
+
left = _ref.left,
|
|
26
|
+
current = _ref.current,
|
|
27
|
+
markTime = _ref.markTime;
|
|
37
28
|
if (left === -1) {
|
|
38
29
|
return null;
|
|
39
30
|
}
|
|
40
|
-
|
|
41
31
|
return /*#__PURE__*/_jsxs("div", {
|
|
42
32
|
className: "frontend-line-tip-box",
|
|
43
33
|
style: {
|
|
@@ -59,34 +49,30 @@ function TipTitle(_ref) {
|
|
|
59
49
|
})]
|
|
60
50
|
});
|
|
61
51
|
}
|
|
62
|
-
|
|
63
52
|
function FrontendTimeLine(_ref2) {
|
|
64
53
|
var duration = _ref2.duration,
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
54
|
+
begin = _ref2.begin,
|
|
55
|
+
end = _ref2.end,
|
|
56
|
+
onSeek = _ref2.onSeek;
|
|
69
57
|
// time 是记录seek时跳了多少
|
|
70
58
|
var _useState = useState({
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
59
|
+
time: 0,
|
|
60
|
+
markTime: 0,
|
|
61
|
+
left: -1,
|
|
62
|
+
visible: false
|
|
63
|
+
}),
|
|
64
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
65
|
+
state = _useState2[0],
|
|
66
|
+
setState = _useState2[1];
|
|
67
|
+
var status = useBarStatus();
|
|
68
|
+
|
|
69
|
+
//获取视频当前播放时长单位s
|
|
82
70
|
var _useTimes = useTimes(),
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
71
|
+
_useTimes2 = _slicedToArray(_useTimes, 1),
|
|
72
|
+
currentTime = _useTimes2[0];
|
|
86
73
|
var rTime = useMemo(function () {
|
|
87
74
|
return state.time + currentTime;
|
|
88
75
|
}, [state.time, currentTime]);
|
|
89
|
-
|
|
90
76
|
_useUpdateEffect(function () {
|
|
91
77
|
return setState(function (old) {
|
|
92
78
|
return _objectSpread(_objectSpread({}, old), {}, {
|
|
@@ -94,27 +80,24 @@ function FrontendTimeLine(_ref2) {
|
|
|
94
80
|
});
|
|
95
81
|
});
|
|
96
82
|
}, [begin]);
|
|
97
|
-
|
|
98
83
|
var playPercent = useMemo(function () {
|
|
99
84
|
return rTime / duration * 100;
|
|
100
85
|
}, [duration, rTime]);
|
|
101
86
|
var cTime = useMemo(function () {
|
|
102
87
|
return begin + rTime * 1000;
|
|
103
88
|
}, [begin, rTime]);
|
|
104
|
-
|
|
105
89
|
var seekWithLine = function seekWithLine(e) {
|
|
106
90
|
var rect = e.currentTarget.getBoundingClientRect();
|
|
107
91
|
var current = e.pageX - rect.left;
|
|
108
92
|
var cTime = current / rect.width * duration;
|
|
109
|
-
onSeek === null || onSeek === void 0 ? void 0 : onSeek(begin + cTime * 1000);
|
|
110
|
-
|
|
93
|
+
onSeek === null || onSeek === void 0 ? void 0 : onSeek(begin + cTime * 1000);
|
|
94
|
+
//时间轴进度条rTime是要加上currentTime,这里要减去一下,包装交互一致性
|
|
111
95
|
setState(function (old) {
|
|
112
96
|
return _objectSpread(_objectSpread({}, old), {}, {
|
|
113
97
|
time: cTime
|
|
114
98
|
});
|
|
115
99
|
});
|
|
116
100
|
};
|
|
117
|
-
|
|
118
101
|
var onLineMouseOver = function onLineMouseOver(e) {
|
|
119
102
|
var rect = e.currentTarget.getBoundingClientRect();
|
|
120
103
|
var left = e.pageX - rect.left;
|
|
@@ -126,7 +109,6 @@ function FrontendTimeLine(_ref2) {
|
|
|
126
109
|
});
|
|
127
110
|
});
|
|
128
111
|
};
|
|
129
|
-
|
|
130
112
|
var onLineMouseOut = function onLineMouseOut() {
|
|
131
113
|
return startTransition(function () {
|
|
132
114
|
return setState(function (old) {
|
|
@@ -136,7 +118,6 @@ function FrontendTimeLine(_ref2) {
|
|
|
136
118
|
});
|
|
137
119
|
});
|
|
138
120
|
};
|
|
139
|
-
|
|
140
121
|
return /*#__PURE__*/_jsxs("div", {
|
|
141
122
|
className: "player-timeline-layout frontend-player-timeline-layout ".concat(status === 0 ? 'hide-time-line' : ''),
|
|
142
123
|
onClick: seekWithLine,
|
|
@@ -161,5 +142,4 @@ function FrontendTimeLine(_ref2) {
|
|
|
161
142
|
})]
|
|
162
143
|
});
|
|
163
144
|
}
|
|
164
|
-
|
|
165
145
|
export default FrontendTimeLine;
|
package/es/Player/player.d.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import type Flvjs from '@cloud-app-dev/
|
|
2
|
-
import type Hls
|
|
1
|
+
import type Flvjs from '@cloud-app-dev/mpegts.js';
|
|
2
|
+
import type Hls from 'hls.js';
|
|
3
|
+
import type { HlsConfig } from 'hls.js';
|
|
3
4
|
import type React from 'react';
|
|
4
5
|
import type Api from './api';
|
|
5
6
|
import type VideoEventInstance from './event';
|
|
@@ -1,21 +1,15 @@
|
|
|
1
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
1
2
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
2
|
-
|
|
3
3
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
|
-
|
|
5
|
-
function
|
|
6
|
-
|
|
4
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
|
+
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
6
|
+
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
7
7
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
8
|
-
|
|
9
8
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
10
|
-
|
|
11
9
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
12
|
-
|
|
13
|
-
function
|
|
14
|
-
|
|
15
|
-
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
16
|
-
|
|
10
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
11
|
+
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
17
12
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
18
|
-
|
|
19
13
|
import { Tooltip } from 'antd';
|
|
20
14
|
import moment from 'dayjs';
|
|
21
15
|
import React, { startTransition, useMemo, useState } from 'react';
|
|
@@ -25,44 +19,37 @@ import { useTimes } from "./timeline";
|
|
|
25
19
|
import { FMT } from "./util";
|
|
26
20
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
27
21
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
28
|
-
|
|
29
22
|
function TipTitle(_ref) {
|
|
30
23
|
var index = _ref.index,
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
24
|
+
segments = _ref.segments,
|
|
25
|
+
begin = _ref.begin,
|
|
26
|
+
current = _ref.current,
|
|
27
|
+
markTime = _ref.markTime;
|
|
36
28
|
var _useMemo = useMemo(function () {
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
29
|
+
if (index === 0) {
|
|
30
|
+
var _start = begin;
|
|
31
|
+
var _end = begin + (segments[0].endTime - segments[0].beginTime);
|
|
32
|
+
return {
|
|
33
|
+
start: moment(_start).format(FMT),
|
|
34
|
+
end: moment(_end).format(FMT)
|
|
35
|
+
};
|
|
36
|
+
}
|
|
37
|
+
var indexDuration = segments.map(function (v) {
|
|
38
|
+
return v.endTime - v.beginTime;
|
|
39
|
+
}).reduce(function (a, b, i) {
|
|
40
|
+
return i >= index ? a : a + b;
|
|
41
|
+
}, 0);
|
|
42
|
+
var start = begin + indexDuration;
|
|
43
|
+
var end = start + (segments[index].endTime - segments[index].beginTime);
|
|
42
44
|
return {
|
|
43
|
-
start: moment(
|
|
44
|
-
end: moment(
|
|
45
|
+
start: moment(start).format(FMT),
|
|
46
|
+
end: moment(end).format(FMT)
|
|
45
47
|
};
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
return v.endTime - v.beginTime;
|
|
50
|
-
}).reduce(function (a, b, i) {
|
|
51
|
-
return i >= index ? a : a + b;
|
|
52
|
-
}, 0);
|
|
53
|
-
var start = begin + indexDuration;
|
|
54
|
-
var end = start + (segments[index].endTime - segments[index].beginTime);
|
|
55
|
-
return {
|
|
56
|
-
start: moment(start).format(FMT),
|
|
57
|
-
end: moment(end).format(FMT)
|
|
58
|
-
};
|
|
59
|
-
}, [index, segments, begin]),
|
|
60
|
-
start = _useMemo.start,
|
|
61
|
-
end = _useMemo.end;
|
|
62
|
-
|
|
48
|
+
}, [index, segments, begin]),
|
|
49
|
+
start = _useMemo.start,
|
|
50
|
+
end = _useMemo.end;
|
|
63
51
|
var hasUrl = useMemo(function () {
|
|
64
52
|
var _segments$index;
|
|
65
|
-
|
|
66
53
|
return (_segments$index = segments[index]) !== null && _segments$index !== void 0 && _segments$index.url ? true : false;
|
|
67
54
|
}, [index, segments]);
|
|
68
55
|
return /*#__PURE__*/_jsxs("div", {
|
|
@@ -90,31 +77,26 @@ function TipTitle(_ref) {
|
|
|
90
77
|
})]
|
|
91
78
|
});
|
|
92
79
|
}
|
|
93
|
-
|
|
94
80
|
function SegmentTimeLine(_ref2) {
|
|
95
81
|
var index = _ref2.index,
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
82
|
+
segments = _ref2.segments,
|
|
83
|
+
duration = _ref2.duration,
|
|
84
|
+
begin = _ref2.begin,
|
|
85
|
+
seekTo = _ref2.seekTo;
|
|
101
86
|
var _useState = useState({
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
87
|
+
time: 0,
|
|
88
|
+
markTime: 0,
|
|
89
|
+
left: -1,
|
|
90
|
+
visible: false
|
|
91
|
+
}),
|
|
92
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
93
|
+
state = _useState2[0],
|
|
94
|
+
setState = _useState2[1];
|
|
111
95
|
var status = useBarStatus();
|
|
112
|
-
|
|
113
96
|
var _useTimes = useTimes(),
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
97
|
+
_useTimes2 = _slicedToArray(_useTimes, 2),
|
|
98
|
+
currentTime = _useTimes2[0],
|
|
99
|
+
buffered = _useTimes2[1];
|
|
118
100
|
var indexDuration = useMemo(function () {
|
|
119
101
|
return segments.map(function (v) {
|
|
120
102
|
return (v.endTime - v.beginTime) / 1000;
|
|
@@ -128,12 +110,10 @@ function SegmentTimeLine(_ref2) {
|
|
|
128
110
|
var bufferedPercent = useMemo(function () {
|
|
129
111
|
return (buffered + indexDuration) / duration * 100;
|
|
130
112
|
}, [buffered, duration, indexDuration]);
|
|
131
|
-
|
|
132
113
|
var seekWithLine = function seekWithLine(e, i) {
|
|
133
114
|
if (!segments[i].url) {
|
|
134
115
|
return;
|
|
135
116
|
}
|
|
136
|
-
|
|
137
117
|
var ele = e.currentTarget;
|
|
138
118
|
var rect = ele.getBoundingClientRect();
|
|
139
119
|
var current = e.pageX - rect.left;
|
|
@@ -143,7 +123,6 @@ function SegmentTimeLine(_ref2) {
|
|
|
143
123
|
var currentTime = current / rect.width * duration;
|
|
144
124
|
seekTo(Math.round(currentTime + pTime));
|
|
145
125
|
};
|
|
146
|
-
|
|
147
126
|
var onLineMouseOver = function onLineMouseOver(e) {
|
|
148
127
|
var rect = e.currentTarget.getBoundingClientRect();
|
|
149
128
|
var left = e.pageX - rect.left;
|
|
@@ -155,7 +134,6 @@ function SegmentTimeLine(_ref2) {
|
|
|
155
134
|
});
|
|
156
135
|
});
|
|
157
136
|
};
|
|
158
|
-
|
|
159
137
|
var onLineMouseOut = function onLineMouseOut() {
|
|
160
138
|
return startTransition(function () {
|
|
161
139
|
return setState(function (old) {
|
|
@@ -165,7 +143,6 @@ function SegmentTimeLine(_ref2) {
|
|
|
165
143
|
});
|
|
166
144
|
});
|
|
167
145
|
};
|
|
168
|
-
|
|
169
146
|
return /*#__PURE__*/_jsx("div", {
|
|
170
147
|
className: "player-timeline-layout player-segment-timeline-layout ".concat(status === 0 ? 'hide-time-line' : ''),
|
|
171
148
|
onMouseMove: onLineMouseOver,
|
|
@@ -210,5 +187,4 @@ function SegmentTimeLine(_ref2) {
|
|
|
210
187
|
})
|
|
211
188
|
});
|
|
212
189
|
}
|
|
213
|
-
|
|
214
190
|
export default SegmentTimeLine;
|