@desynova-digital/player 4.0.82 → 4.0.83
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.
|
@@ -14,7 +14,7 @@ var _utils = require("../../utils");
|
|
|
14
14
|
var _Timeline = _interopRequireDefault(require("./Timeline"));
|
|
15
15
|
var _MarkerBar = _interopRequireDefault(require("../MarkerBar"));
|
|
16
16
|
var _TagsBar = _interopRequireDefault(require("../TagsBar"));
|
|
17
|
-
var _templateObject, _templateObject2; // import AudioWaveform from './AudioWaveform';
|
|
17
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4; // import AudioWaveform from './AudioWaveform';
|
|
18
18
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
19
19
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
20
20
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
@@ -22,8 +22,6 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
|
|
|
22
22
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
23
23
|
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); } }
|
|
24
24
|
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
|
25
|
-
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
26
|
-
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); }
|
|
27
25
|
function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
|
|
28
26
|
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
|
|
29
27
|
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
|
|
@@ -31,13 +29,18 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g
|
|
|
31
29
|
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
|
32
30
|
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
|
|
33
31
|
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
|
32
|
+
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; }
|
|
33
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
34
|
+
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); }
|
|
34
35
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
35
36
|
// import MouseTimeDisplay from './MouseTimeDisplay';
|
|
36
37
|
|
|
37
38
|
var AdvancedControlBlock = _styledComponents["default"].div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n width: 100%;\n height: 46px;\n position: relative;\n cursor: pointer;\n z-index: 1;\n"])));
|
|
38
|
-
var SliderBlock = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n width: 100%;\n height: 4px;\n position: relative;\n cursor: pointer;\n z-index: 2;\n top: ", ";\n"])), function (props) {
|
|
39
|
+
var SliderBlock = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n width: 100%;\n height: 4px;\n position: relative;\n cursor: pointer;\n z-index: 2;\n &:hover {\n height: 6px;\n background-color: rgba(255, 255, 255, 0.4); \n transition: all 0.2s ease;\n }\n top: ", ";\n"])), function (props) {
|
|
39
40
|
return props.isFullscreen && props.playerType != 'default' ? '4px' : '0px';
|
|
40
41
|
});
|
|
42
|
+
var HoverPreviewBox = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n position: fixed; \n top: 0;\n left: 0;\n width: 220px;\n height: 126px;\n overflow: hidden;\n display: none;\n pointer-events: none;\n z-index: 999999999; \n border: 2px solid #333333;\n border-radius: 4px;\n"])));
|
|
43
|
+
var HoverPreviewImage = _styledComponents["default"].img(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n left: 0;\n width: 220px;\n height: auto;\n"])));
|
|
41
44
|
var propTypes = {
|
|
42
45
|
actions: _propTypes.PropTypes.instanceOf(Object),
|
|
43
46
|
player: _propTypes.PropTypes.instanceOf(Object),
|
|
@@ -54,6 +57,63 @@ var SeekBar = exports["default"] = /*#__PURE__*/function (_Component) {
|
|
|
54
57
|
var _this;
|
|
55
58
|
_classCallCheck(this, SeekBar);
|
|
56
59
|
_this = _callSuper(this, SeekBar, [props, context]);
|
|
60
|
+
_defineProperty(_assertThisInitialized(_this), "handleHoverScrub", function (event) {
|
|
61
|
+
var hoverBox = _this.hoverBoxRef.current;
|
|
62
|
+
var hoverImg = _this.hoverImageRef.current;
|
|
63
|
+
if (!hoverBox || !hoverImg) return;
|
|
64
|
+
|
|
65
|
+
// Get's length of div so that scrub is inside
|
|
66
|
+
var containerRect = event.currentTarget.getBoundingClientRect();
|
|
67
|
+
var containerLeft = containerRect.left;
|
|
68
|
+
var containerWidth = containerRect.width;
|
|
69
|
+
|
|
70
|
+
// X coordinate ki value inside the container
|
|
71
|
+
var offsetX = event.clientX - containerLeft;
|
|
72
|
+
if (offsetX < 0) offsetX = 0;
|
|
73
|
+
if (offsetX > containerWidth) offsetX = containerWidth;
|
|
74
|
+
|
|
75
|
+
/// Frame selection (unchanged
|
|
76
|
+
var previewBlockHeight = 126;
|
|
77
|
+
var iframeOgHeight = 120;
|
|
78
|
+
var ogHeight = hoverImg.naturalHeight || 1;
|
|
79
|
+
var offsetHeight = hoverImg.offsetHeight || 1;
|
|
80
|
+
var frameCount = Math.max(1, Math.floor(ogHeight / iframeOgHeight));
|
|
81
|
+
var frameHeight = offsetHeight / frameCount;
|
|
82
|
+
var offsetTop = Math.abs(previewBlockHeight - frameHeight) / 2;
|
|
83
|
+
var frameNum = Math.floor(offsetX / containerWidth * frameCount);
|
|
84
|
+
frameNum = Math.max(0, Math.min(frameNum, frameCount - 1));
|
|
85
|
+
var imageTop = frameHeight * frameNum + offsetTop;
|
|
86
|
+
hoverImg.style.top = "-".concat(imageTop, "px");
|
|
87
|
+
|
|
88
|
+
//Position preview box horizontally within container
|
|
89
|
+
var hoverWidth = hoverBox.offsetWidth || 220;
|
|
90
|
+
|
|
91
|
+
// Center the preview on the mouse X
|
|
92
|
+
var boxLeft = event.clientX - hoverWidth / 2;
|
|
93
|
+
|
|
94
|
+
// Clamp to container so that it does not move out
|
|
95
|
+
var padding = 10;
|
|
96
|
+
var minLeft = containerLeft + padding;
|
|
97
|
+
var maxLeft = containerLeft + containerWidth - hoverWidth - padding;
|
|
98
|
+
if (boxLeft < minLeft) boxLeft = minLeft;
|
|
99
|
+
if (boxLeft > maxLeft) boxLeft = maxLeft;
|
|
100
|
+
hoverBox.style.left = "".concat(boxLeft, "px");
|
|
101
|
+
|
|
102
|
+
// Pos fixed vwrically always 10px above the wrapper div
|
|
103
|
+
var containerTop = containerRect.top;
|
|
104
|
+
var hoverHeight = hoverBox.offsetHeight;
|
|
105
|
+
hoverBox.style.top = "".concat(containerTop - hoverHeight - 10, "px");
|
|
106
|
+
});
|
|
107
|
+
_defineProperty(_assertThisInitialized(_this), "showHoverPreview", function () {
|
|
108
|
+
if (_this.hoverBoxRef.current) {
|
|
109
|
+
_this.hoverBoxRef.current.style.display = "block";
|
|
110
|
+
}
|
|
111
|
+
});
|
|
112
|
+
_defineProperty(_assertThisInitialized(_this), "hideHoverPreview", function () {
|
|
113
|
+
if (_this.hoverBoxRef.current) {
|
|
114
|
+
_this.hoverBoxRef.current.style.display = "none";
|
|
115
|
+
}
|
|
116
|
+
});
|
|
57
117
|
_this.getPercent = _this.getPercent.bind(_assertThisInitialized(_this));
|
|
58
118
|
_this.getNewTime = _this.getNewTime.bind(_assertThisInitialized(_this));
|
|
59
119
|
_this.stepForward = _this.stepForward.bind(_assertThisInitialized(_this));
|
|
@@ -64,6 +124,8 @@ var SeekBar = exports["default"] = /*#__PURE__*/function (_Component) {
|
|
|
64
124
|
_this.state = {
|
|
65
125
|
sliderActive: false
|
|
66
126
|
};
|
|
127
|
+
_this.hoverBoxRef = /*#__PURE__*/_react["default"].createRef();
|
|
128
|
+
_this.hoverImageRef = /*#__PURE__*/_react["default"].createRef();
|
|
67
129
|
return _this;
|
|
68
130
|
}
|
|
69
131
|
_createClass(SeekBar, [{
|
|
@@ -225,9 +287,21 @@ var SeekBar = exports["default"] = /*#__PURE__*/function (_Component) {
|
|
|
225
287
|
})), tagsMarker && tagsMarker.length ? /*#__PURE__*/_react["default"].createElement(_TagsBar["default"], this.props) : null, /*#__PURE__*/_react["default"].createElement("div", {
|
|
226
288
|
style: this.returnStyle(playerType),
|
|
227
289
|
onMouseDown: this.handleMouseDown,
|
|
228
|
-
onMouseMove:
|
|
229
|
-
|
|
230
|
-
|
|
290
|
+
onMouseMove: function onMouseMove(e) {
|
|
291
|
+
_this2.handleMouseMove(e); // existing seeking
|
|
292
|
+
_this2.handleHoverScrub(e); // NEW preview scrub
|
|
293
|
+
},
|
|
294
|
+
onMouseUp: this.handleMouseUp,
|
|
295
|
+
onMouseEnter: this.showHoverPreview,
|
|
296
|
+
onMouseLeave: this.hideHoverPreview
|
|
297
|
+
}, /*#__PURE__*/_react["default"].createElement(HoverPreviewBox, {
|
|
298
|
+
ref: this.hoverBoxRef
|
|
299
|
+
}, /*#__PURE__*/_react["default"].createElement(HoverPreviewImage, {
|
|
300
|
+
ref: this.hoverImageRef,
|
|
301
|
+
src: this.props.iframeURL // use your iframeURL from props
|
|
302
|
+
,
|
|
303
|
+
draggable: false
|
|
304
|
+
})), /*#__PURE__*/_react["default"].createElement(SliderBlock, {
|
|
231
305
|
playerType: playerType,
|
|
232
306
|
isFullscreen: isFullscreen
|
|
233
307
|
}, /*#__PURE__*/_react["default"].createElement(_Slider["default"], _extends({}, this.props, {
|