@cloud-app-dev/vidc 3.2.9 → 3.2.11
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/List/DynamicGridList/Demo.js +2 -1
- package/es/List/DynamicGridList/index.js +1 -1
- package/es/Picture/index.js +1 -2
- package/es/ScreenPlayer/Record.js +70 -69
- package/es/ScreenPlayer/RecordTools.d.ts +10 -7
- package/es/ScreenPlayer/RecordTools.js +5 -1
- package/es/ScreenPlayer/SegmentTimeLine.d.ts +4 -1
- package/es/ScreenPlayer/SegmentTimeLine.js +10 -8
- package/es/ScreenPlayer/demo2.js +1 -1
- package/es/ScreenPlayer/interface.d.ts +5 -0
- package/es/ScreenPlayer/useTimeSlider.d.ts +4 -1
- package/es/ScreenPlayer/useTimeSlider.js +12 -3
- package/package.json +1 -1
|
@@ -28,9 +28,10 @@ function loadPage() {
|
|
|
28
28
|
d.page ? d.page++ : d.page = 1;
|
|
29
29
|
d.list ? d.list = [].concat(_toConsumableArray(d.list), _toConsumableArray(resultData)) : d.list = resultData;
|
|
30
30
|
return new Promise(function (resolve) {
|
|
31
|
+
console.log(d.page);
|
|
31
32
|
setTimeout(function () {
|
|
32
33
|
return resolve(d);
|
|
33
|
-
},
|
|
34
|
+
}, 10);
|
|
34
35
|
});
|
|
35
36
|
}
|
|
36
37
|
var App = function App() {
|
|
@@ -26,7 +26,7 @@ function DynamicGridList(_a) {
|
|
|
26
26
|
data = _useInfiniteScroll.data,
|
|
27
27
|
noMore = _useInfiniteScroll.noMore;
|
|
28
28
|
_useUpdateEffect(function () {
|
|
29
|
-
|
|
29
|
+
noMore && _message.success('数据已全部加载完成!');
|
|
30
30
|
}, [noMore]);
|
|
31
31
|
function getItemData(data) {
|
|
32
32
|
return {
|
package/es/Picture/index.js
CHANGED
|
@@ -8,6 +8,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
|
|
|
8
8
|
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; }
|
|
9
9
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
10
10
|
import { __awaiter, __rest } from "tslib";
|
|
11
|
+
/* eslint-disable jsx-a11y/alt-text */
|
|
11
12
|
import React, { useMemo, useRef, useState, useCallback, useEffect } from 'react';
|
|
12
13
|
import DomMove from '../DomMove';
|
|
13
14
|
import { getRectImagePath } from './loadCaptureRectImage';
|
|
@@ -257,9 +258,7 @@ function Picture(_a) {
|
|
|
257
258
|
transform: "scale(".concat(scale, ") rotate(").concat(rotate, "deg)")
|
|
258
259
|
}
|
|
259
260
|
}, /*#__PURE__*/React.createElement("img", {
|
|
260
|
-
alt: "",
|
|
261
261
|
ref: domImgRef,
|
|
262
|
-
crossOrigin: "anonymous",
|
|
263
262
|
style: {
|
|
264
263
|
maxWidth: baseXOrY === 'x' ? width || '100%' : 'unset',
|
|
265
264
|
maxHeight: baseXOrY === 'x' ? 'unset' : height || '100%'
|
|
@@ -1,6 +1,6 @@
|
|
|
1
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); }
|
|
2
|
-
import _useMemoizedFn from "ahooks/es/useMemoizedFn";
|
|
3
2
|
import _useUpdateEffect from "ahooks/es/useUpdateEffect";
|
|
3
|
+
import _useMemoizedFn from "ahooks/es/useMemoizedFn";
|
|
4
4
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
5
|
function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return exports; }; var exports = {}, Op = Object.prototype, hasOwn = Op.hasOwnProperty, $Symbol = "function" == typeof Symbol ? Symbol : {}, iteratorSymbol = $Symbol.iterator || "@@iterator", asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator", toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag"; function define(obj, key, value) { return Object.defineProperty(obj, key, { value: value, enumerable: !0, configurable: !0, writable: !0 }), obj[key]; } try { define({}, ""); } catch (err) { define = function define(obj, key, value) { return obj[key] = value; }; } function wrap(innerFn, outerFn, self, tryLocsList) { var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator, generator = Object.create(protoGenerator.prototype), context = new Context(tryLocsList || []); return generator._invoke = function (innerFn, self, context) { var state = "suspendedStart"; return function (method, arg) { if ("executing" === state) throw new Error("Generator is already running"); if ("completed" === state) { if ("throw" === method) throw arg; return doneResult(); } for (context.method = method, context.arg = arg;;) { var delegate = context.delegate; if (delegate) { var delegateResult = maybeInvokeDelegate(delegate, context); if (delegateResult) { if (delegateResult === ContinueSentinel) continue; return delegateResult; } } if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) { if ("suspendedStart" === state) throw state = "completed", context.arg; context.dispatchException(context.arg); } else "return" === context.method && context.abrupt("return", context.arg); state = "executing"; var record = tryCatch(innerFn, self, context); if ("normal" === record.type) { if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue; return { value: record.arg, done: context.done }; } "throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg); } }; }(innerFn, self, context), generator; } function tryCatch(fn, obj, arg) { try { return { type: "normal", arg: fn.call(obj, arg) }; } catch (err) { return { type: "throw", arg: err }; } } exports.wrap = wrap; var ContinueSentinel = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var IteratorPrototype = {}; define(IteratorPrototype, iteratorSymbol, function () { return this; }); var getProto = Object.getPrototypeOf, NativeIteratorPrototype = getProto && getProto(getProto(values([]))); NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype); var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(IteratorPrototype); function defineIteratorMethods(prototype) { ["next", "throw", "return"].forEach(function (method) { define(prototype, method, function (arg) { return this._invoke(method, arg); }); }); } function AsyncIterator(generator, PromiseImpl) { function invoke(method, arg, resolve, reject) { var record = tryCatch(generator[method], generator, arg); if ("throw" !== record.type) { var result = record.arg, value = result.value; return value && "object" == _typeof(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) { invoke("next", value, resolve, reject); }, function (err) { invoke("throw", err, resolve, reject); }) : PromiseImpl.resolve(value).then(function (unwrapped) { result.value = unwrapped, resolve(result); }, function (error) { return invoke("throw", error, resolve, reject); }); } reject(record.arg); } var previousPromise; this._invoke = function (method, arg) { function callInvokeWithMethodAndArg() { return new PromiseImpl(function (resolve, reject) { invoke(method, arg, resolve, reject); }); } return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); }; } function maybeInvokeDelegate(delegate, context) { var method = delegate.iterator[context.method]; if (undefined === method) { if (context.delegate = null, "throw" === context.method) { if (delegate.iterator.return && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method)) return ContinueSentinel; context.method = "throw", context.arg = new TypeError("The iterator does not provide a 'throw' method"); } return ContinueSentinel; } var record = tryCatch(method, delegate.iterator, context.arg); if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel; var info = record.arg; return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel); } function pushTryEntry(locs) { var entry = { tryLoc: locs[0] }; 1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry); } function resetTryEntry(entry) { var record = entry.completion || {}; record.type = "normal", delete record.arg, entry.completion = record; } function Context(tryLocsList) { this.tryEntries = [{ tryLoc: "root" }], tryLocsList.forEach(pushTryEntry, this), this.reset(!0); } function values(iterable) { if (iterable) { var iteratorMethod = iterable[iteratorSymbol]; if (iteratorMethod) return iteratorMethod.call(iterable); if ("function" == typeof iterable.next) return iterable; if (!isNaN(iterable.length)) { var i = -1, next = function next() { for (; ++i < iterable.length;) { if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next; } return next.value = undefined, next.done = !0, next; }; return next.next = next; } } return { next: doneResult }; } function doneResult() { return { value: undefined, done: !0 }; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, define(Gp, "constructor", GeneratorFunctionPrototype), define(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) { var ctor = "function" == typeof genFun && genFun.constructor; return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name)); }, exports.mark = function (genFun) { return Object.setPrototypeOf ? Object.setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = Object.create(Gp), genFun; }, exports.awrap = function (arg) { return { __await: arg }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () { return this; }), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) { void 0 === PromiseImpl && (PromiseImpl = Promise); var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl); return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) { return result.done ? result.value : iter.next(); }); }, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () { return this; }), define(Gp, "toString", function () { return "[object Generator]"; }), exports.keys = function (object) { var keys = []; for (var key in object) { keys.push(key); } return keys.reverse(), function next() { for (; keys.length;) { var key = keys.pop(); if (key in object) return next.value = key, next.done = !1, next; } return next.done = !0, next; }; }, exports.values = values, Context.prototype = { constructor: Context, reset: function reset(skipTempReset) { if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, this.tryEntries.forEach(resetTryEntry), !skipTempReset) for (var name in this) { "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+name.slice(1)) && (this[name] = undefined); } }, stop: function stop() { this.done = !0; var rootRecord = this.tryEntries[0].completion; if ("throw" === rootRecord.type) throw rootRecord.arg; return this.rval; }, dispatchException: function dispatchException(exception) { if (this.done) throw exception; var context = this; function handle(loc, caught) { return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught; } for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i], record = entry.completion; if ("root" === entry.tryLoc) return handle("end"); if (entry.tryLoc <= this.prev) { var hasCatch = hasOwn.call(entry, "catchLoc"), hasFinally = hasOwn.call(entry, "finallyLoc"); if (hasCatch && hasFinally) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } else if (hasCatch) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); } else { if (!hasFinally) throw new Error("try statement without catch or finally"); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } } } }, abrupt: function abrupt(type, arg) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) { var finallyEntry = entry; break; } } finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null); var record = finallyEntry ? finallyEntry.completion : {}; return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record); }, complete: function complete(record, afterLoc) { if ("throw" === record.type) throw record.arg; return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel; }, finish: function finish(finallyLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel; } }, catch: function _catch(tryLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc === tryLoc) { var record = entry.completion; if ("throw" === record.type) { var thrown = record.arg; resetTryEntry(entry); } return thrown; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(iterable, resultName, nextLoc) { return this.delegate = { iterator: values(iterable), resultName: resultName, nextLoc: nextLoc }, "next" === this.method && (this.arg = undefined), ContinueSentinel; } }, exports; }
|
|
6
6
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
@@ -10,7 +10,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
|
|
|
10
10
|
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; }
|
|
11
11
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
12
12
|
import { __awaiter, __rest } from "tslib";
|
|
13
|
-
import React, {
|
|
13
|
+
import React, { useEffect, useMemo, useRef, useState } from 'react';
|
|
14
14
|
import { ScreenType, mergeFill, sleep } from './utils';
|
|
15
15
|
import { SegmentPlayerWithExt, FrontendPlayerWithExt } from './PlayerWithExt';
|
|
16
16
|
import RecordTools from './RecordTools';
|
|
@@ -25,7 +25,11 @@ var defaultState = {
|
|
|
25
25
|
modes: {},
|
|
26
26
|
currentTimes: {},
|
|
27
27
|
seekTo: {},
|
|
28
|
-
timeMode: 24
|
|
28
|
+
timeMode: 24,
|
|
29
|
+
begins: {}
|
|
30
|
+
};
|
|
31
|
+
var getKey = function getKey(item) {
|
|
32
|
+
return "".concat(item.cid, "-").concat(item.date);
|
|
29
33
|
};
|
|
30
34
|
/**
|
|
31
35
|
* @desc 录像设计的时间全部需要到毫秒
|
|
@@ -33,7 +37,6 @@ var defaultState = {
|
|
|
33
37
|
* @returns
|
|
34
38
|
*/
|
|
35
39
|
function RecordPlayer(_a) {
|
|
36
|
-
var _this = this;
|
|
37
40
|
var _b;
|
|
38
41
|
var list = _a.list,
|
|
39
42
|
children = _a.children,
|
|
@@ -75,21 +78,23 @@ function RecordPlayer(_a) {
|
|
|
75
78
|
var getPlayerItem = function getPlayerItem() {
|
|
76
79
|
var _a, _b;
|
|
77
80
|
var item = screenList[state.selectIndex];
|
|
78
|
-
return item ? (_b = (_a = playerRef.current) === null || _a === void 0 ? void 0 : _a["".concat(
|
|
81
|
+
return item ? (_b = (_a = playerRef.current) === null || _a === void 0 ? void 0 : _a["".concat(getKey(item))]) === null || _b === void 0 ? void 0 : _b.current : null;
|
|
79
82
|
};
|
|
80
83
|
// 当前窗口信息
|
|
81
84
|
var segmentItem = useMemo(function () {
|
|
82
85
|
return screenList[state.selectIndex] || {};
|
|
83
86
|
}, [state.selectIndex, screenList]);
|
|
84
87
|
var timeBegin = useMemo(function () {
|
|
85
|
-
|
|
86
|
-
|
|
88
|
+
var _a;
|
|
89
|
+
return (_a = state.begins["".concat(getKey(segmentItem))]) !== null && _a !== void 0 ? _a : segmentItem.date - state.timeMode / 2 * 3600 * 1000;
|
|
90
|
+
}, [segmentItem, state.begins, state.timeMode]);
|
|
87
91
|
var currentTime = useMemo(function () {
|
|
92
|
+
var _a;
|
|
88
93
|
var item = screenList[state.selectIndex];
|
|
89
94
|
if (!item) {
|
|
90
95
|
return undefined;
|
|
91
96
|
}
|
|
92
|
-
return state.currentTimes["".concat(item
|
|
97
|
+
return (_a = state.currentTimes["".concat(getKey(item))]) !== null && _a !== void 0 ? _a : item.date;
|
|
93
98
|
}, [state.currentTimes, screenList, state.selectIndex]);
|
|
94
99
|
/**
|
|
95
100
|
* @desc seek hook
|
|
@@ -181,7 +186,7 @@ function RecordPlayer(_a) {
|
|
|
181
186
|
if (newState.hasOwnProperty('mode')) {
|
|
182
187
|
var item = screenList[state.selectIndex];
|
|
183
188
|
var newModes = Object.assign({}, state.modes);
|
|
184
|
-
newModes["".concat(
|
|
189
|
+
newModes["".concat(getKey(item))] = newState.mode;
|
|
185
190
|
obj.modes = newModes;
|
|
186
191
|
}
|
|
187
192
|
if (newState.hasOwnProperty('timeMode')) {
|
|
@@ -192,68 +197,62 @@ function RecordPlayer(_a) {
|
|
|
192
197
|
});
|
|
193
198
|
};
|
|
194
199
|
/**
|
|
195
|
-
* @desc 两种情况:
|
|
200
|
+
* @desc currentTime两种情况:
|
|
196
201
|
* 1:time在片断内,修改cuurentTime,更新seekTo交给seek hook去处理;
|
|
197
202
|
* 2:不在片断内,查询新的片段,更新mergeSegments和seekTo后交给seek hook处理
|
|
203
|
+
*
|
|
204
|
+
* @desc begin 处理时间轴开始绘制的刻度
|
|
205
|
+
*
|
|
198
206
|
*/
|
|
199
|
-
var onTimeChange =
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
case "end":
|
|
246
|
-
return _context2.stop();
|
|
247
|
-
}
|
|
248
|
-
}
|
|
249
|
-
}, _callee2);
|
|
250
|
-
}));
|
|
251
|
-
},
|
|
252
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
253
|
-
[segmentItem.cid, segmentItem.recordType, segmentItem.segments, seekLoading]);
|
|
207
|
+
var onTimeChange = _useMemoizedFn(function (options, outTimeline) {
|
|
208
|
+
var _a;
|
|
209
|
+
if (options.currentTime) {
|
|
210
|
+
var time = options.currentTime;
|
|
211
|
+
if (!Array.isArray(segmentItem.segments) || seekLoading) {
|
|
212
|
+
return;
|
|
213
|
+
}
|
|
214
|
+
if (outTimeline && segmentItem.recordType === 1) {
|
|
215
|
+
// 云录像 若点击了缺失的片段,直接忽略
|
|
216
|
+
console.warn('当前录像片段缺失!');
|
|
217
|
+
return;
|
|
218
|
+
}
|
|
219
|
+
if (time > Date.now()) {
|
|
220
|
+
console.warn('查询时间超出正常范围!');
|
|
221
|
+
return;
|
|
222
|
+
}
|
|
223
|
+
var index = segmentItem.segments.findIndex(function (v) {
|
|
224
|
+
return time >= v.beginTime && time < v.endTime;
|
|
225
|
+
});
|
|
226
|
+
if (index === -1) {
|
|
227
|
+
// 触发回调
|
|
228
|
+
(_a = props.onTimeLineChange) === null || _a === void 0 ? void 0 : _a.call(props, time);
|
|
229
|
+
}
|
|
230
|
+
//更新time
|
|
231
|
+
setState(function (old) {
|
|
232
|
+
var currentTimes = Object.assign({}, old.currentTimes);
|
|
233
|
+
var item = screenList[old.selectIndex];
|
|
234
|
+
currentTimes["".concat(getKey(item))] = time;
|
|
235
|
+
return Object.assign(Object.assign({}, old), {
|
|
236
|
+
currentTimes: currentTimes,
|
|
237
|
+
seekTo: Object.assign(Object.assign({}, old.seekTo), _defineProperty({}, "".concat(getKey(item)), time))
|
|
238
|
+
});
|
|
239
|
+
});
|
|
240
|
+
}
|
|
241
|
+
if (options.begin) {
|
|
242
|
+
//更新begin
|
|
243
|
+
setState(function (old) {
|
|
244
|
+
var begins = Object.assign({}, old.begins);
|
|
245
|
+
var item = screenList[old.selectIndex];
|
|
246
|
+
begins["".concat(getKey(item))] = options.begin;
|
|
247
|
+
return Object.assign(Object.assign({}, old), {
|
|
248
|
+
begins: begins
|
|
249
|
+
});
|
|
250
|
+
});
|
|
251
|
+
}
|
|
252
|
+
});
|
|
254
253
|
var _updatePlayer = function updatePlayer(player, index) {
|
|
255
254
|
var item = screenList[index];
|
|
256
|
-
playerRef.current["".concat(
|
|
255
|
+
playerRef.current["".concat(getKey(item))] = player;
|
|
257
256
|
setState(function (old) {
|
|
258
257
|
return Object.assign({}, old);
|
|
259
258
|
});
|
|
@@ -278,21 +277,22 @@ function RecordPlayer(_a) {
|
|
|
278
277
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
279
278
|
_useUpdateEffect(function () {
|
|
280
279
|
var _a;
|
|
281
|
-
|
|
280
|
+
(_a = props.onIndexChange) === null || _a === void 0 ? void 0 : _a.call(props, state.selectIndex);
|
|
282
281
|
}, [state.selectIndex]);
|
|
283
282
|
/**
|
|
284
283
|
* 通知screenNum变化
|
|
285
284
|
*/
|
|
286
285
|
_useUpdateEffect(function () {
|
|
287
286
|
var _a;
|
|
288
|
-
|
|
287
|
+
(_a = props.screenChange) === null || _a === void 0 ? void 0 : _a.call(props, state.screenNum);
|
|
289
288
|
}, [state.screenNum]);
|
|
289
|
+
// 单窗口关闭,清楚缓存key
|
|
290
290
|
var onClose = _useMemoizedFn(function () {
|
|
291
291
|
var _a;
|
|
292
292
|
setState(function (old) {
|
|
293
293
|
var item = screenList[old.selectIndex];
|
|
294
294
|
if (item && item.cid && item.date) {
|
|
295
|
-
var key = "".concat(
|
|
295
|
+
var key = "".concat(getKey(item));
|
|
296
296
|
var currentTimes = Object.assign({}, old.currentTimes);
|
|
297
297
|
var modes = Object.assign({}, old.modes);
|
|
298
298
|
delete currentTimes[key];
|
|
@@ -307,6 +307,7 @@ function RecordPlayer(_a) {
|
|
|
307
307
|
});
|
|
308
308
|
(_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
|
|
309
309
|
});
|
|
310
|
+
// 关闭所以,清楚缓存key
|
|
310
311
|
var onCloseAll = _useMemoizedFn(function () {
|
|
311
312
|
var _a;
|
|
312
313
|
setState(function (old) {
|
|
@@ -3,21 +3,24 @@ import { ExportPlayerType } from '../Player/player';
|
|
|
3
3
|
import { PlayModeType } from '../PlayerExt';
|
|
4
4
|
interface IToolsProps {
|
|
5
5
|
containerRef: React.MutableRefObject<HTMLDivElement>;
|
|
6
|
+
screenNum: number;
|
|
7
|
+
mode: PlayModeType;
|
|
8
|
+
fit?: string;
|
|
9
|
+
timeMode: number;
|
|
10
|
+
time?: number;
|
|
6
11
|
updateState: (state: {
|
|
7
12
|
screenNum?: number;
|
|
8
13
|
mode?: PlayModeType;
|
|
9
14
|
timeMode?: number;
|
|
10
15
|
}) => void;
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
16
|
+
onTimeChange?: (options: {
|
|
17
|
+
curentTime?: number;
|
|
18
|
+
begin?: number;
|
|
19
|
+
}) => void;
|
|
15
20
|
toggleFit?: () => void;
|
|
16
|
-
time?: number;
|
|
17
|
-
onTimeChange?: (time: number) => void;
|
|
18
21
|
onClose?: () => void;
|
|
19
22
|
onCloseAll?: () => void;
|
|
20
|
-
|
|
23
|
+
getPlayerItem: () => ExportPlayerType | undefined;
|
|
21
24
|
download?: () => void;
|
|
22
25
|
snapshot?: (base64: string) => void;
|
|
23
26
|
/**
|
|
@@ -137,7 +137,11 @@ function RecordTools(_a) {
|
|
|
137
137
|
}
|
|
138
138
|
})), /*#__PURE__*/React.createElement(TimeSelect, {
|
|
139
139
|
time: time,
|
|
140
|
-
onChange:
|
|
140
|
+
onChange: function onChange(time) {
|
|
141
|
+
return props.onTimeChange({
|
|
142
|
+
curentTime: time
|
|
143
|
+
});
|
|
144
|
+
}
|
|
141
145
|
}), /*#__PURE__*/React.createElement("div", {
|
|
142
146
|
className: "player-tools-item",
|
|
143
147
|
onClick: playToggle
|
|
@@ -3,7 +3,10 @@ import { ISegmentType } from '../Player/player';
|
|
|
3
3
|
interface ISegmentTimeLineProps {
|
|
4
4
|
begin?: number;
|
|
5
5
|
segments?: ISegmentType[];
|
|
6
|
-
onTimeChange?: (
|
|
6
|
+
onTimeChange?: (options: {
|
|
7
|
+
currentTime?: number;
|
|
8
|
+
begin?: number;
|
|
9
|
+
}) => void;
|
|
7
10
|
timeMode: number;
|
|
8
11
|
updateState: (state: {
|
|
9
12
|
timeMode: number;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _useThrottleFn2 from "ahooks/es/useThrottleFn";
|
|
2
2
|
import moment from 'moment';
|
|
3
|
-
import React, {
|
|
3
|
+
import React, { useRef } from 'react';
|
|
4
4
|
import useTimeSlider from './useTimeSlider';
|
|
5
5
|
function SegmentTimeLine(_ref) {
|
|
6
6
|
var begin = _ref.begin,
|
|
@@ -9,21 +9,23 @@ function SegmentTimeLine(_ref) {
|
|
|
9
9
|
timeMode = _ref.timeMode,
|
|
10
10
|
updateState = _ref.updateState,
|
|
11
11
|
currentTime = _ref.currentTime;
|
|
12
|
+
var _a;
|
|
12
13
|
var ref = useRef();
|
|
13
14
|
var _useThrottleFn = _useThrottleFn2(onTimeChange, {
|
|
14
15
|
wait: 300
|
|
15
16
|
}),
|
|
16
17
|
run = _useThrottleFn.run;
|
|
17
|
-
|
|
18
|
-
|
|
18
|
+
useTimeSlider(ref, {
|
|
19
|
+
begin: begin !== null && begin !== void 0 ? begin : moment().set({
|
|
19
20
|
hours: 0,
|
|
20
21
|
minutes: 0,
|
|
21
22
|
seconds: 0
|
|
22
|
-
}).valueOf()
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
23
|
+
}).valueOf() - timeMode / 2 * 3600 * 1000,
|
|
24
|
+
currentTime: (_a = currentTime !== null && currentTime !== void 0 ? currentTime : begin) !== null && _a !== void 0 ? _a : moment().set({
|
|
25
|
+
hours: 0,
|
|
26
|
+
minutes: 0,
|
|
27
|
+
seconds: 0
|
|
28
|
+
}).valueOf(),
|
|
27
29
|
onTimeChange: run,
|
|
28
30
|
segments: segments,
|
|
29
31
|
hoursPer: timeMode,
|
package/es/ScreenPlayer/demo2.js
CHANGED
|
@@ -20,7 +20,7 @@ import RecordPlayer from './Record';
|
|
|
20
20
|
import moment from 'moment';
|
|
21
21
|
import { completionSegments } from './utils';
|
|
22
22
|
import Service from '../Service';
|
|
23
|
-
var token = "eyJhbGciOiJIUzI1NiJ9.
|
|
23
|
+
var token = "eyJhbGciOiJIUzI1NiJ9.eyJvcmdhbml6YXRpb25JZCI6IjEwMDEwMTAwMDQ0NSIsImV4dCI6MTY2ODg1NzQ3Mjc4NiwidWlkIjoiMTAxMDAwMDAwNjk5IiwidmFsaWRTdGF0ZSI6MTA0NDA2LCJyb2xlSWQiOlsxMDAwMDAxMTA1MTgsMTAwMDAwMTEwNzI4XSwidmFsaWRUaW1lIjoxNzA0MzgzOTk5MDAwLCJvcHRDZW50ZXJJZCI6IjEwMDEwMDAwMDIzMyIsInVzZXJUeXBlIjoxMDA3MDQsImlhdCI6MTY2ODU5ODI3Mjc4Nn0.F0R_k3GRQfZ5yoL5MMUS4O2ghw0boWgnVs0Spf0pa0Q";
|
|
24
24
|
var cids = ['560077633', '560073578'];
|
|
25
25
|
var query = function query(_a) {
|
|
26
26
|
var cid = _a.cid,
|
|
@@ -5,7 +5,10 @@ export interface ITimeSliderOptions {
|
|
|
5
5
|
begin?: number;
|
|
6
6
|
segments?: TimeCellItem[];
|
|
7
7
|
currentTime?: number;
|
|
8
|
-
onTimeChange?: (
|
|
8
|
+
onTimeChange?: (options: {
|
|
9
|
+
currentTime?: number;
|
|
10
|
+
begin?: number;
|
|
11
|
+
}, outTimeline?: boolean) => void;
|
|
9
12
|
onHoursPerChange?: (hour: number) => void;
|
|
10
13
|
}
|
|
11
14
|
export declare type ITimeSliderState = {
|
|
@@ -158,7 +158,7 @@ function useTimeSlider(canvasRef, _ref2) {
|
|
|
158
158
|
if (date.get('hours') === 0 && date.get('minutes') === 0) {
|
|
159
159
|
lineH = 10;
|
|
160
160
|
var big_date = graduation_title(date.valueOf());
|
|
161
|
-
var x = graduation_left -
|
|
161
|
+
var x = graduation_left - 30;
|
|
162
162
|
drawText(ctx, {
|
|
163
163
|
fillStyle: normalLineColor,
|
|
164
164
|
font: '10px Arial',
|
|
@@ -362,7 +362,7 @@ function useTimeSlider(canvasRef, _ref2) {
|
|
|
362
362
|
return;
|
|
363
363
|
}
|
|
364
364
|
var clickDelay = Date.now() - extRef.current.mousedownTime;
|
|
365
|
-
if (clickDelay <
|
|
365
|
+
if (clickDelay < 200 && e.target === canvas) {
|
|
366
366
|
// click 事件
|
|
367
367
|
var pos_x = get_cursor_x_position(e); //鼠标距离 px
|
|
368
368
|
var ms_per_px = state.hoursPer * 3600 * 1000 / width; // ms/px
|
|
@@ -380,7 +380,9 @@ function useTimeSlider(canvasRef, _ref2) {
|
|
|
380
380
|
});
|
|
381
381
|
});
|
|
382
382
|
_nextTick(function () {
|
|
383
|
-
return onTimeChange === null || onTimeChange === void 0 ? void 0 : onTimeChange(
|
|
383
|
+
return onTimeChange === null || onTimeChange === void 0 ? void 0 : onTimeChange({
|
|
384
|
+
currentTime: new_current
|
|
385
|
+
}, outTimeline);
|
|
384
386
|
});
|
|
385
387
|
}
|
|
386
388
|
// 清楚拖拽关联信息
|
|
@@ -389,6 +391,7 @@ function useTimeSlider(canvasRef, _ref2) {
|
|
|
389
391
|
}, {
|
|
390
392
|
target: document
|
|
391
393
|
});
|
|
394
|
+
var moveTimerRef = useRef(null);
|
|
392
395
|
/**
|
|
393
396
|
* 拖动处理
|
|
394
397
|
*/
|
|
@@ -396,6 +399,7 @@ function useTimeSlider(canvasRef, _ref2) {
|
|
|
396
399
|
if (!extRef.current.mousedownTime) {
|
|
397
400
|
return;
|
|
398
401
|
}
|
|
402
|
+
clearTimeout(moveTimerRef.current);
|
|
399
403
|
// 触发拖动
|
|
400
404
|
var pos_x = get_cursor_x_position(e);
|
|
401
405
|
var px_per_ms = width / (state.hoursPer * 60 * 60 * 1000); // px/ms
|
|
@@ -405,6 +409,11 @@ function useTimeSlider(canvasRef, _ref2) {
|
|
|
405
409
|
update({
|
|
406
410
|
begin: new_begin
|
|
407
411
|
});
|
|
412
|
+
moveTimerRef.current = setTimeout(function () {
|
|
413
|
+
return onTimeChange === null || onTimeChange === void 0 ? void 0 : onTimeChange({
|
|
414
|
+
begin: new_begin
|
|
415
|
+
});
|
|
416
|
+
}, 300);
|
|
408
417
|
}, {
|
|
409
418
|
target: document
|
|
410
419
|
});
|