@cloud-app-dev/vidc 3.0.3 → 3.0.6
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/.umirc.ts +12 -7
- package/es/DisableMark/index.css +9 -0
- package/es/DisableMark/index.d.ts +8 -0
- package/es/DisableMark/index.js +10 -0
- package/es/Drawer/index.css +1 -0
- package/es/Map/AMap.d.ts +6841 -1308
- package/es/Map/BasicMap/AMapInstance.d.ts +4 -3
- package/es/Map/BasicMap/AMapInstance.js +18 -3
- package/es/Map/BasicMap/LeafletInstance.d.ts +3 -3
- package/es/Map/ClusterLayer/hook.d.ts +4 -4
- package/es/Map/ClusterLayer/hook.js +20 -24
- package/es/Map/ClusterLayer/index.d.ts +1 -0
- package/es/Map/ClusterLayer/index.js +1 -0
- package/es/Map/Config/utils.js +2 -2
- package/es/Map/InfoWindow/MakerLikeWindow.d.ts +4 -0
- package/es/Map/InfoWindow/MakerLikeWindow.js +103 -0
- package/es/Map/InfoWindow/demo.js +48 -21
- package/es/Map/InfoWindow/index.d.ts +7 -5
- package/es/Map/InfoWindow/index.js +7 -6
- package/es/Map/interface.d.ts +1 -1
- package/es/Map/useMarker/index.d.ts +2 -2
- package/es/Map/useMarker/index.js +3 -19
- package/es/Player/api/index.js +0 -1
- package/es/Player/demo.js +4 -3
- package/es/Player/event/errorEvent.js +3 -8
- package/es/Player/iconfont.d.ts +1 -1
- package/es/Player/iconfont.js +1 -1
- package/es/Player/live_heart.js +7 -32
- package/es/Player/single_player.js +6 -1
- package/es/Player/style/iconfont.ttf +0 -0
- package/es/Player/style/iconfont.woff +0 -0
- package/es/Player/style/iconfont.woff2 +0 -0
- package/es/ScreenPlayer/Live.d.ts +1 -1
- package/es/ScreenPlayer/Live.js +22 -4
- package/es/ScreenPlayer/LiveTools.d.ts +5 -1
- package/es/ScreenPlayer/LiveTools.js +87 -43
- package/es/ScreenPlayer/PlayerWithExt.js +29 -4
- package/es/ScreenPlayer/Record.d.ts +1 -1
- package/es/ScreenPlayer/Record.js +27 -8
- package/es/ScreenPlayer/RecordTools.d.ts +5 -1
- package/es/ScreenPlayer/RecordTools.js +103 -46
- package/es/ScreenPlayer/ScreenSelect.d.ts +7 -0
- package/es/ScreenPlayer/ScreenSelect.js +28 -0
- package/es/ScreenPlayer/SegmentTimeLine.d.ts +1 -2
- package/es/ScreenPlayer/SegmentTimeLine.js +9 -6
- package/es/ScreenPlayer/TimeSelect.d.ts +7 -0
- package/es/ScreenPlayer/TimeSelect.js +129 -0
- package/es/ScreenPlayer/demo.d.ts +1 -1
- package/es/ScreenPlayer/demo.js +9 -4
- package/es/ScreenPlayer/demo2.js +1 -1
- package/es/ScreenPlayer/index.css +62 -4
- package/es/ScreenPlayer/interface.d.ts +27 -0
- package/es/Timeout/index.d.ts +8 -9
- package/es/Timeout/index.js +17 -23
- package/es/index.d.ts +1 -0
- package/es/index.js +1 -0
- package/package.json +1 -1
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import _useUpdate from "ahooks/es/useUpdate";
|
|
1
2
|
import _useFullscreen3 from "ahooks/es/useFullscreen";
|
|
2
3
|
|
|
3
4
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
@@ -13,7 +14,9 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
|
|
|
13
14
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
14
15
|
|
|
15
16
|
import React from 'react';
|
|
16
|
-
import
|
|
17
|
+
import IconFont from '../Player/iconfont';
|
|
18
|
+
import ScreenSelect from './ScreenSelect';
|
|
19
|
+
import TimeSelect from './TimeSelect';
|
|
17
20
|
|
|
18
21
|
function RecordTools(_ref) {
|
|
19
22
|
var containerRef = _ref.containerRef,
|
|
@@ -21,23 +24,32 @@ function RecordTools(_ref) {
|
|
|
21
24
|
screenNum = _ref.screenNum,
|
|
22
25
|
getPlayerItem = _ref.getPlayerItem,
|
|
23
26
|
mode = _ref.mode,
|
|
27
|
+
toggleFit = _ref.toggleFit,
|
|
24
28
|
fit = _ref.fit,
|
|
25
|
-
|
|
29
|
+
time = _ref.time,
|
|
30
|
+
onTimeChange = _ref.onTimeChange,
|
|
31
|
+
onClose = _ref.onClose,
|
|
32
|
+
onCloseAll = _ref.onCloseAll;
|
|
26
33
|
|
|
27
34
|
var _useFullscreen = _useFullscreen3(containerRef),
|
|
28
35
|
_useFullscreen2 = _slicedToArray(_useFullscreen, 2),
|
|
29
36
|
isFullscreen = _useFullscreen2[0],
|
|
30
|
-
toggleFullscreen = _useFullscreen2[1].toggleFullscreen;
|
|
37
|
+
toggleFullscreen = _useFullscreen2[1].toggleFullscreen;
|
|
38
|
+
|
|
39
|
+
var update = _useUpdate(); // 播放状态控制
|
|
31
40
|
|
|
32
41
|
|
|
33
42
|
var playToggle = function playToggle() {
|
|
34
|
-
var player = getPlayerItem();
|
|
43
|
+
var player = getPlayerItem(); // eslint-disable-next-line @typescript-eslint/no-unused-expressions
|
|
44
|
+
|
|
35
45
|
player ? player.video.paused ? player.api.play() : player.api.pause() : undefined;
|
|
46
|
+
update();
|
|
36
47
|
}; // 重连
|
|
37
48
|
|
|
38
49
|
|
|
39
50
|
var reload = function reload() {
|
|
40
|
-
var player = getPlayerItem();
|
|
51
|
+
var player = getPlayerItem(); // eslint-disable-next-line @typescript-eslint/no-unused-expressions
|
|
52
|
+
|
|
41
53
|
player ? player.reload ? player.reload() : player.api.reload() : undefined;
|
|
42
54
|
};
|
|
43
55
|
|
|
@@ -46,57 +58,102 @@ function RecordTools(_ref) {
|
|
|
46
58
|
return player ? player.api.snapshot() : undefined;
|
|
47
59
|
};
|
|
48
60
|
|
|
61
|
+
var player = getPlayerItem();
|
|
49
62
|
return /*#__PURE__*/React.createElement("div", {
|
|
50
63
|
className: "player-tools"
|
|
51
64
|
}, /*#__PURE__*/React.createElement("div", {
|
|
52
|
-
className: "
|
|
53
|
-
},
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
+
className: "player-tools-left"
|
|
66
|
+
}, /*#__PURE__*/React.createElement("span", {
|
|
67
|
+
className: "player-tools-item"
|
|
68
|
+
}, /*#__PURE__*/React.createElement(IconFont, {
|
|
69
|
+
type: "lm-player-volume-close",
|
|
70
|
+
title: "\u97F3\u91CF"
|
|
71
|
+
})), /*#__PURE__*/React.createElement("span", {
|
|
72
|
+
className: "player-tools-item"
|
|
73
|
+
}, /*#__PURE__*/React.createElement(IconFont, {
|
|
74
|
+
type: "lm-player-xiangji1fill",
|
|
75
|
+
title: "\u622A\u56FE",
|
|
76
|
+
onClick: snapshot
|
|
77
|
+
})), /*#__PURE__*/React.createElement("span", {
|
|
78
|
+
className: "player-tools-item",
|
|
79
|
+
onClick: reload
|
|
80
|
+
}, /*#__PURE__*/React.createElement(IconFont, {
|
|
81
|
+
type: "lm-player-Refresh_Main",
|
|
82
|
+
title: "\u91CD\u8F7D"
|
|
83
|
+
})), /*#__PURE__*/React.createElement("span", {
|
|
84
|
+
className: "player-tools-item",
|
|
85
|
+
onClick: onClose
|
|
86
|
+
}, /*#__PURE__*/React.createElement(IconFont, {
|
|
87
|
+
type: "lm-player-YesorNo_No_Dark",
|
|
88
|
+
title: "\u5173\u95ED\u5F53\u524D"
|
|
89
|
+
})), /*#__PURE__*/React.createElement("span", {
|
|
90
|
+
className: "player-tools-item"
|
|
91
|
+
}, /*#__PURE__*/React.createElement(IconFont, {
|
|
92
|
+
type: "lm-player-S_Edit_LoadDown",
|
|
93
|
+
title: "\u4E0B\u8F7D\u5F53\u524D\u5F55\u50CF"
|
|
94
|
+
}))), /*#__PURE__*/React.createElement("div", {
|
|
95
|
+
className: "player-tools-mid"
|
|
96
|
+
}, /*#__PURE__*/React.createElement("span", {
|
|
97
|
+
className: "player-tools-item",
|
|
98
|
+
onClick: playToggle
|
|
99
|
+
}, player && !player.video.paused ? /*#__PURE__*/React.createElement(IconFont, {
|
|
100
|
+
type: "lm-player-Pause_Main",
|
|
101
|
+
title: "\u6682\u505C"
|
|
102
|
+
}) : /*#__PURE__*/React.createElement(IconFont, {
|
|
103
|
+
type: "lm-player-Play_Main",
|
|
104
|
+
title: "\u64AD\u653E"
|
|
105
|
+
})), /*#__PURE__*/React.createElement(TimeSelect, {
|
|
106
|
+
time: time,
|
|
107
|
+
onChange: onTimeChange
|
|
65
108
|
}), /*#__PURE__*/React.createElement("span", {
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
109
|
+
className: "player-tools-item",
|
|
110
|
+
onClick: playToggle
|
|
111
|
+
}, player && !player.video.paused ? /*#__PURE__*/React.createElement(IconFont, {
|
|
112
|
+
type: "lm-player-Pause_Main",
|
|
113
|
+
title: "\u6682\u505C"
|
|
114
|
+
}) : /*#__PURE__*/React.createElement(IconFont, {
|
|
115
|
+
type: "lm-player-Play_Main",
|
|
116
|
+
title: "\u64AD\u653E"
|
|
117
|
+
}))), /*#__PURE__*/React.createElement("div", {
|
|
118
|
+
className: "player-tools-right"
|
|
119
|
+
}, /*#__PURE__*/React.createElement("span", {
|
|
120
|
+
className: "player-tools-item",
|
|
121
|
+
onClick: onCloseAll
|
|
122
|
+
}, /*#__PURE__*/React.createElement(IconFont, {
|
|
123
|
+
type: "lm-player-YesorNo_No_Dark",
|
|
124
|
+
title: "\u5173\u95ED\u6240\u6709"
|
|
125
|
+
})), /*#__PURE__*/React.createElement("span", {
|
|
126
|
+
className: "player-tools-item",
|
|
74
127
|
onClick: function onClick() {
|
|
75
128
|
return updateState({
|
|
76
129
|
mode: mode === 1 ? 2 : 1
|
|
77
130
|
});
|
|
78
131
|
}
|
|
79
|
-
},
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
}, "\u64AD\u653E/\u6682\u505C"), /*#__PURE__*/React.createElement("span", {
|
|
85
|
-
style: {
|
|
86
|
-
padding: 6
|
|
87
|
-
},
|
|
88
|
-
onClick: reload
|
|
89
|
-
}, "\u91CD\u8FDE"), /*#__PURE__*/React.createElement("span", {
|
|
90
|
-
style: {
|
|
91
|
-
padding: 6
|
|
92
|
-
},
|
|
132
|
+
}, /*#__PURE__*/React.createElement(IconFont, {
|
|
133
|
+
type: "lm-player-YesorNo_No_Dark",
|
|
134
|
+
title: "\u5207\u6362".concat(mode === 1 ? '插件' : '浏览器', "\u6A21\u5F0F")
|
|
135
|
+
})), /*#__PURE__*/React.createElement("span", {
|
|
136
|
+
className: "player-tools-item",
|
|
93
137
|
onClick: toggleFit
|
|
94
|
-
}, fit === 'fill' ?
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
138
|
+
}, fit === 'fill' ? /*#__PURE__*/React.createElement(IconFont, {
|
|
139
|
+
type: "lm-player-S_View_ScreenSizeFull",
|
|
140
|
+
title: "\u81EA\u9002\u5E94"
|
|
141
|
+
}) : /*#__PURE__*/React.createElement(IconFont, {
|
|
142
|
+
type: "lm-player-S_View_ScreenSizeFull",
|
|
143
|
+
title: "\u586B\u5145"
|
|
144
|
+
})), /*#__PURE__*/React.createElement(ScreenSelect, {
|
|
145
|
+
screenNum: screenNum,
|
|
146
|
+
updateState: updateState
|
|
147
|
+
}), /*#__PURE__*/React.createElement("span", {
|
|
148
|
+
className: "player-tools-item",
|
|
149
|
+
onClick: toggleFullscreen
|
|
150
|
+
}, isFullscreen ? /*#__PURE__*/React.createElement(IconFont, {
|
|
151
|
+
type: "lm-player-ExitFull_Main",
|
|
152
|
+
title: "\u5168\u5C4F"
|
|
153
|
+
}) : /*#__PURE__*/React.createElement(IconFont, {
|
|
154
|
+
type: "lm-player-Full_Main",
|
|
155
|
+
title: "\u5168\u5C4F"
|
|
156
|
+
}))));
|
|
100
157
|
}
|
|
101
158
|
|
|
102
159
|
export default RecordTools;
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import "antd/lib/tooltip/style";
|
|
2
|
+
import _Tooltip from "antd/lib/tooltip";
|
|
3
|
+
import React from 'react';
|
|
4
|
+
import { ScreenType } from './utils';
|
|
5
|
+
|
|
6
|
+
function ScreenSelect(_ref) {
|
|
7
|
+
var screenNum = _ref.screenNum,
|
|
8
|
+
updateState = _ref.updateState;
|
|
9
|
+
return /*#__PURE__*/React.createElement(_Tooltip, {
|
|
10
|
+
title: /*#__PURE__*/React.createElement("div", null, ScreenType.map(function (item) {
|
|
11
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
12
|
+
key: "".concat(item.name),
|
|
13
|
+
style: {
|
|
14
|
+
padding: 6
|
|
15
|
+
},
|
|
16
|
+
onClick: function onClick() {
|
|
17
|
+
return updateState({
|
|
18
|
+
screenNum: item.name
|
|
19
|
+
});
|
|
20
|
+
}
|
|
21
|
+
}, item.name);
|
|
22
|
+
}))
|
|
23
|
+
}, /*#__PURE__*/React.createElement("span", {
|
|
24
|
+
className: "player-tools-item"
|
|
25
|
+
}, screenNum));
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
export default ScreenSelect;
|
|
@@ -4,7 +4,6 @@ interface ISegmentTimeLineProps {
|
|
|
4
4
|
begin?: number;
|
|
5
5
|
timeCell?: ISegmentType[];
|
|
6
6
|
onTimeChange?: (time: number) => void;
|
|
7
|
-
disabled?: boolean;
|
|
8
7
|
}
|
|
9
|
-
declare function SegmentTimeLine({ begin, timeCell,
|
|
8
|
+
declare function SegmentTimeLine({ begin, timeCell, onTimeChange }: ISegmentTimeLineProps): JSX.Element;
|
|
10
9
|
export default SegmentTimeLine;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import _useThrottleFn2 from "ahooks/es/useThrottleFn";
|
|
2
2
|
import _useSize from "ahooks/es/useSize";
|
|
3
|
+
import moment from 'moment';
|
|
3
4
|
import React, { useEffect, useRef } from 'react';
|
|
4
5
|
import TimeSlider from './TimeSlider';
|
|
5
6
|
|
|
6
7
|
function SegmentTimeLine(_ref) {
|
|
7
8
|
var begin = _ref.begin,
|
|
8
9
|
timeCell = _ref.timeCell,
|
|
9
|
-
disabled = _ref.disabled,
|
|
10
10
|
onTimeChange = _ref.onTimeChange;
|
|
11
11
|
var ref = useRef();
|
|
12
12
|
|
|
@@ -18,10 +18,15 @@ function SegmentTimeLine(_ref) {
|
|
|
18
18
|
run = _useThrottleFn.run;
|
|
19
19
|
|
|
20
20
|
useEffect(function () {
|
|
21
|
+
var time = begin !== null && begin !== void 0 ? begin : moment().set({
|
|
22
|
+
hours: 0,
|
|
23
|
+
minutes: 0,
|
|
24
|
+
seconds: 0
|
|
25
|
+
}).valueOf();
|
|
21
26
|
var timeLine = new TimeSlider(ref.current, {
|
|
22
27
|
onTimeChange: run,
|
|
23
|
-
start_timestamp:
|
|
24
|
-
current_timestamp:
|
|
28
|
+
start_timestamp: time - 12 * 3600 * 1000,
|
|
29
|
+
current_timestamp: time,
|
|
25
30
|
timecell: timeCell
|
|
26
31
|
});
|
|
27
32
|
return function () {
|
|
@@ -30,9 +35,7 @@ function SegmentTimeLine(_ref) {
|
|
|
30
35
|
}, [begin, timeCell, size === null || size === void 0 ? void 0 : size.width, run]);
|
|
31
36
|
return /*#__PURE__*/React.createElement("div", {
|
|
32
37
|
className: "record-time-line"
|
|
33
|
-
},
|
|
34
|
-
className: "time-line-mask"
|
|
35
|
-
}), /*#__PURE__*/React.createElement("canvas", {
|
|
38
|
+
}, /*#__PURE__*/React.createElement("canvas", {
|
|
36
39
|
ref: ref
|
|
37
40
|
}));
|
|
38
41
|
}
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
import "antd/lib/button/style";
|
|
2
|
+
import _Button from "antd/lib/button";
|
|
3
|
+
import "antd/lib/input-number/style";
|
|
4
|
+
import _InputNumber from "antd/lib/input-number";
|
|
5
|
+
import "antd/lib/popover/style";
|
|
6
|
+
import _Popover from "antd/lib/popover";
|
|
7
|
+
import _useUpdateEffect from "ahooks/es/useUpdateEffect";
|
|
8
|
+
|
|
9
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
10
|
+
|
|
11
|
+
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
|
+
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 _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; }
|
|
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
|
+
|
|
19
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
20
|
+
|
|
21
|
+
import React, { useMemo, useState } from 'react';
|
|
22
|
+
import moment from 'moment';
|
|
23
|
+
|
|
24
|
+
function TimeSelect(_ref) {
|
|
25
|
+
var time = _ref.time,
|
|
26
|
+
onChange = _ref.onChange;
|
|
27
|
+
|
|
28
|
+
var _useState = useState(function () {
|
|
29
|
+
var m = time ? moment(time) : moment().set({
|
|
30
|
+
hours: 0,
|
|
31
|
+
minutes: 0,
|
|
32
|
+
seconds: 0
|
|
33
|
+
});
|
|
34
|
+
return [m.hours(), m.minutes(), m.seconds()];
|
|
35
|
+
}),
|
|
36
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
37
|
+
values = _useState2[0],
|
|
38
|
+
setValues = _useState2[1];
|
|
39
|
+
|
|
40
|
+
var timeStr = useMemo(function () {
|
|
41
|
+
var m = time ? moment(time) : moment().set({
|
|
42
|
+
hours: 0,
|
|
43
|
+
minutes: 0,
|
|
44
|
+
seconds: 0
|
|
45
|
+
});
|
|
46
|
+
return m.format('HH:mm:ss');
|
|
47
|
+
}, [time]);
|
|
48
|
+
|
|
49
|
+
var onChangeTime = function onChangeTime() {
|
|
50
|
+
var m = time ? moment(time) : moment().set({
|
|
51
|
+
hours: 0,
|
|
52
|
+
minutes: 0,
|
|
53
|
+
seconds: 0
|
|
54
|
+
});
|
|
55
|
+
var newTime = m.set({
|
|
56
|
+
hours: values[0],
|
|
57
|
+
minutes: values[1],
|
|
58
|
+
seconds: values[2]
|
|
59
|
+
}).valueOf();
|
|
60
|
+
console.log(values, newTime);
|
|
61
|
+
onChange && onChange(newTime);
|
|
62
|
+
};
|
|
63
|
+
|
|
64
|
+
_useUpdateEffect(function () {
|
|
65
|
+
var m = time ? moment(time) : moment().set({
|
|
66
|
+
hours: 0,
|
|
67
|
+
minutes: 0,
|
|
68
|
+
seconds: 0
|
|
69
|
+
});
|
|
70
|
+
setValues([m.hours(), m.minutes(), m.seconds()]);
|
|
71
|
+
}, [time]);
|
|
72
|
+
|
|
73
|
+
var formatter = function formatter(value) {
|
|
74
|
+
return String(value).length === 1 ? "0".concat(value) : value + '';
|
|
75
|
+
};
|
|
76
|
+
|
|
77
|
+
return /*#__PURE__*/React.createElement(_Popover, {
|
|
78
|
+
content: /*#__PURE__*/React.createElement("div", {
|
|
79
|
+
className: "player-time-select"
|
|
80
|
+
}, /*#__PURE__*/React.createElement(_InputNumber, {
|
|
81
|
+
size: "small",
|
|
82
|
+
style: {
|
|
83
|
+
width: 36
|
|
84
|
+
},
|
|
85
|
+
formatter: formatter,
|
|
86
|
+
controls: false,
|
|
87
|
+
value: values[0],
|
|
88
|
+
onChange: function onChange(v) {
|
|
89
|
+
return setValues(function (old) {
|
|
90
|
+
return [v, old[1], old[2]];
|
|
91
|
+
});
|
|
92
|
+
}
|
|
93
|
+
}), ":", /*#__PURE__*/React.createElement(_InputNumber, {
|
|
94
|
+
size: "small",
|
|
95
|
+
style: {
|
|
96
|
+
width: 36
|
|
97
|
+
},
|
|
98
|
+
formatter: formatter,
|
|
99
|
+
controls: false,
|
|
100
|
+
value: values[1],
|
|
101
|
+
onChange: function onChange(v) {
|
|
102
|
+
return setValues(function (old) {
|
|
103
|
+
return [old[0], v, old[2]];
|
|
104
|
+
});
|
|
105
|
+
}
|
|
106
|
+
}), ":", /*#__PURE__*/React.createElement(_InputNumber, {
|
|
107
|
+
size: "small",
|
|
108
|
+
style: {
|
|
109
|
+
width: 36
|
|
110
|
+
},
|
|
111
|
+
formatter: formatter,
|
|
112
|
+
controls: false,
|
|
113
|
+
value: values[2],
|
|
114
|
+
onChange: function onChange(v) {
|
|
115
|
+
return setValues(function (old) {
|
|
116
|
+
return [old[0], old[1], v];
|
|
117
|
+
});
|
|
118
|
+
}
|
|
119
|
+
}), /*#__PURE__*/React.createElement(_Button, {
|
|
120
|
+
size: "small",
|
|
121
|
+
type: "primary",
|
|
122
|
+
onClick: onChangeTime
|
|
123
|
+
}, "\u786E\u5B9A"))
|
|
124
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
125
|
+
className: "player-record-time"
|
|
126
|
+
}, timeStr));
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
export default TimeSelect;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
export default function (): JSX.Element;
|
|
2
|
+
export default function App(): JSX.Element;
|
package/es/ScreenPlayer/demo.js
CHANGED
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import "antd/lib/config-provider/style";
|
|
2
|
+
import _ConfigProvider from "antd/lib/config-provider";
|
|
1
3
|
import React from 'react';
|
|
2
4
|
import LivePlayer from './Live';
|
|
3
5
|
var list = [{
|
|
@@ -13,13 +15,16 @@ var list = [{
|
|
|
13
15
|
url: 'https://6a75ef90-0-server.antelopecloud.cn/flv_live?app=live&token=557997490_3356491776_1691725056_86b4dd8105fea7b1180408a63d17b37b',
|
|
14
16
|
type: 'flv'
|
|
15
17
|
}];
|
|
16
|
-
export default function () {
|
|
17
|
-
return /*#__PURE__*/React.createElement(
|
|
18
|
+
export default function App() {
|
|
19
|
+
return /*#__PURE__*/React.createElement(_ConfigProvider, {
|
|
20
|
+
prefixCls: "cloudapp"
|
|
21
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
18
22
|
style: {
|
|
19
23
|
width: 1200,
|
|
20
24
|
height: 800
|
|
21
25
|
}
|
|
22
26
|
}, /*#__PURE__*/React.createElement(LivePlayer, {
|
|
23
|
-
list: list
|
|
24
|
-
|
|
27
|
+
list: list,
|
|
28
|
+
onIndexChange: console.log
|
|
29
|
+
})));
|
|
25
30
|
}
|
package/es/ScreenPlayer/demo2.js
CHANGED
|
@@ -28,7 +28,7 @@ import RecordPlayer from './Record';
|
|
|
28
28
|
import moment from 'moment';
|
|
29
29
|
import Service from '../Service';
|
|
30
30
|
import { completionSegments } from './utils';
|
|
31
|
-
var token = "eyJhbGciOiJIUzI1NiJ9.
|
|
31
|
+
var token = "eyJhbGciOiJIUzI1NiJ9.eyJvcmdhbml6YXRpb25JZCI6IjEwMDEwMTAwMDQ0NSIsImV4dCI6MTY2MTY1NjgzMTU3MywidWlkIjoiMTAxMDAwMDAwNjk5IiwidmFsaWRTdGF0ZSI6MTA0NDA2LCJyb2xlSWQiOlsxMDAwMDAxMTA1MTgsMTAwMDAwMTEwNzI4XSwidmFsaWRUaW1lIjoxNzA0MzgzOTk5MDAwLCJvcHRDZW50ZXJJZCI6IjEwMDEwMDAwMDIzMyIsInVzZXJUeXBlIjoxMDA3MDQsImlhdCI6MTY2MTM5NzYzMTU3M30.OWPxfPgFBWqGJaRsYLSAZohn2AarhbkOuWLa1bwgZE4";
|
|
32
32
|
var cids = ['538509097', '539172446'];
|
|
33
33
|
|
|
34
34
|
var query = function query(_ref) {
|
|
@@ -3,10 +3,10 @@
|
|
|
3
3
|
height: 100%;
|
|
4
4
|
box-sizing: border-box;
|
|
5
5
|
user-select: none;
|
|
6
|
+
min-width: 600px;
|
|
6
7
|
}
|
|
7
8
|
.split-screen-player-wrapper .player-layout {
|
|
8
|
-
height: calc(100% -
|
|
9
|
-
border-bottom: 1px solid var(--gray12);
|
|
9
|
+
height: calc(100% - 88px);
|
|
10
10
|
}
|
|
11
11
|
.split-screen-player-wrapper .player-layout .player-with-ext-layout {
|
|
12
12
|
float: left;
|
|
@@ -19,9 +19,64 @@
|
|
|
19
19
|
.split-screen-player-wrapper .player-layout .player-with-ext-layout.player-current-index .lm-player-ext-layout {
|
|
20
20
|
border: 1px solid var(--primary);
|
|
21
21
|
}
|
|
22
|
+
.split-screen-player-wrapper .player-tools-group {
|
|
23
|
+
height: 88px;
|
|
24
|
+
position: relative;
|
|
25
|
+
}
|
|
26
|
+
.split-screen-player-wrapper .player-record-time {
|
|
27
|
+
width: 100%;
|
|
28
|
+
height: 100%;
|
|
29
|
+
text-align: center;
|
|
30
|
+
background-color: var(--gray11);
|
|
31
|
+
line-height: 42px;
|
|
32
|
+
padding: 0 16px;
|
|
33
|
+
font-size: 16px;
|
|
34
|
+
color: var(--gray1);
|
|
35
|
+
margin: 0 20px;
|
|
36
|
+
}
|
|
22
37
|
.split-screen-player-wrapper .player-tools {
|
|
23
38
|
height: 42px;
|
|
24
39
|
background-color: var(--gray12);
|
|
40
|
+
padding: 0 10px;
|
|
41
|
+
display: flex;
|
|
42
|
+
align-items: center;
|
|
43
|
+
justify-content: space-between;
|
|
44
|
+
}
|
|
45
|
+
.split-screen-player-wrapper .player-tools .player-tools-left,
|
|
46
|
+
.split-screen-player-wrapper .player-tools .player-tools-right {
|
|
47
|
+
min-width: 35%;
|
|
48
|
+
display: flex;
|
|
49
|
+
align-items: center;
|
|
50
|
+
}
|
|
51
|
+
.split-screen-player-wrapper .player-tools .player-tools-right {
|
|
52
|
+
justify-content: flex-end;
|
|
53
|
+
margin-right: 0;
|
|
54
|
+
margin-left: 4px;
|
|
55
|
+
}
|
|
56
|
+
.split-screen-player-wrapper .player-tools .player-tools-mid {
|
|
57
|
+
display: flex;
|
|
58
|
+
align-items: center;
|
|
59
|
+
justify-self: center;
|
|
60
|
+
height: 100%;
|
|
61
|
+
}
|
|
62
|
+
.split-screen-player-wrapper .player-tools .player-tools-mid .player-tools-item {
|
|
63
|
+
margin: 0;
|
|
64
|
+
}
|
|
65
|
+
.split-screen-player-wrapper .player-tools .player-tools-item {
|
|
66
|
+
font-size: 18px;
|
|
67
|
+
width: 32px;
|
|
68
|
+
height: 32px;
|
|
69
|
+
color: var(--gray1);
|
|
70
|
+
text-align: center;
|
|
71
|
+
cursor: pointer;
|
|
72
|
+
margin-right: 4px;
|
|
73
|
+
}
|
|
74
|
+
.split-screen-player-wrapper .player-tools .player-tools-item .lm-player-iconfont {
|
|
75
|
+
font-size: 20px;
|
|
76
|
+
}
|
|
77
|
+
.split-screen-player-wrapper .player-tools .player-tools-item:hover {
|
|
78
|
+
background-color: var(--gray11);
|
|
79
|
+
border-radius: var(--radius1);
|
|
25
80
|
}
|
|
26
81
|
.split-screen-player-wrapper.split-screen-player-wrapper-record .record-time-line {
|
|
27
82
|
width: 100%;
|
|
@@ -44,6 +99,9 @@
|
|
|
44
99
|
z-index: 5;
|
|
45
100
|
cursor: not-allowed;
|
|
46
101
|
}
|
|
47
|
-
.
|
|
48
|
-
|
|
102
|
+
.player-time-select {
|
|
103
|
+
width: 190px;
|
|
104
|
+
display: flex;
|
|
105
|
+
justify-content: space-around;
|
|
106
|
+
align-items: center;
|
|
49
107
|
}
|
|
@@ -23,6 +23,19 @@ export interface IRecordPlayerProps {
|
|
|
23
23
|
* 窗口索引变化,后续基于索引传入播放必要数据
|
|
24
24
|
*/
|
|
25
25
|
onIndexChange: (idx: number) => void;
|
|
26
|
+
|
|
27
|
+
/**
|
|
28
|
+
* 关闭单个窗口
|
|
29
|
+
*/
|
|
30
|
+
onClose?: () => void;
|
|
31
|
+
|
|
32
|
+
/**
|
|
33
|
+
* 关闭所有窗口
|
|
34
|
+
*/
|
|
35
|
+
onCloseAll?: () => void;
|
|
36
|
+
/**
|
|
37
|
+
* 窗口索引变化,后续基于索引传入播放必要数据
|
|
38
|
+
*/
|
|
26
39
|
}
|
|
27
40
|
|
|
28
41
|
export interface IRecordPlayerState {
|
|
@@ -70,6 +83,20 @@ export type ScreenItemLivePlayerType = {
|
|
|
70
83
|
export interface ILivePlayerProps {
|
|
71
84
|
list?: ScreenItemLivePlayerType[];
|
|
72
85
|
children?: JSX.Element;
|
|
86
|
+
|
|
87
|
+
/**
|
|
88
|
+
* 关闭单个窗口
|
|
89
|
+
*/
|
|
90
|
+
onClose?: () => void;
|
|
91
|
+
|
|
92
|
+
/**
|
|
93
|
+
* 关闭所有窗口
|
|
94
|
+
*/
|
|
95
|
+
onCloseAll?: () => void;
|
|
96
|
+
/**
|
|
97
|
+
* 窗口索引变化,后续基于索引传入播放必要数据
|
|
98
|
+
*/
|
|
99
|
+
onIndexChange: (idx: number) => void;
|
|
73
100
|
}
|
|
74
101
|
|
|
75
102
|
export interface ILivePlayerState {
|
package/es/Timeout/index.d.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { BasicTarget } from 'ahooks/es/utils/domTarget';
|
|
3
|
-
import 'antd/es/modal/style/css';
|
|
4
3
|
interface ITimeoutProps {
|
|
5
4
|
/**
|
|
6
|
-
|
|
5
|
+
* 容器
|
|
6
|
+
* @default `document.body`
|
|
7
7
|
*/
|
|
8
8
|
contianer?: BasicTarget;
|
|
9
9
|
/**
|
|
@@ -14,20 +14,19 @@ interface ITimeoutProps {
|
|
|
14
14
|
* 超时动作,默认退出登录
|
|
15
15
|
*/
|
|
16
16
|
onTimeout?: () => void;
|
|
17
|
+
/**
|
|
18
|
+
* 忽略的情况
|
|
19
|
+
*/
|
|
20
|
+
ignore?: () => boolean;
|
|
17
21
|
}
|
|
18
22
|
/**
|
|
19
|
-
*
|
|
23
|
+
* @desc 用户创建界面超时回调
|
|
20
24
|
*/
|
|
21
|
-
declare function Timeout({ contianer, time, onTimeout }: ITimeoutProps): JSX.Element;
|
|
25
|
+
declare function Timeout({ contianer, time, onTimeout, ignore }: ITimeoutProps): JSX.Element;
|
|
22
26
|
declare namespace Timeout {
|
|
23
27
|
var defaultProps: {
|
|
24
28
|
time: number;
|
|
25
29
|
contianer: HTMLElement;
|
|
26
|
-
onTimeout: typeof defaultTimeoutAction;
|
|
27
30
|
};
|
|
28
31
|
}
|
|
29
|
-
declare function defaultTimeoutAction(): {
|
|
30
|
-
destroy: () => void;
|
|
31
|
-
update: (configUpdate: import("antd").ModalFuncProps | ((prevConfig: import("antd").ModalFuncProps) => import("antd").ModalFuncProps)) => void;
|
|
32
|
-
};
|
|
33
32
|
export default Timeout;
|