@cloud-app-dev/vidc 4.0.20 → 4.0.22
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/Sync.js +42 -0
- package/es/AppContext/index.js +141 -0
- package/es/AppContext/interface.d.ts +41 -0
- package/es/AppContext/static.js +9 -0
- package/es/Auth/index.js +14 -0
- package/es/AutoExit/index.js +19 -0
- package/es/CheckGroupFixed/demo.js +22 -0
- package/es/CheckGroupFixed/index.js +140 -0
- package/es/CheckGroupFixed/index.less +56 -0
- package/es/Config/index.js +77 -0
- package/es/Config/interface.d.ts +65 -0
- package/es/Config/utils.js +33 -0
- package/es/ConfigContext/index.js +21 -0
- package/es/CustomRenderSelect/index.js +72 -0
- package/es/CustomRenderSelect/index.less +25 -0
- package/es/DBTools/index.js +336 -0
- package/es/DisableMark/index.js +19 -0
- package/es/DisableMark/index.less +9 -0
- package/es/DomMove/demo.js +16 -0
- package/es/DomMove/index.js +139 -0
- package/es/DomMove/utils.js +32 -0
- package/es/Drag/DragAndDropItem.js +133 -0
- package/es/Drag/DropItem.js +50 -0
- package/es/Drag/index.d.ts +9 -0
- package/es/Drag/index.js +7 -0
- package/es/Drag/interface.d.ts +16 -0
- package/es/DynamicGridList/Demo.js +77 -0
- package/es/DynamicGridList/index.js +67 -0
- package/es/DynamicList/demo.js +44 -0
- package/es/DynamicList/index.js +86 -0
- package/es/DynamicList/index.less +17 -0
- package/es/DynamicList/interface.d.ts +19 -0
- package/es/DynamicList/utils.js +6 -0
- package/es/ErrorFallback/index.js +31 -0
- package/es/ErrorFallback/inerface.d.ts +48 -0
- package/es/EventTools/index.js +12 -0
- package/es/FrontendPlayer/index.js +2 -0
- package/es/FullScreen/index.js +33 -0
- package/es/FullScreen/index.less +18 -0
- package/es/GridList/Demo.js +80 -0
- package/es/GridList/data.js +609 -0
- package/es/GridList/hook.js +270 -0
- package/es/GridList/index.js +44 -0
- package/es/GridList/index.less +8 -0
- package/es/GridList/interface.d.ts +59 -0
- package/es/GridList/utils.js +42 -0
- package/es/HightLevel/index.js +18 -0
- package/es/HightLevel/index.less +3 -0
- package/es/IconFont/index.js +54 -0
- package/es/ImageView/index.js +51 -0
- package/es/ImageView/index.less +11 -0
- package/es/InstanceHistory/index.js +7 -0
- package/es/LabelPlayer/111.png +0 -0
- package/es/LabelPlayer/demo.js +115 -0
- package/es/LabelPlayer/index.js +160 -0
- package/es/LabelPlayer/index.less +24 -0
- package/es/LabelValue/index.js +27 -0
- package/es/LabelValue/index.less +23 -0
- package/es/List/demo.js +23 -0
- package/es/List/index.js +28 -0
- package/es/List/index.less +20 -0
- package/es/ListWithSizeAnimate/demo.js +98 -0
- package/es/ListWithSizeAnimate/index.js +85 -0
- package/es/ListWithSizeAnimate/index.less +23 -0
- package/es/LoaderScript/index.js +34 -0
- package/es/LoaderScript/utils.js +179 -0
- package/es/Map/AMap.d.ts +7109 -0
- package/es/Map/BasicMap/AMapInstance.js +98 -0
- package/es/Map/BasicMap/LeafletInstance.js +111 -0
- package/es/Map/BasicMap/index.js +90 -0
- package/es/Map/BasicMap/index.less +29 -0
- package/es/Map/ClusterLayer/demo.js +18 -0
- package/es/Map/ClusterLayer/hook.js +123 -0
- package/es/Map/ClusterLayer/index.js +28 -0
- package/es/Map/ClusterLayer/index.less +29 -0
- package/es/Map/ClusterLayer/props.d.ts +8 -0
- package/es/Map/Config/index.js +48 -0
- package/es/Map/Config/utils.js +65 -0
- package/es/Map/Context/index.js +51 -0
- package/es/Map/FindPio/index.js +13 -0
- package/es/Map/FindPio/index.less +7 -0
- package/es/Map/InfoWindow/MakerLikeWindow.js +108 -0
- package/es/Map/InfoWindow/demo.js +70 -0
- package/es/Map/InfoWindow/index.js +62 -0
- package/es/Map/LevelCenter/DragMarker/index.js +42 -0
- package/es/Map/LevelCenter/demo.js +38 -0
- package/es/Map/LevelCenter/index.js +66 -0
- package/es/Map/LoaderMap/index.js +62 -0
- package/es/Map/MapDrawSelect/demo.js +71 -0
- package/es/Map/MapDrawSelect/index.js +56 -0
- package/es/Map/MouseTool/index.js +40 -0
- package/es/Map/MouseTool/useMouseTools.js +83 -0
- package/es/Map/ResetTools/index.js +57 -0
- package/es/Map/ResetTools/index.less +39 -0
- package/es/Map/SinglePoint/demo.js +14 -0
- package/es/Map/SinglePoint/index.js +52 -0
- package/es/Map/SinglePoint/index.less +41 -0
- package/es/Map/hook/useMapEvent.js +19 -0
- package/es/Map/hook/useMapType.js +12 -0
- package/es/Map/icon.js +10 -0
- package/es/Map/index.js +25 -0
- package/es/Map/interface.d.ts +74 -0
- package/es/Map/points.js +1 -0
- package/es/Map/useMarker/index.js +71 -0
- package/es/Map/withMap/index.js +10 -0
- package/es/Picture/component/DefaultRects/RectInfo.js +80 -0
- package/es/Picture/component/DefaultRects/index.js +52 -0
- package/es/Picture/component/DefaultRects/index.less +211 -0
- package/es/Picture/component/DefaultRects/utils.js +11 -0
- package/es/Picture/component/DrawRect/index.js +46 -0
- package/es/Picture/component/DrawRect/index.less +8 -0
- package/es/Picture/component/RectMenu/index.js +76 -0
- package/es/Picture/component/RectMenu/index.less +36 -0
- package/es/Picture/component/RectMenu/utils.js +19 -0
- package/es/Picture/component/Tools/index.js +73 -0
- package/es/Picture/component/Tools/index.less +49 -0
- package/es/Picture/component/WheelScale/index.js +27 -0
- package/es/Picture/demo.js +105 -0
- package/es/Picture/index.js +341 -0
- package/es/Picture/index.less +20 -0
- package/es/Picture/interface.d.ts +196 -0
- package/es/Picture/loadCaptureRectImage.js +99 -0
- package/es/Picture/useDraw.js +103 -0
- package/es/Picture/utils.js +143 -0
- package/es/Player/api/index.js +309 -0
- package/es/Player/context.js +24 -0
- package/es/Player/contraller_bar/bar.js +20 -0
- package/es/Player/contraller_bar/contraller_event.js +48 -0
- package/es/Player/contraller_bar/index.js +27 -0
- package/es/Player/contraller_bar/left_bar.js +83 -0
- package/es/Player/contraller_bar/right_bar.js +32 -0
- package/es/Player/contraller_bar/time.js +19 -0
- package/es/Player/contraller_bar/useBarStatus.js +43 -0
- package/es/Player/contraller_bar/volume.js +62 -0
- package/es/Player/demo.js +266 -0
- package/es/Player/empty.js +4 -0
- package/es/Player/event/errorEvent.js +88 -0
- package/es/Player/event/eventName.js +29 -0
- package/es/Player/event/index.js +205 -0
- package/es/Player/fps_play.js +83 -0
- package/es/Player/frontend_player.js +64 -0
- package/es/Player/frontend_timeline.js +132 -0
- package/es/Player/iconfont.js +16 -0
- package/es/Player/index.js +2 -0
- package/es/Player/live_heart.js +45 -0
- package/es/Player/message.js +133 -0
- package/es/Player/player.d.ts +233 -0
- package/es/Player/segment_player.js +228 -0
- package/es/Player/segment_timeline.js +173 -0
- package/es/Player/single_player.js +262 -0
- package/es/Player/style/bar.less +43 -0
- package/es/Player/style/iconfont.js +43 -0
- package/es/Player/style/index.less +34 -0
- package/es/Player/style/message.less +56 -0
- package/es/Player/style/slider.less +106 -0
- package/es/Player/style/timeline.less +117 -0
- package/es/Player/style/volume.less +24 -0
- package/es/Player/timeline.js +95 -0
- package/es/Player/util.js +189 -0
- package/es/PlayerExt/demo.js +154 -0
- package/es/PlayerExt/index.js +188 -0
- package/es/PlayerExt/index.less +10 -0
- package/es/Progress/index.d.ts +9 -0
- package/es/Progress/index.js +53 -0
- package/es/Progress/index.less +21 -0
- package/es/ROI/demo.js +16 -0
- package/es/ROI/index.js +54 -0
- package/es/ROI/index.less +33 -0
- package/es/RefDrawer/Footer.js +22 -0
- package/es/RefDrawer/demo.js +18 -0
- package/es/RefDrawer/index.js +71 -0
- package/es/RefModal/demo.js +18 -0
- package/es/RefModal/index.js +70 -0
- package/es/ScreenPlayer/Live.js +212 -0
- package/es/ScreenPlayer/LiveTools.js +151 -0
- package/es/ScreenPlayer/PlayerWithExt.js +231 -0
- package/es/ScreenPlayer/RatePick.js +29 -0
- package/es/ScreenPlayer/Record.js +442 -0
- package/es/ScreenPlayer/RecordTools.js +169 -0
- package/es/ScreenPlayer/ScreenSelect.js +46 -0
- package/es/ScreenPlayer/SegmentTimeLine.js +36 -0
- package/es/ScreenPlayer/TimeMode.js +26 -0
- package/es/ScreenPlayer/TimeSelect.js +88 -0
- package/es/ScreenPlayer/demo.js +21 -0
- package/es/ScreenPlayer/demo2.js +194 -0
- package/es/ScreenPlayer/index.js +9 -0
- package/es/ScreenPlayer/index.less +335 -0
- package/es/ScreenPlayer/interface.d.ts +216 -0
- package/es/ScreenPlayer/useTimeSlider.js +456 -0
- package/es/ScreenPlayer/useVideoFit.js +35 -0
- package/es/ScreenPlayer/utils.js +85 -0
- package/es/SegmentPlayer/index.js +2 -0
- package/es/Service/http.js +133 -0
- package/es/Service/index.js +11 -0
- package/es/Service/interface.d.ts +23 -0
- package/es/Service/middleware.js +22 -0
- package/es/SocketEmitter/eventEmitter.js +88 -0
- package/es/SocketEmitter/index.js +125 -0
- package/es/SocketEmitter/interface.d.ts +4 -0
- package/es/TableLayout/index.js +27 -0
- package/es/TableLayout/index.less +4 -0
- package/es/ThemeAntd/demo.js +81 -0
- package/es/ThemeAntd/demo.less +20 -0
- package/es/ThemeAntd/index.js +21 -0
- package/es/ThemeAntd/index.less +4 -0
- package/es/Timeout/index.js +65 -0
- package/es/bigNumberTransformCN/index.js +58 -0
- package/es/cache/index.js +94 -0
- package/es/copy/index.js +9 -0
- package/es/core.d.ts +0 -0
- package/es/getThemeStyle/index.js +5 -0
- package/es/index.js +62 -0
- package/es/likeGo/index.js +31 -0
- package/es/likeGoSync/index.js +10 -0
- package/es/logger/index.js +30 -0
- package/es/nextTick/index.js +3 -0
- package/es/recorder/demo.js +181 -0
- package/es/recorder/index.js +992 -0
- package/es/submidstr/index.js +14 -0
- package/es/treeHelper/index.js +188 -0
- package/es/typings.d.ts +2 -0
- package/es/useDrawROI/index.js +318 -0
- package/es/useEventEmitterHandle/index.js +17 -0
- package/es/useFullscreen/demo.js +43 -0
- package/es/useFullscreen/index.js +76 -0
- package/es/useHistory/index.js +9 -0
- package/es/useHistory/interface.d.ts +3 -0
- package/es/useInfiniteScroll/index.js +102 -0
- package/es/useRafInterval/index.js +70 -0
- package/es/useSimpleState/index.js +35 -0
- package/es/useVirtualList/index.js +136 -0
- package/es/utils.js +46 -0
- package/es/uuid/index.js +19 -0
- package/package.json +2 -3
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
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."); }
|
|
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); }
|
|
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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
6
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
|
+
import { useUpdate, useUpdateEffect } from 'ahooks';
|
|
8
|
+
import { Slider, Tooltip } from 'antd';
|
|
9
|
+
import React, { useMemo, useState } from 'react';
|
|
10
|
+
import IconFont from "../iconfont";
|
|
11
|
+
import "../style/volume.less";
|
|
12
|
+
function Volume(_ref) {
|
|
13
|
+
var _api$getVolume;
|
|
14
|
+
var api = _ref.api,
|
|
15
|
+
style = _ref.style;
|
|
16
|
+
var _useState = useState(Math.round((_api$getVolume = api === null || api === void 0 ? void 0 : api.getVolume()) !== null && _api$getVolume !== void 0 ? _api$getVolume : 0 * 100)),
|
|
17
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
18
|
+
val = _useState2[0],
|
|
19
|
+
setVal = _useState2[1];
|
|
20
|
+
var update = useUpdate();
|
|
21
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
22
|
+
var volume = useMemo(function () {
|
|
23
|
+
return api !== null && api !== void 0 && api.muted ? 0 : val;
|
|
24
|
+
}, undefined);
|
|
25
|
+
var onChange = function onChange(num) {
|
|
26
|
+
if (api !== null && api !== void 0 && api.muted) {
|
|
27
|
+
api === null || api === void 0 || api.unmute();
|
|
28
|
+
}
|
|
29
|
+
setVal(num);
|
|
30
|
+
update();
|
|
31
|
+
};
|
|
32
|
+
var toggleMuted = function toggleMuted() {
|
|
33
|
+
if (!api) {
|
|
34
|
+
return;
|
|
35
|
+
}
|
|
36
|
+
if (api.muted) {
|
|
37
|
+
api.unmute();
|
|
38
|
+
setVal(100);
|
|
39
|
+
} else {
|
|
40
|
+
api.mute();
|
|
41
|
+
setVal(0);
|
|
42
|
+
}
|
|
43
|
+
update();
|
|
44
|
+
};
|
|
45
|
+
useUpdateEffect(function () {
|
|
46
|
+
return api === null || api === void 0 ? void 0 : api.setVolume(val / 100);
|
|
47
|
+
}, [val]);
|
|
48
|
+
return /*#__PURE__*/React.createElement(Tooltip, {
|
|
49
|
+
arrow: false,
|
|
50
|
+
overlayClassName: "lm-player-volume-popup",
|
|
51
|
+
title: /*#__PURE__*/React.createElement(Slider, {
|
|
52
|
+
onChange: onChange,
|
|
53
|
+
vertical: true,
|
|
54
|
+
value: val
|
|
55
|
+
})
|
|
56
|
+
}, /*#__PURE__*/React.createElement(IconFont, {
|
|
57
|
+
style: style,
|
|
58
|
+
type: volume !== 0 ? 'lm-player-volume-open' : 'lm-player-volume-close',
|
|
59
|
+
onClick: toggleMuted
|
|
60
|
+
}));
|
|
61
|
+
}
|
|
62
|
+
export default /*#__PURE__*/React.memo(Volume);
|
|
@@ -0,0 +1,266 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
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(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
6
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
7
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
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."); }
|
|
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); }
|
|
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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
12
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
13
|
+
import { Button, ConfigProvider, Input, Select } from 'antd';
|
|
14
|
+
import moment from 'dayjs';
|
|
15
|
+
import React, { useState } from 'react';
|
|
16
|
+
import FrontendPlayer from "./frontend_player";
|
|
17
|
+
import SegmentPlayer from "./segment_player";
|
|
18
|
+
import Player from "./single_player";
|
|
19
|
+
var options = [{
|
|
20
|
+
value: '',
|
|
21
|
+
label: '自动'
|
|
22
|
+
}, {
|
|
23
|
+
value: 'flv',
|
|
24
|
+
label: 'FLV'
|
|
25
|
+
}, {
|
|
26
|
+
value: 'hls',
|
|
27
|
+
label: 'HLS'
|
|
28
|
+
}];
|
|
29
|
+
var options2 = [{
|
|
30
|
+
value: 1,
|
|
31
|
+
label: '直播'
|
|
32
|
+
}, {
|
|
33
|
+
value: 0,
|
|
34
|
+
label: '录像'
|
|
35
|
+
}];
|
|
36
|
+
function Demo1() {
|
|
37
|
+
var _useState = useState({
|
|
38
|
+
type: undefined,
|
|
39
|
+
isLive: 1,
|
|
40
|
+
url: 'http://192.168.14.4:17095/flv/live/1bfa0ef04688adf36/1.flv?trace_id=8f7fae97-8434-4dd4-a856-114378fdb61d3',
|
|
41
|
+
tempUrl: ''
|
|
42
|
+
}),
|
|
43
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
44
|
+
state = _useState2[0],
|
|
45
|
+
setState = _useState2[1];
|
|
46
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
47
|
+
style: {
|
|
48
|
+
width: '100%'
|
|
49
|
+
}
|
|
50
|
+
}, /*#__PURE__*/React.createElement("h3", null, "\u6807\u51C6\u89C6\u9891\u64AD\u653E"), /*#__PURE__*/React.createElement("div", {
|
|
51
|
+
style: {
|
|
52
|
+
marginBottom: 10,
|
|
53
|
+
display: 'flex'
|
|
54
|
+
}
|
|
55
|
+
}, /*#__PURE__*/React.createElement(Select, {
|
|
56
|
+
value: state.type || '',
|
|
57
|
+
onChange: function onChange(val) {
|
|
58
|
+
return setState(function (old) {
|
|
59
|
+
return _objectSpread(_objectSpread({}, old), {}, {
|
|
60
|
+
type: val
|
|
61
|
+
});
|
|
62
|
+
});
|
|
63
|
+
}
|
|
64
|
+
}, options.map(function (v) {
|
|
65
|
+
return /*#__PURE__*/React.createElement(Select.Option, {
|
|
66
|
+
key: v.label,
|
|
67
|
+
value: v.value
|
|
68
|
+
}, v.label);
|
|
69
|
+
})), /*#__PURE__*/React.createElement(Input, {
|
|
70
|
+
style: {
|
|
71
|
+
flex: 1,
|
|
72
|
+
height: 32
|
|
73
|
+
},
|
|
74
|
+
type: "text",
|
|
75
|
+
placeholder: "\u8BF7\u8F93\u5165\u89C6\u9891\u5730\u5740",
|
|
76
|
+
onChange: function onChange(e) {
|
|
77
|
+
return setState(function (old) {
|
|
78
|
+
return _objectSpread(_objectSpread({}, old), {}, {
|
|
79
|
+
tempUrl: e.target.value
|
|
80
|
+
});
|
|
81
|
+
});
|
|
82
|
+
}
|
|
83
|
+
}), /*#__PURE__*/React.createElement(Select, {
|
|
84
|
+
value: state.isLive,
|
|
85
|
+
onChange: function onChange(val) {
|
|
86
|
+
return setState(function (old) {
|
|
87
|
+
return _objectSpread(_objectSpread({}, old), {}, {
|
|
88
|
+
isLive: val
|
|
89
|
+
});
|
|
90
|
+
});
|
|
91
|
+
}
|
|
92
|
+
}, options2.map(function (v) {
|
|
93
|
+
return /*#__PURE__*/React.createElement(Select.Option, {
|
|
94
|
+
key: v.label,
|
|
95
|
+
value: v.value
|
|
96
|
+
}, v.label);
|
|
97
|
+
})), /*#__PURE__*/React.createElement(Button, {
|
|
98
|
+
style: {
|
|
99
|
+
width: 60,
|
|
100
|
+
height: 32
|
|
101
|
+
},
|
|
102
|
+
onClick: function onClick() {
|
|
103
|
+
return setState(function (old) {
|
|
104
|
+
return _objectSpread(_objectSpread({}, old), {}, {
|
|
105
|
+
url: state.tempUrl
|
|
106
|
+
});
|
|
107
|
+
});
|
|
108
|
+
}
|
|
109
|
+
}, "\u64AD\u653E")), /*#__PURE__*/React.createElement("div", {
|
|
110
|
+
style: {
|
|
111
|
+
height: 600
|
|
112
|
+
}
|
|
113
|
+
}, /*#__PURE__*/React.createElement(Player, {
|
|
114
|
+
fpsDelay: 800,
|
|
115
|
+
oneFpsPlay: true,
|
|
116
|
+
type: state.type,
|
|
117
|
+
url: state.url,
|
|
118
|
+
isLive: !!state.isLive,
|
|
119
|
+
customTimeLine: state.isLive ? /*#__PURE__*/React.createElement(React.Fragment, null) : undefined
|
|
120
|
+
})));
|
|
121
|
+
}
|
|
122
|
+
var mm = moment().set('hours', 0).set('minutes', 0).set('seconds', 0);
|
|
123
|
+
var m = mm.clone();
|
|
124
|
+
function Demo2() {
|
|
125
|
+
var _useState3 = useState({
|
|
126
|
+
isLive: 1,
|
|
127
|
+
segments: [{
|
|
128
|
+
beginTime: m.valueOf(),
|
|
129
|
+
endTime: m.set('minutes', 1).valueOf(),
|
|
130
|
+
url: 'http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4'
|
|
131
|
+
}, {
|
|
132
|
+
beginTime: m.set('minutes', 1).valueOf(),
|
|
133
|
+
endTime: m.set('minutes', 2).valueOf()
|
|
134
|
+
}, {
|
|
135
|
+
beginTime: m.set('minutes', 2).valueOf(),
|
|
136
|
+
endTime: m.set('minutes', 3).valueOf(),
|
|
137
|
+
url: 'http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4?date=1'
|
|
138
|
+
}, {
|
|
139
|
+
beginTime: m.set('minutes', 3).valueOf(),
|
|
140
|
+
endTime: m.set('minutes', 4).valueOf()
|
|
141
|
+
}, {
|
|
142
|
+
beginTime: m.set('minutes', 4).valueOf(),
|
|
143
|
+
endTime: m.set('minutes', 5).valueOf(),
|
|
144
|
+
url: 'http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4?date=2'
|
|
145
|
+
}],
|
|
146
|
+
tempUrl: ''
|
|
147
|
+
}),
|
|
148
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
149
|
+
state = _useState4[0],
|
|
150
|
+
setState = _useState4[1];
|
|
151
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
152
|
+
style: {
|
|
153
|
+
width: '100%',
|
|
154
|
+
marginTop: 20
|
|
155
|
+
}
|
|
156
|
+
}, /*#__PURE__*/React.createElement("h3", null, " Sements\u89C6\u9891\u64AD\u653E"), /*#__PURE__*/React.createElement("div", {
|
|
157
|
+
style: {
|
|
158
|
+
marginBottom: 10,
|
|
159
|
+
display: 'flex'
|
|
160
|
+
}
|
|
161
|
+
}, /*#__PURE__*/React.createElement(Input, {
|
|
162
|
+
style: {
|
|
163
|
+
flex: 1,
|
|
164
|
+
height: 32
|
|
165
|
+
},
|
|
166
|
+
type: "text",
|
|
167
|
+
placeholder: "\u8BF7\u8F93\u5165\u89C6\u9891\u7247\u6BB5JSON",
|
|
168
|
+
onChange: function onChange(e) {
|
|
169
|
+
return setState(function (old) {
|
|
170
|
+
return _objectSpread(_objectSpread({}, old), {}, {
|
|
171
|
+
tempUrl: e.target.value
|
|
172
|
+
});
|
|
173
|
+
});
|
|
174
|
+
}
|
|
175
|
+
}), /*#__PURE__*/React.createElement(Button, {
|
|
176
|
+
style: {
|
|
177
|
+
width: 60,
|
|
178
|
+
height: 32
|
|
179
|
+
},
|
|
180
|
+
onClick: function onClick() {
|
|
181
|
+
return setState(function (old) {
|
|
182
|
+
return _objectSpread(_objectSpread({}, old), {}, {
|
|
183
|
+
segments: JSON.parse(state.tempUrl)
|
|
184
|
+
});
|
|
185
|
+
});
|
|
186
|
+
}
|
|
187
|
+
}, "\u64AD\u653E")), /*#__PURE__*/React.createElement("div", {
|
|
188
|
+
style: {
|
|
189
|
+
height: 600
|
|
190
|
+
}
|
|
191
|
+
}, /*#__PURE__*/React.createElement(SegmentPlayer, {
|
|
192
|
+
oneFpsPlay: true,
|
|
193
|
+
begin: mm.valueOf(),
|
|
194
|
+
segments: state.segments,
|
|
195
|
+
isLive: false
|
|
196
|
+
})));
|
|
197
|
+
}
|
|
198
|
+
function Demo3() {
|
|
199
|
+
var _useState5 = useState({
|
|
200
|
+
url: 'http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4',
|
|
201
|
+
tempUrl: '',
|
|
202
|
+
begin: 1652889636000,
|
|
203
|
+
end: 1652890200000
|
|
204
|
+
}),
|
|
205
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
206
|
+
state = _useState6[0],
|
|
207
|
+
setState = _useState6[1];
|
|
208
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
209
|
+
style: {
|
|
210
|
+
marginTop: 20
|
|
211
|
+
}
|
|
212
|
+
}, /*#__PURE__*/React.createElement("h3", null, " \u524D\u7AEF\u5F55\u50CF\u89C6\u9891\u64AD\u653E"), /*#__PURE__*/React.createElement("div", {
|
|
213
|
+
style: {
|
|
214
|
+
marginBottom: 10,
|
|
215
|
+
display: 'flex'
|
|
216
|
+
}
|
|
217
|
+
}, /*#__PURE__*/React.createElement(Input, {
|
|
218
|
+
style: {
|
|
219
|
+
flex: 1,
|
|
220
|
+
height: 32
|
|
221
|
+
},
|
|
222
|
+
type: "text",
|
|
223
|
+
placeholder: "\u8BF7\u8F93\u5165\u524D\u7AEF\u5F55\u50CF\u5730\u5740",
|
|
224
|
+
onChange: function onChange(e) {
|
|
225
|
+
return setState(function (old) {
|
|
226
|
+
return _objectSpread(_objectSpread({}, old), {}, {
|
|
227
|
+
tempUrl: e.target.value
|
|
228
|
+
});
|
|
229
|
+
});
|
|
230
|
+
}
|
|
231
|
+
}), /*#__PURE__*/React.createElement(Button, {
|
|
232
|
+
style: {
|
|
233
|
+
width: 60,
|
|
234
|
+
height: 32
|
|
235
|
+
},
|
|
236
|
+
onClick: function onClick() {
|
|
237
|
+
return setState(function (old) {
|
|
238
|
+
return _objectSpread(_objectSpread({}, old), {}, {
|
|
239
|
+
url: state.tempUrl
|
|
240
|
+
});
|
|
241
|
+
});
|
|
242
|
+
}
|
|
243
|
+
}, "\u64AD\u653E")), /*#__PURE__*/React.createElement("div", {
|
|
244
|
+
style: {
|
|
245
|
+
height: 600
|
|
246
|
+
}
|
|
247
|
+
}, /*#__PURE__*/React.createElement(FrontendPlayer, {
|
|
248
|
+
begin: state.begin,
|
|
249
|
+
end: state.end,
|
|
250
|
+
url: state.url,
|
|
251
|
+
onSeek: function onSeek(time) {
|
|
252
|
+
return setState(function (old) {
|
|
253
|
+
return _objectSpread(_objectSpread({}, old), {}, {
|
|
254
|
+
url: "".concat(old.url, "?").concat(time)
|
|
255
|
+
});
|
|
256
|
+
});
|
|
257
|
+
},
|
|
258
|
+
type: "native"
|
|
259
|
+
})));
|
|
260
|
+
}
|
|
261
|
+
var App = function App() {
|
|
262
|
+
return /*#__PURE__*/React.createElement(ConfigProvider, {
|
|
263
|
+
prefixCls: "cloudapp"
|
|
264
|
+
}, /*#__PURE__*/React.createElement(Demo1, null), /*#__PURE__*/React.createElement(Demo2, null), /*#__PURE__*/React.createElement(Demo3, null));
|
|
265
|
+
};
|
|
266
|
+
export default App;
|
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
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."); }
|
|
3
|
+
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
4
|
+
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
5
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
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."); }
|
|
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); }
|
|
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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
10
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
11
|
+
import Flvjs from '@cloud-app-dev/mpegts.js';
|
|
12
|
+
import Hls from 'hls.js';
|
|
13
|
+
import { useEffect, useRef, useState } from 'react';
|
|
14
|
+
import { useRegisterPlayerEvent, useVideoEvent } from '.';
|
|
15
|
+
import EventName from "./eventName";
|
|
16
|
+
function useErrorEvent(_ref) {
|
|
17
|
+
var event = _ref.event,
|
|
18
|
+
reload = _ref.reload,
|
|
19
|
+
unload = _ref.unload,
|
|
20
|
+
errorReloadTimer = _ref.errorReloadTimer,
|
|
21
|
+
flv = _ref.flv,
|
|
22
|
+
hls = _ref.hls,
|
|
23
|
+
errorHandleAdapter = _ref.errorHandleAdapter;
|
|
24
|
+
var _useState = useState(0),
|
|
25
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
26
|
+
errorTimer = _useState2[0],
|
|
27
|
+
setErrorTime = _useState2[1];
|
|
28
|
+
var errorInfo = useRef(null);
|
|
29
|
+
var reloadTimer = useRef();
|
|
30
|
+
var errorHandle = function errorHandle() {
|
|
31
|
+
var _console;
|
|
32
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
33
|
+
args[_key] = arguments[_key];
|
|
34
|
+
}
|
|
35
|
+
if (args[2] && args[2].msg && args[2].msg.includes('Unsupported audio')) {
|
|
36
|
+
return;
|
|
37
|
+
}
|
|
38
|
+
(_console = console).error.apply(_console, args);
|
|
39
|
+
errorInfo.current = args;
|
|
40
|
+
if (!(errorHandleAdapter !== null && errorHandleAdapter !== void 0 && errorHandleAdapter(args))) {
|
|
41
|
+
setErrorTime(errorTimer + 1);
|
|
42
|
+
}
|
|
43
|
+
};
|
|
44
|
+
var clearErrorTimer = function clearErrorTimer() {
|
|
45
|
+
return setErrorTime(0);
|
|
46
|
+
};
|
|
47
|
+
var reloadSuccess = function reloadSuccess() {
|
|
48
|
+
if (errorTimer > 0) {
|
|
49
|
+
console.warn('视频重连成功!');
|
|
50
|
+
event === null || event === void 0 || event.emit(EventName.RELOAD_SUCCESS);
|
|
51
|
+
clearErrorTimer();
|
|
52
|
+
}
|
|
53
|
+
};
|
|
54
|
+
useVideoEvent('error', errorHandle, event);
|
|
55
|
+
useVideoEvent('canplay', reloadSuccess, event);
|
|
56
|
+
useRegisterPlayerEvent(EventName.ERROR, errorHandle, event);
|
|
57
|
+
useRegisterPlayerEvent(EventName.CLEAR_ERROR_TIMER, clearErrorTimer, event);
|
|
58
|
+
useEffect(function () {
|
|
59
|
+
if (flv) {
|
|
60
|
+
flv.on(Flvjs.Events.ERROR, errorHandle);
|
|
61
|
+
}
|
|
62
|
+
if (hls) {
|
|
63
|
+
hls.on(Hls.Events.ERROR, errorHandle);
|
|
64
|
+
}
|
|
65
|
+
//事件销毁由flv、hls销毁时控制
|
|
66
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
67
|
+
}, [flv, hls]);
|
|
68
|
+
useEffect(function () {
|
|
69
|
+
if (errorTimer === 0) {
|
|
70
|
+
return undefined;
|
|
71
|
+
}
|
|
72
|
+
if (errorTimer > errorReloadTimer) {
|
|
73
|
+
unload();
|
|
74
|
+
event === null || event === void 0 || event.emit(EventName.RELOAD_FAIL);
|
|
75
|
+
return undefined;
|
|
76
|
+
}
|
|
77
|
+
console.warn("\u89C6\u9891\u64AD\u653E\u51FA\u9519\uFF0C\u6B63\u5728\u8FDB\u884C\u91CD\u8FDE".concat(errorTimer));
|
|
78
|
+
reloadTimer.current = setTimeout(function () {
|
|
79
|
+
event === null || event === void 0 || event.emit.apply(event, [EventName.ERROR_RELOAD, errorTimer].concat(_toConsumableArray(errorInfo.current)));
|
|
80
|
+
reload();
|
|
81
|
+
}, 2 * 1000);
|
|
82
|
+
return function () {
|
|
83
|
+
clearTimeout(reloadTimer.current);
|
|
84
|
+
};
|
|
85
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
86
|
+
}, [errorTimer, event, flv, hls]);
|
|
87
|
+
}
|
|
88
|
+
export default useErrorEvent;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
var Events = {
|
|
2
|
+
RELOAD: 'reload',
|
|
3
|
+
//手动视频重载
|
|
4
|
+
RELOAD_FAIL: 'reloadFail',
|
|
5
|
+
// 视频出错,重连失败
|
|
6
|
+
RELOAD_SUCCESS: 'reloadSuccess',
|
|
7
|
+
//视频出错,重连成功
|
|
8
|
+
ERROR: 'error',
|
|
9
|
+
//视频出错
|
|
10
|
+
ERROR_RELOAD: 'errorRload',
|
|
11
|
+
//视频出错,自动重连
|
|
12
|
+
HISTORY_PLAY_END: 'historyPlayEnd',
|
|
13
|
+
//历史视频列表播放结束
|
|
14
|
+
PLAY_ENDED: 'play_ended',
|
|
15
|
+
//单个片断播放完毕
|
|
16
|
+
SEEK: 'seek',
|
|
17
|
+
//跳跃播放时间
|
|
18
|
+
TRANSFORM: 'transform',
|
|
19
|
+
//视频容器缩放
|
|
20
|
+
CHANGE_PLAY_INDEX: 'changePlayIndex',
|
|
21
|
+
//历史视频列表播放索引改变
|
|
22
|
+
HIDE_CONTRALLER: 'hideContraller',
|
|
23
|
+
SHOW_CONTRALLER: 'showContraller',
|
|
24
|
+
CLEAR_ERROR_TIMER: 'clearErrorTimer',
|
|
25
|
+
CANVAS_PAUSE: 'canvasPause',
|
|
26
|
+
// 逐帧暂停
|
|
27
|
+
CANVAS_PLAY: 'canvasPlay' //逐帧播放
|
|
28
|
+
};
|
|
29
|
+
export default Events;
|
|
@@ -0,0 +1,205 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
3
|
+
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
|
+
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); }
|
|
5
|
+
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; }
|
|
6
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
7
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
8
|
+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
9
|
+
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
|
|
10
|
+
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
|
11
|
+
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; }
|
|
12
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
13
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
14
|
+
/* eslint-disable @typescript-eslint/no-unused-expressions */
|
|
15
|
+
import { useLatest } from 'ahooks';
|
|
16
|
+
import { useContext, useEffect, useMemo, useState } from 'react';
|
|
17
|
+
import nextTick from "../../nextTick";
|
|
18
|
+
import { Context } from "../context";
|
|
19
|
+
var VideoEventInstance = /*#__PURE__*/function () {
|
|
20
|
+
function VideoEventInstance(video) {
|
|
21
|
+
_classCallCheck(this, VideoEventInstance);
|
|
22
|
+
_defineProperty(this, "video", void 0);
|
|
23
|
+
_defineProperty(this, "events", void 0);
|
|
24
|
+
_defineProperty(this, "playerEvents", void 0);
|
|
25
|
+
this.video = video;
|
|
26
|
+
this.events = {};
|
|
27
|
+
this.playerEvents = {};
|
|
28
|
+
}
|
|
29
|
+
_createClass(VideoEventInstance, [{
|
|
30
|
+
key: "on",
|
|
31
|
+
value: function on(eventName, handle) {
|
|
32
|
+
this.events && this.events[eventName] ? this.events[eventName].listener.push(handle) : this.events[eventName] = {
|
|
33
|
+
type: eventName,
|
|
34
|
+
listener: [handle]
|
|
35
|
+
};
|
|
36
|
+
}
|
|
37
|
+
}, {
|
|
38
|
+
key: "addEventListener",
|
|
39
|
+
value: function addEventListener(eventName, handle) {
|
|
40
|
+
if (this.video) {
|
|
41
|
+
this.playerEvents[eventName] ? this.playerEvents[eventName].push(handle) : this.playerEvents[eventName] = [handle];
|
|
42
|
+
this.video.addEventListener(eventName, handle, false);
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
}, {
|
|
46
|
+
key: "removeEventListener",
|
|
47
|
+
value: function removeEventListener(eventName, handle) {
|
|
48
|
+
if (this.video) {
|
|
49
|
+
if (!this.playerEvents || !this.playerEvents[eventName]) {
|
|
50
|
+
return;
|
|
51
|
+
}
|
|
52
|
+
var index = this.playerEvents[eventName].findIndex(function (v) {
|
|
53
|
+
return v === handle;
|
|
54
|
+
});
|
|
55
|
+
index > -1 && this.playerEvents[eventName].splice(index, 1);
|
|
56
|
+
this.video.removeEventListener(eventName, handle, false);
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
}, {
|
|
60
|
+
key: "emit",
|
|
61
|
+
value: function emit(eventName) {
|
|
62
|
+
for (var _len = arguments.length, data = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
63
|
+
data[_key - 1] = arguments[_key];
|
|
64
|
+
}
|
|
65
|
+
if (!this.events || !this.events[eventName]) {
|
|
66
|
+
return;
|
|
67
|
+
}
|
|
68
|
+
this.events[eventName].listener.forEach(function (v) {
|
|
69
|
+
v.apply(void 0, data);
|
|
70
|
+
});
|
|
71
|
+
}
|
|
72
|
+
}, {
|
|
73
|
+
key: "off",
|
|
74
|
+
value: function off(eventName, handle) {
|
|
75
|
+
if (!this.events || !this.events.eventName) {
|
|
76
|
+
return;
|
|
77
|
+
}
|
|
78
|
+
var index = this.events[eventName].listener.findIndex(function (v) {
|
|
79
|
+
return v === handle;
|
|
80
|
+
});
|
|
81
|
+
index > -1 && this.events[eventName].listener.splice(index, 1);
|
|
82
|
+
}
|
|
83
|
+
}, {
|
|
84
|
+
key: "destroy",
|
|
85
|
+
value: function destroy() {
|
|
86
|
+
var _this = this;
|
|
87
|
+
Object.keys(this.playerEvents).forEach(function (key) {
|
|
88
|
+
_this.playerEvents[key].forEach(function (fn) {
|
|
89
|
+
_this.removeEventListener(key, fn);
|
|
90
|
+
});
|
|
91
|
+
});
|
|
92
|
+
this.playerEvents = {};
|
|
93
|
+
this.events = {};
|
|
94
|
+
this.video = null;
|
|
95
|
+
}
|
|
96
|
+
}]);
|
|
97
|
+
return VideoEventInstance;
|
|
98
|
+
}();
|
|
99
|
+
export function usePlayerEvent(video) {
|
|
100
|
+
var _useState = useState(undefined),
|
|
101
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
102
|
+
event = _useState2[0],
|
|
103
|
+
setEvent = _useState2[1];
|
|
104
|
+
useEffect(function () {
|
|
105
|
+
if (!video) {
|
|
106
|
+
console.debug('wait create event...');
|
|
107
|
+
return undefined;
|
|
108
|
+
}
|
|
109
|
+
var event = new VideoEventInstance(video);
|
|
110
|
+
setEvent(event);
|
|
111
|
+
return function () {
|
|
112
|
+
return nextTick(function () {
|
|
113
|
+
return event.destroy();
|
|
114
|
+
});
|
|
115
|
+
};
|
|
116
|
+
}, [video]);
|
|
117
|
+
return event;
|
|
118
|
+
}
|
|
119
|
+
export function useVideoEvent(eventName, handle, context) {
|
|
120
|
+
var ctx = useContext(Context);
|
|
121
|
+
var event = useMemo(function () {
|
|
122
|
+
var _ctx$event;
|
|
123
|
+
return (_ctx$event = ctx === null || ctx === void 0 ? void 0 : ctx.event) !== null && _ctx$event !== void 0 ? _ctx$event : context;
|
|
124
|
+
}, [context, ctx === null || ctx === void 0 ? void 0 : ctx.event]);
|
|
125
|
+
var handlerRef = useLatest(handle);
|
|
126
|
+
useEffect(function () {
|
|
127
|
+
if (!event) {
|
|
128
|
+
return undefined;
|
|
129
|
+
}
|
|
130
|
+
var eventListener = function eventListener(event) {
|
|
131
|
+
return handlerRef.current(event);
|
|
132
|
+
};
|
|
133
|
+
event.addEventListener(eventName, eventListener);
|
|
134
|
+
return function () {
|
|
135
|
+
return event.removeEventListener(eventName, eventListener);
|
|
136
|
+
};
|
|
137
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
138
|
+
}, [event, eventName]);
|
|
139
|
+
}
|
|
140
|
+
export function useRegisterPlayerEvent(eventName, handle, context) {
|
|
141
|
+
var ctx = useContext(Context);
|
|
142
|
+
var event = useMemo(function () {
|
|
143
|
+
var _ctx$event2;
|
|
144
|
+
return (_ctx$event2 = ctx === null || ctx === void 0 ? void 0 : ctx.event) !== null && _ctx$event2 !== void 0 ? _ctx$event2 : context;
|
|
145
|
+
}, [context, ctx === null || ctx === void 0 ? void 0 : ctx.event]);
|
|
146
|
+
var handlerRef = useLatest(handle);
|
|
147
|
+
useEffect(function () {
|
|
148
|
+
if (!event) {
|
|
149
|
+
return undefined;
|
|
150
|
+
}
|
|
151
|
+
var eventListener = function eventListener(event) {
|
|
152
|
+
return handlerRef.current(event);
|
|
153
|
+
};
|
|
154
|
+
event.on(eventName, eventListener);
|
|
155
|
+
return function () {
|
|
156
|
+
event.off(eventName, eventListener);
|
|
157
|
+
};
|
|
158
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
159
|
+
}, [event, eventName]);
|
|
160
|
+
}
|
|
161
|
+
export function useVideoEvents(event, events) {
|
|
162
|
+
useEffect(function () {
|
|
163
|
+
if (!event || !events) {
|
|
164
|
+
return undefined;
|
|
165
|
+
}
|
|
166
|
+
events.forEach(function (_ref) {
|
|
167
|
+
var _ref2 = _slicedToArray(_ref, 2),
|
|
168
|
+
eventName = _ref2[0],
|
|
169
|
+
handle = _ref2[1];
|
|
170
|
+
event.addEventListener(eventName, handle);
|
|
171
|
+
});
|
|
172
|
+
return function () {
|
|
173
|
+
events.forEach(function (_ref3) {
|
|
174
|
+
var _ref4 = _slicedToArray(_ref3, 2),
|
|
175
|
+
eventName = _ref4[0],
|
|
176
|
+
handle = _ref4[1];
|
|
177
|
+
event.removeEventListener(eventName, handle);
|
|
178
|
+
});
|
|
179
|
+
};
|
|
180
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
181
|
+
}, [event]);
|
|
182
|
+
}
|
|
183
|
+
export function useRegisterPlayerEvents(event, events) {
|
|
184
|
+
useEffect(function () {
|
|
185
|
+
if (!event || !events) {
|
|
186
|
+
return undefined;
|
|
187
|
+
}
|
|
188
|
+
events.forEach(function (_ref5) {
|
|
189
|
+
var _ref6 = _slicedToArray(_ref5, 2),
|
|
190
|
+
eventName = _ref6[0],
|
|
191
|
+
handle = _ref6[1];
|
|
192
|
+
event.on(eventName, handle);
|
|
193
|
+
});
|
|
194
|
+
return function () {
|
|
195
|
+
events.forEach(function (_ref7) {
|
|
196
|
+
var _ref8 = _slicedToArray(_ref7, 2),
|
|
197
|
+
eventName = _ref8[0],
|
|
198
|
+
handle = _ref8[1];
|
|
199
|
+
event.off(eventName, handle);
|
|
200
|
+
});
|
|
201
|
+
};
|
|
202
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
203
|
+
}, [event]);
|
|
204
|
+
}
|
|
205
|
+
export default VideoEventInstance;
|