@vidispine/vdt-videojs-react 23.1.0 → 23.2.0-pre.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -2
- package/dist/index.js +129 -4
- package/dist/index.umd.cjs +1 -0
- package/package.json +22 -25
- package/dist/VideoControls.js +0 -15
- package/dist/VideoPlayer.js +0 -23
- package/dist/VideoSeekBar.js +0 -15
- package/dist/VideoTimeCode.js +0 -14
package/README.md
CHANGED
|
@@ -5,8 +5,7 @@ See [documentation](https://vidispine.github.io/vdt) for more detail.
|
|
|
5
5
|
## `<VideoPlayer />`
|
|
6
6
|
|
|
7
7
|
```
|
|
8
|
-
import { VideoPlayer } from '@vidispine/vdt-react';
|
|
9
|
-
import '@vidispine/vdt-react/dist/index.css';
|
|
8
|
+
import { VideoPlayer } from '@vidispine/vdt-react-videojs';
|
|
10
9
|
```
|
|
11
10
|
|
|
12
11
|
|
package/dist/index.js
CHANGED
|
@@ -1,4 +1,129 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
import { jsx as r } from "react/jsx-runtime";
|
|
2
|
+
import { Component as i } from "react";
|
|
3
|
+
import { Player as p, ExternalControls as l, SeekBar as a, TimeCodeDisplay as h } from "@vidispine/vdt-videojs";
|
|
4
|
+
import "@vidispine/vdt-videojs/dist/index.css";
|
|
5
|
+
class v extends i {
|
|
6
|
+
componentDidMount() {
|
|
7
|
+
const { setPlayer: e, ...t } = this.props;
|
|
8
|
+
this.player = new p({
|
|
9
|
+
target: this.videoNode,
|
|
10
|
+
...t
|
|
11
|
+
}), e && e(this.player);
|
|
12
|
+
}
|
|
13
|
+
// eslint-disable-next-line camelcase
|
|
14
|
+
UNSAFE_componentWillUpdate(e) {
|
|
15
|
+
const t = () => {
|
|
16
|
+
const { setPlayer: s, ...o } = e;
|
|
17
|
+
this.player = new p({
|
|
18
|
+
target: this.videoNode,
|
|
19
|
+
...o
|
|
20
|
+
}), s && s(this.player);
|
|
21
|
+
};
|
|
22
|
+
e.sources && e.sources[0] && e.sources[0].src && (this.props.sources[0].src !== e.sources[0].src ? this.player ? (this.player.videojs.pause(), setTimeout(() => {
|
|
23
|
+
this.player.videojs.dispose(), t();
|
|
24
|
+
}, 0)) : t() : this.player.handleNewProps(e));
|
|
25
|
+
}
|
|
26
|
+
// destroy player on unmount
|
|
27
|
+
componentWillUnmount() {
|
|
28
|
+
const { onUnmount: e } = this.props;
|
|
29
|
+
this.player && (e && e(this.player), this.player.destroy());
|
|
30
|
+
}
|
|
31
|
+
// wrap the player in a div with a `data-vjs-player` attribute
|
|
32
|
+
// so videojs won't create additional wrapper in the DOM
|
|
33
|
+
// see https://github.com/videojs/video.js/pull/3856
|
|
34
|
+
render() {
|
|
35
|
+
return /* @__PURE__ */ r("div", { className: "data-vjs-player", children: /* @__PURE__ */ r(
|
|
36
|
+
"div",
|
|
37
|
+
{
|
|
38
|
+
ref: (e) => {
|
|
39
|
+
this.videoNode = e;
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
) });
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
class m extends i {
|
|
46
|
+
componentDidMount() {
|
|
47
|
+
const { player: e } = this.props;
|
|
48
|
+
this.controls = new l({
|
|
49
|
+
target: this.controlsNode,
|
|
50
|
+
...this.props,
|
|
51
|
+
player: e.current.player
|
|
52
|
+
}), this.controls.handleNewProps(this.props);
|
|
53
|
+
}
|
|
54
|
+
// eslint-disable-next-line camelcase
|
|
55
|
+
UNSAFE_componentWillUpdate(e) {
|
|
56
|
+
this.controls.handleNewProps(e);
|
|
57
|
+
}
|
|
58
|
+
render() {
|
|
59
|
+
return /* @__PURE__ */ r(
|
|
60
|
+
"div",
|
|
61
|
+
{
|
|
62
|
+
ref: (e) => {
|
|
63
|
+
this.controlsNode = e;
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
);
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
m.buttonNames = l.buttonNames;
|
|
70
|
+
class y extends i {
|
|
71
|
+
componentDidMount() {
|
|
72
|
+
const { player: e, bgColor: t, fillColor: s, markersEnabled: o, regions: d, onRegionClick: c } = this.props;
|
|
73
|
+
this.seekBar = new a({
|
|
74
|
+
target: this.seekBarNode,
|
|
75
|
+
player: e.current.player,
|
|
76
|
+
bgColor: t,
|
|
77
|
+
fillColor: s,
|
|
78
|
+
markersEnabled: o,
|
|
79
|
+
/* eslint-disable-next-line react/destructuring-assignment */
|
|
80
|
+
in: this.props.in,
|
|
81
|
+
// can not use "in" with destructuring statement - reserved word
|
|
82
|
+
/* eslint-disable-next-line react/destructuring-assignment */
|
|
83
|
+
out: this.props.out,
|
|
84
|
+
regions: d,
|
|
85
|
+
onRegionClick: c
|
|
86
|
+
});
|
|
87
|
+
}
|
|
88
|
+
// eslint-disable-next-line camelcase
|
|
89
|
+
UNSAFE_componentWillUpdate(e) {
|
|
90
|
+
this.seekBar.handleNewProps(e);
|
|
91
|
+
}
|
|
92
|
+
render() {
|
|
93
|
+
return /* @__PURE__ */ r(
|
|
94
|
+
"div",
|
|
95
|
+
{
|
|
96
|
+
ref: (e) => {
|
|
97
|
+
this.seekBarNode = e;
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
);
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
y.Region = a.Region;
|
|
104
|
+
class P extends i {
|
|
105
|
+
componentDidMount() {
|
|
106
|
+
const { player: e } = this.props;
|
|
107
|
+
this.timeCode = new h({
|
|
108
|
+
target: this.timecodeNode,
|
|
109
|
+
player: e.current.player,
|
|
110
|
+
onInput: e.current.player
|
|
111
|
+
}), this.timeCode.update(this.props), e.current.player.setupTimeCode(this.timeCode);
|
|
112
|
+
}
|
|
113
|
+
// eslint-disable-next-line camelcase
|
|
114
|
+
UNSAFE_componentWillUpdate(e) {
|
|
115
|
+
this.timeCode.update(e);
|
|
116
|
+
}
|
|
117
|
+
render() {
|
|
118
|
+
const { className: e, styles: t } = this.props;
|
|
119
|
+
return /* @__PURE__ */ r("div", { style: t, className: e, ref: (o) => {
|
|
120
|
+
this.timecodeNode = o;
|
|
121
|
+
} });
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
export {
|
|
125
|
+
m as VideoControls,
|
|
126
|
+
v as VideoPlayer,
|
|
127
|
+
y as VideoSeekBar,
|
|
128
|
+
P as VideoTimeCode
|
|
129
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
(function(t,s){typeof exports=="object"&&typeof module<"u"?s(exports,require("react/jsx-runtime"),require("react"),require("@vidispine/vdt-videojs"),require("@vidispine/vdt-videojs/dist/index.css")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","@vidispine/vdt-videojs","@vidispine/vdt-videojs/dist/index.css"],s):(t=typeof globalThis<"u"?globalThis:t||self,s(t["@vidispine/vdt-videojs-react"]={},t.jsxRuntime,t.react,t.vdtVideojs))})(this,function(t,s,d,i){"use strict";class c extends d.Component{componentDidMount(){const{setPlayer:e,...o}=this.props;this.player=new i.Player({target:this.videoNode,...o}),e&&e(this.player)}UNSAFE_componentWillUpdate(e){const o=()=>{const{setPlayer:r,...n}=e;this.player=new i.Player({target:this.videoNode,...n}),r&&r(this.player)};e.sources&&e.sources[0]&&e.sources[0].src&&(this.props.sources[0].src!==e.sources[0].src?this.player?(this.player.videojs.pause(),setTimeout(()=>{this.player.videojs.dispose(),o()},0)):o():this.player.handleNewProps(e))}componentWillUnmount(){const{onUnmount:e}=this.props;this.player&&(e&&e(this.player),this.player.destroy())}render(){return s.jsx("div",{className:"data-vjs-player",children:s.jsx("div",{ref:e=>{this.videoNode=e}})})}}class a extends d.Component{componentDidMount(){const{player:e}=this.props;this.controls=new i.ExternalControls({target:this.controlsNode,...this.props,player:e.current.player}),this.controls.handleNewProps(this.props)}UNSAFE_componentWillUpdate(e){this.controls.handleNewProps(e)}render(){return s.jsx("div",{ref:e=>{this.controlsNode=e}})}}a.buttonNames=i.ExternalControls.buttonNames;class l extends d.Component{componentDidMount(){const{player:e,bgColor:o,fillColor:r,markersEnabled:n,regions:u,onRegionClick:y}=this.props;this.seekBar=new i.SeekBar({target:this.seekBarNode,player:e.current.player,bgColor:o,fillColor:r,markersEnabled:n,in:this.props.in,out:this.props.out,regions:u,onRegionClick:y})}UNSAFE_componentWillUpdate(e){this.seekBar.handleNewProps(e)}render(){return s.jsx("div",{ref:e=>{this.seekBarNode=e}})}}l.Region=i.SeekBar.Region;class h extends d.Component{componentDidMount(){const{player:e}=this.props;this.timeCode=new i.TimeCodeDisplay({target:this.timecodeNode,player:e.current.player,onInput:e.current.player}),this.timeCode.update(this.props),e.current.player.setupTimeCode(this.timeCode)}UNSAFE_componentWillUpdate(e){this.timeCode.update(e)}render(){const{className:e,styles:o}=this.props,r=n=>{this.timecodeNode=n};return s.jsx("div",{style:o,className:e,ref:r})}}t.VideoControls=a,t.VideoPlayer=c,t.VideoSeekBar=l,t.VideoTimeCode=h,Object.defineProperty(t,Symbol.toStringTag,{value:"Module"})});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vidispine/vdt-videojs-react",
|
|
3
|
-
"version": "23.
|
|
3
|
+
"version": "23.2.0-pre.2",
|
|
4
4
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -12,43 +12,40 @@
|
|
|
12
12
|
"url": "https://github.com/vidispine/vdt.git",
|
|
13
13
|
"directory": "packages/vdt-videojs-react"
|
|
14
14
|
},
|
|
15
|
-
"
|
|
16
|
-
"
|
|
17
|
-
"
|
|
15
|
+
"type": "module",
|
|
16
|
+
"main": "./dist/index.umd.cjs",
|
|
17
|
+
"module": "./dist/index.js",
|
|
18
|
+
"exports": {
|
|
19
|
+
".": {
|
|
20
|
+
"import": "./dist/index.js",
|
|
21
|
+
"require": "./dist/index.umd.cjs"
|
|
22
|
+
}
|
|
23
|
+
},
|
|
18
24
|
"files": [
|
|
19
25
|
"dist"
|
|
20
26
|
],
|
|
21
27
|
"scripts": {
|
|
22
|
-
"build": "
|
|
23
|
-
"build:watch": "yarn build
|
|
24
|
-
"lint": "eslint . --ext js
|
|
28
|
+
"build": "yarn vite build",
|
|
29
|
+
"build:watch": "yarn vite build --watch --mode development",
|
|
30
|
+
"lint": "eslint . --max-warnings=0 --ext .js,.jsx,.ts,.tsx,.md,.mdx",
|
|
31
|
+
"format": "prettier . --check"
|
|
25
32
|
},
|
|
26
33
|
"dependencies": {
|
|
27
|
-
"@
|
|
28
|
-
"@vidispine/vdt-videojs": "23.1.0"
|
|
34
|
+
"@vidispine/vdt-videojs": "23.2.0-pre.2"
|
|
29
35
|
},
|
|
30
36
|
"peerDependencies": {
|
|
31
37
|
"react": "^17.0.0"
|
|
32
38
|
},
|
|
33
39
|
"devDependencies": {
|
|
34
|
-
"@
|
|
35
|
-
"@
|
|
36
|
-
"@
|
|
37
|
-
"@
|
|
38
|
-
"@
|
|
39
|
-
"@rollup/plugin-babel": "5.3.1",
|
|
40
|
-
"@rollup/plugin-commonjs": "21.1.0",
|
|
41
|
-
"@rollup/plugin-json": "4.1.0",
|
|
42
|
-
"@rollup/plugin-node-resolve": "13.3.0",
|
|
43
|
-
"@vidispine/eslint-config-mdx": "23.1.0",
|
|
44
|
-
"@vidispine/eslint-config-react": "23.1.0",
|
|
45
|
-
"@vidispine/eslint-config-storybook": "23.1.0",
|
|
46
|
-
"@vidispine/prettier-config": "23.1.0",
|
|
40
|
+
"@vidispine/eslint-config-mdx": "23.2.0-pre.2",
|
|
41
|
+
"@vidispine/eslint-config-react": "23.2.0-pre.2",
|
|
42
|
+
"@vidispine/eslint-config-storybook": "23.2.0-pre.2",
|
|
43
|
+
"@vidispine/prettier-config": "23.2.0-pre.2",
|
|
44
|
+
"@vitejs/plugin-react": "3.1.0",
|
|
47
45
|
"eslint": "8.34.0",
|
|
48
46
|
"prettier": "2.8.4",
|
|
49
|
-
"
|
|
50
|
-
"
|
|
51
|
-
"rollup-plugin-styles": "4.0.0"
|
|
47
|
+
"sass": "1.60.0",
|
|
48
|
+
"vite": "4.2.0"
|
|
52
49
|
},
|
|
53
50
|
"eslintConfig": {
|
|
54
51
|
"extends": [
|
package/dist/VideoControls.js
DELETED
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import _defineProperty from '@babel/runtime/helpers/defineProperty';
|
|
2
|
-
import _classCallCheck from '@babel/runtime/helpers/classCallCheck';
|
|
3
|
-
import _createClass from '@babel/runtime/helpers/createClass';
|
|
4
|
-
import _inherits from '@babel/runtime/helpers/inherits';
|
|
5
|
-
import _possibleConstructorReturn from '@babel/runtime/helpers/possibleConstructorReturn';
|
|
6
|
-
import _getPrototypeOf from '@babel/runtime/helpers/getPrototypeOf';
|
|
7
|
-
import { Component } from 'react';
|
|
8
|
-
import { ExternalControls } from '@vidispine/vdt-videojs';
|
|
9
|
-
import { jsx } from 'react/jsx-runtime';
|
|
10
|
-
|
|
11
|
-
function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;})),keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=null!=arguments[i]?arguments[i]:{};i%2?ownKeys(Object(source),!0).forEach(function(key){_defineProperty(target,key,source[key]);}):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key));});}return target;}function _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=_getPrototypeOf(Derived),result;if(hasNativeReflectConstruct){var NewTarget=_getPrototypeOf(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else {result=Super.apply(this,arguments);}return _possibleConstructorReturn(this,result);};}function _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}var VideoControls=/*#__PURE__*/function(_Component){_inherits(VideoControls,_Component);var _super=_createSuper(VideoControls);function VideoControls(){_classCallCheck(this,VideoControls);return _super.apply(this,arguments);}_createClass(VideoControls,[{key:"componentDidMount",value:function componentDidMount(){var player=this.props.player;// player prop is the whole react component
|
|
12
|
-
this.controls=new ExternalControls(_objectSpread(_objectSpread({target:this.controlsNode},this.props),{},{player:player.current.player}));this.controls.handleNewProps(this.props);}// eslint-disable-next-line camelcase
|
|
13
|
-
},{key:"UNSAFE_componentWillUpdate",value:function UNSAFE_componentWillUpdate(props){this.controls.handleNewProps(props);}},{key:"render",value:function render(){var _this=this;return/*#__PURE__*/jsx("div",{ref:function ref(node){_this.controlsNode=node;}});}}]);return VideoControls;}(Component);VideoControls.buttonNames=ExternalControls.buttonNames;
|
|
14
|
-
|
|
15
|
-
export { VideoControls };
|
package/dist/VideoPlayer.js
DELETED
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import _defineProperty from '@babel/runtime/helpers/defineProperty';
|
|
2
|
-
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
|
|
3
|
-
import _classCallCheck from '@babel/runtime/helpers/classCallCheck';
|
|
4
|
-
import _createClass from '@babel/runtime/helpers/createClass';
|
|
5
|
-
import _inherits from '@babel/runtime/helpers/inherits';
|
|
6
|
-
import _possibleConstructorReturn from '@babel/runtime/helpers/possibleConstructorReturn';
|
|
7
|
-
import _getPrototypeOf from '@babel/runtime/helpers/getPrototypeOf';
|
|
8
|
-
import { Component } from 'react';
|
|
9
|
-
import { Player } from '@vidispine/vdt-videojs';
|
|
10
|
-
import '@vidispine/vdt-videojs/dist/index.css';
|
|
11
|
-
import { jsx } from 'react/jsx-runtime';
|
|
12
|
-
|
|
13
|
-
var _excluded=["setPlayer"],_excluded2=["setPlayer"];function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;})),keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=null!=arguments[i]?arguments[i]:{};i%2?ownKeys(Object(source),!0).forEach(function(key){_defineProperty(target,key,source[key]);}):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key));});}return target;}function _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=_getPrototypeOf(Derived),result;if(hasNativeReflectConstruct){var NewTarget=_getPrototypeOf(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else {result=Super.apply(this,arguments);}return _possibleConstructorReturn(this,result);};}function _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}var VideoPlayer=/*#__PURE__*/function(_Component){_inherits(VideoPlayer,_Component);var _super=_createSuper(VideoPlayer);function VideoPlayer(){_classCallCheck(this,VideoPlayer);return _super.apply(this,arguments);}_createClass(VideoPlayer,[{key:"componentDidMount",value:function componentDidMount(){var _this$props=this.props,setPlayer=_this$props.setPlayer,playerProps=_objectWithoutProperties(_this$props,_excluded);this.player=new Player(_objectSpread({target:this.videoNode},playerProps));if(setPlayer){setPlayer(this.player);}}// eslint-disable-next-line camelcase
|
|
14
|
-
},{key:"UNSAFE_componentWillUpdate",value:function UNSAFE_componentWillUpdate(props){var _this=this;var createPlayer=function createPlayer(){var setPlayer=props.setPlayer,playerProps=_objectWithoutProperties(props,_excluded2);_this.player=new Player(_objectSpread({target:_this.videoNode},playerProps));if(setPlayer){setPlayer(_this.player);}};if(props.sources&&props.sources[0]&&props.sources[0].src){// sources changed
|
|
15
|
-
if(!(this.props.sources[0].src===props.sources[0].src)){if(this.player){this.player.videojs.pause();// Wait a frame until player is paused
|
|
16
|
-
setTimeout(function(){_this.player.videojs.dispose();createPlayer();},0);}else {createPlayer();}}else {// update reactive props
|
|
17
|
-
this.player.handleNewProps(props);}}}// destroy player on unmount
|
|
18
|
-
},{key:"componentWillUnmount",value:function componentWillUnmount(){var onUnmount=this.props.onUnmount;if(this.player){if(onUnmount)onUnmount(this.player);this.player.destroy();}}// wrap the player in a div with a `data-vjs-player` attribute
|
|
19
|
-
// so videojs won't create additional wrapper in the DOM
|
|
20
|
-
// see https://github.com/videojs/video.js/pull/3856
|
|
21
|
-
},{key:"render",value:function render(){var _this2=this;return/*#__PURE__*/jsx("div",{className:"data-vjs-player",children:/*#__PURE__*/jsx("div",{ref:function ref(node){_this2.videoNode=node;}})});}}]);return VideoPlayer;}(Component);
|
|
22
|
-
|
|
23
|
-
export { VideoPlayer };
|
package/dist/VideoSeekBar.js
DELETED
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import _classCallCheck from '@babel/runtime/helpers/classCallCheck';
|
|
2
|
-
import _createClass from '@babel/runtime/helpers/createClass';
|
|
3
|
-
import _inherits from '@babel/runtime/helpers/inherits';
|
|
4
|
-
import _possibleConstructorReturn from '@babel/runtime/helpers/possibleConstructorReturn';
|
|
5
|
-
import _getPrototypeOf from '@babel/runtime/helpers/getPrototypeOf';
|
|
6
|
-
import { Component } from 'react';
|
|
7
|
-
import { SeekBar } from '@vidispine/vdt-videojs';
|
|
8
|
-
import { jsx } from 'react/jsx-runtime';
|
|
9
|
-
|
|
10
|
-
function _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=_getPrototypeOf(Derived),result;if(hasNativeReflectConstruct){var NewTarget=_getPrototypeOf(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else {result=Super.apply(this,arguments);}return _possibleConstructorReturn(this,result);};}function _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}var VideoSeekBar=/*#__PURE__*/function(_Component){_inherits(VideoSeekBar,_Component);var _super=_createSuper(VideoSeekBar);function VideoSeekBar(){_classCallCheck(this,VideoSeekBar);return _super.apply(this,arguments);}_createClass(VideoSeekBar,[{key:"componentDidMount",value:function componentDidMount(){var _this$props=this.props,player=_this$props.player,bgColor=_this$props.bgColor,fillColor=_this$props.fillColor,markersEnabled=_this$props.markersEnabled,regions=_this$props.regions,onRegionClick=_this$props.onRegionClick;// player prop is the whole react component
|
|
11
|
-
this.seekBar=new SeekBar({target:this.seekBarNode,player:player.current.player,bgColor:bgColor,fillColor:fillColor,markersEnabled:markersEnabled,/* eslint-disable-next-line react/destructuring-assignment */"in":this.props["in"],// can not use "in" with destructuring statement - reserved word
|
|
12
|
-
/* eslint-disable-next-line react/destructuring-assignment */out:this.props.out,regions:regions,onRegionClick:onRegionClick});}// eslint-disable-next-line camelcase
|
|
13
|
-
},{key:"UNSAFE_componentWillUpdate",value:function UNSAFE_componentWillUpdate(props){this.seekBar.handleNewProps(props);}},{key:"render",value:function render(){var _this=this;return/*#__PURE__*/jsx("div",{ref:function ref(node){_this.seekBarNode=node;}});}}]);return VideoSeekBar;}(Component);VideoSeekBar.Region=SeekBar.Region;
|
|
14
|
-
|
|
15
|
-
export { VideoSeekBar, VideoSeekBar as default };
|
package/dist/VideoTimeCode.js
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import _classCallCheck from '@babel/runtime/helpers/classCallCheck';
|
|
2
|
-
import _createClass from '@babel/runtime/helpers/createClass';
|
|
3
|
-
import _inherits from '@babel/runtime/helpers/inherits';
|
|
4
|
-
import _possibleConstructorReturn from '@babel/runtime/helpers/possibleConstructorReturn';
|
|
5
|
-
import _getPrototypeOf from '@babel/runtime/helpers/getPrototypeOf';
|
|
6
|
-
import { Component } from 'react';
|
|
7
|
-
import { TimeCodeDisplay } from '@vidispine/vdt-videojs';
|
|
8
|
-
import { jsx } from 'react/jsx-runtime';
|
|
9
|
-
|
|
10
|
-
function _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=_getPrototypeOf(Derived),result;if(hasNativeReflectConstruct){var NewTarget=_getPrototypeOf(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else {result=Super.apply(this,arguments);}return _possibleConstructorReturn(this,result);};}function _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}var VideoTimeCode=/*#__PURE__*/function(_Component){_inherits(VideoTimeCode,_Component);var _super=_createSuper(VideoTimeCode);function VideoTimeCode(){_classCallCheck(this,VideoTimeCode);return _super.apply(this,arguments);}_createClass(VideoTimeCode,[{key:"componentDidMount",value:function componentDidMount(){var player=this.props.player;// player prop is the whole react component
|
|
11
|
-
this.timeCode=new TimeCodeDisplay({target:this.timecodeNode,player:player.current.player,onInput:player.current.player});this.timeCode.update(this.props);player.current.player.setupTimeCode(this.timeCode);}// eslint-disable-next-line camelcase
|
|
12
|
-
},{key:"UNSAFE_componentWillUpdate",value:function UNSAFE_componentWillUpdate(props){this.timeCode.update(props);}},{key:"render",value:function render(){var _this=this;var _this$props=this.props,className=_this$props.className,styles=_this$props.styles;var ref=function ref(node){_this.timecodeNode=node;};return/*#__PURE__*/jsx("div",{style:styles,className:className,ref:ref});}}]);return VideoTimeCode;}(Component);
|
|
13
|
-
|
|
14
|
-
export { VideoTimeCode, VideoTimeCode as default };
|