@desynova-digital/player 3.9.6 → 4.0.0

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.
Files changed (130) hide show
  1. package/Player.js +945 -0
  2. package/control/AudioTracksMenuButton.js +91 -0
  3. package/control/AudioTracksMenuButton.jsx +80 -0
  4. package/control/ControlBar.js +303 -0
  5. package/control/ControlBar.jsx +264 -0
  6. package/control/CurrentTimeDisplay.js +34 -0
  7. package/control/CurrentTimeDisplay.jsx +35 -0
  8. package/control/DurationDisplay.js +38 -0
  9. package/control/DurationDisplay.jsx +48 -0
  10. package/control/ForwardBackwardControl.js +76 -0
  11. package/control/ForwardBackwardControl.jsx +79 -0
  12. package/control/FullscreenToggle.js +82 -0
  13. package/control/FullscreenToggle.jsx +83 -0
  14. package/control/MarkInControl.js +124 -0
  15. package/control/MarkInControl.jsx +109 -0
  16. package/control/MarkOutControl.js +137 -0
  17. package/control/MarkOutControl.jsx +131 -0
  18. package/control/MarkerBar.js +127 -0
  19. package/control/MarkerBar.jsx +107 -0
  20. package/control/MarkingControl.js +82 -0
  21. package/control/MarkingControl.jsx +143 -0
  22. package/control/MarkingDuration.js +44 -0
  23. package/control/MarkingPreview.js +49 -0
  24. package/control/MarkingPreview.jsx +60 -0
  25. package/control/PlayBackRateControl.js +106 -0
  26. package/control/PlayBackRateControl.jsx +106 -0
  27. package/control/PlayProgressBar.js +61 -0
  28. package/control/PlayProgressBar.jsx +92 -0
  29. package/control/PlayToggle.js +56 -0
  30. package/control/PlayToggle.jsx +57 -0
  31. package/control/PointersBar.js +231 -0
  32. package/control/PointersBar.jsx +286 -0
  33. package/control/ProgressControl.js +127 -0
  34. package/control/ProgressControl.jsx +155 -0
  35. package/control/SeekBar.js +204 -0
  36. package/control/SeekBar.jsx +229 -0
  37. package/control/SettingsMenuButton.js +63 -0
  38. package/control/SettingsMenuButton.jsx +69 -0
  39. package/control/Slider.js +274 -0
  40. package/control/Slider.jsx +243 -0
  41. package/control/Timeline.js +118 -0
  42. package/control/Timeline.jsx +131 -0
  43. package/control/VolumeBar.js +198 -0
  44. package/control/VolumeBar.jsx +174 -0
  45. package/control/VolumeLevel.js +61 -0
  46. package/control/VolumeLevel.jsx +66 -0
  47. package/control/VolumneMenuButton.js +112 -0
  48. package/control/VolumneMenuButton.jsx +111 -0
  49. package/header/Header.js +309 -0
  50. package/header/Header.jsx +479 -0
  51. package/index.js +9 -151
  52. package/media/AudioMeter.js +381 -0
  53. package/media/AudioMeter.jsx +411 -0
  54. package/media/SDOutline.js +82 -0
  55. package/media/SDOutline.jsx +90 -0
  56. package/media/Video.js +684 -0
  57. package/media/Video.jsx +714 -0
  58. package/package.json +5 -1
  59. package/playlist/Playlist.js +67 -0
  60. package/playlist/Playlist.jsx +91 -0
  61. package/playlist/index.js +13 -0
  62. package/shortcuts/Shortcut.js +662 -0
  63. package/utils/Menu.js +50 -0
  64. package/utils/Menu.jsx +105 -0
  65. package/{colors.js → utils/colors.js} +13 -13
  66. package/utils/index.js +52 -122
  67. package/Manager.js +0 -124
  68. package/actions/player.js +0 -375
  69. package/actions/video.js +0 -230
  70. package/components/AudioMeter.js +0 -414
  71. package/components/BigPlayButton.js +0 -110
  72. package/components/ImageViewer.js +0 -318
  73. package/components/MarkerBar.js +0 -138
  74. package/components/Menu.js +0 -77
  75. package/components/Player.js +0 -821
  76. package/components/PlayerHeader.js +0 -472
  77. package/components/Playlist.js +0 -133
  78. package/components/PointersBar.js +0 -299
  79. package/components/PosterImage.js +0 -61
  80. package/components/SDOutline.js +0 -68
  81. package/components/Shortcut.js +0 -621
  82. package/components/Slider.js +0 -317
  83. package/components/TagsBar.js +0 -100
  84. package/components/Video.js +0 -1431
  85. package/components/control-bar/AudioTracksMenuButton.js +0 -113
  86. package/components/control-bar/CameraButton.js +0 -88
  87. package/components/control-bar/CommentsButton.js +0 -216
  88. package/components/control-bar/ControlBar.js +0 -260
  89. package/components/control-bar/EditorControlMenuButton.js +0 -412
  90. package/components/control-bar/ForwardControl.js +0 -17
  91. package/components/control-bar/ForwardReplayControl.js +0 -122
  92. package/components/control-bar/FullscreenToggle.js +0 -101
  93. package/components/control-bar/PlayToggle.js +0 -98
  94. package/components/control-bar/ReplayControl.js +0 -17
  95. package/components/control-bar/SettingsMenuButton.js +0 -43
  96. package/components/control-bar/SubtitleLanguagesMenuButton.js +0 -174
  97. package/components/control-bar/VolumeMenuButton.js +0 -134
  98. package/components/control-bar/ZoomMenuButton.js +0 -116
  99. package/components/marking-controls/MarkInControl.js +0 -140
  100. package/components/marking-controls/MarkOutControl.js +0 -155
  101. package/components/marking-controls/MarkingAddButton.js +0 -94
  102. package/components/marking-controls/MarkingControl.js +0 -135
  103. package/components/marking-controls/MarkingDeleteButton.js +0 -84
  104. package/components/marking-controls/MarkingDuration.js +0 -77
  105. package/components/marking-controls/MarkingPreview.js +0 -86
  106. package/components/progress-bar/AudioWaveform.js +0 -144
  107. package/components/progress-bar/LoadProgressBar.js +0 -90
  108. package/components/progress-bar/MouseTimeDisplay.js +0 -53
  109. package/components/progress-bar/PlayProgressBar.js +0 -79
  110. package/components/progress-bar/ProgressControl.js +0 -222
  111. package/components/progress-bar/SeekBar.js +0 -261
  112. package/components/progress-bar/Timeline.js +0 -134
  113. package/components/settings-menu-control/PlaybackRateControl.js +0 -147
  114. package/components/settings-menu-control/SafeAreaControl.js +0 -92
  115. package/components/settings-menu-control/SettingsMenu.js +0 -68
  116. package/components/settings-menu-control/SubtitleControl.js +0 -1
  117. package/components/time-controls/CurrentTimeDisplay.js +0 -53
  118. package/components/time-controls/DurationDisplay.js +0 -51
  119. package/components/time-controls/TimeDivider.js +0 -41
  120. package/components/volume-control/VolumeBar.js +0 -216
  121. package/components/volume-control/VolumeControl.js +0 -35
  122. package/components/volume-control/VolumeLevel.js +0 -78
  123. package/components/zoom-control/ZoomBar.js +0 -189
  124. package/components/zoom-control/ZoomLevel.js +0 -68
  125. package/reducers/index.js +0 -23
  126. package/reducers/operation.js +0 -36
  127. package/reducers/player.js +0 -222
  128. package/utils/browser.js +0 -29
  129. package/utils/dom.js +0 -104
  130. package/utils/fullscreen.js +0 -73
@@ -1,113 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
-
7
- var _createClass = function () { 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, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
8
-
9
- var _propTypes = require('prop-types');
10
-
11
- var _react = require('react');
12
-
13
- var _react2 = _interopRequireDefault(_react);
14
-
15
- var _styledComponents = require('styled-components');
16
-
17
- var _styledComponents2 = _interopRequireDefault(_styledComponents);
18
-
19
- var _Menu = require('../Menu');
20
-
21
- var _Menu2 = _interopRequireDefault(_Menu);
22
-
23
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
24
-
25
- function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
26
-
27
- function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
28
-
29
- function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
30
-
31
- var propTypes = {
32
- actions: _propTypes.PropTypes.instanceOf(Object),
33
- player: _propTypes.PropTypes.instanceOf(Object)
34
- };
35
-
36
- var AudioTrackBlock = (0, _styledComponents2.default)('div').withConfig({
37
- displayName: 'AudioTracksMenuButton__AudioTrackBlock',
38
- componentId: 'sc-15v7c9a-0'
39
- })(['text-align:left;background:transparent;cursor:pointer;border-bottom:1px solid #eeeeee;&:last-child{border:none;}&:hover,&:focus{background:rgba(0,206,198,0.1);}p{padding 15px;font-family:SFUIText-Medium;font-size:12px;white-space:nowrap;}']);
40
-
41
- var AudioTracksMenuButton = function (_Component) {
42
- _inherits(AudioTracksMenuButton, _Component);
43
-
44
- function AudioTracksMenuButton(props, context) {
45
- _classCallCheck(this, AudioTracksMenuButton);
46
-
47
- return _possibleConstructorReturn(this, (AudioTracksMenuButton.__proto__ || Object.getPrototypeOf(AudioTracksMenuButton)).call(this, props, context));
48
- }
49
-
50
- _createClass(AudioTracksMenuButton, [{
51
- key: 'changeTrack',
52
- value: function changeTrack(track) {
53
- var actions = this.props.actions;
54
-
55
- actions.handleAudioTrackChange(track);
56
- }
57
- }, {
58
- key: 'render',
59
- value: function render() {
60
- var _this2 = this;
61
-
62
- var _props = this.props,
63
- player = _props.player,
64
- actions = _props.actions;
65
-
66
-
67
- return _react2.default.createElement(
68
- _react2.default.Fragment,
69
- null,
70
- player.audioTracksArr && player.audioTracksArr.length ? _react2.default.createElement(
71
- _Menu2.default,
72
- {
73
- icon: 'audio-track',
74
- player: player,
75
- actions: actions,
76
- style: { marginRight: '10px' },
77
- position: 'left'
78
- },
79
- _react2.default.createElement(
80
- 'div',
81
- { className: 'menu-container' },
82
- player.audioTracksArr.map(function (track) {
83
- return _react2.default.createElement(
84
- AudioTrackBlock,
85
- {
86
- onClick: function onClick() {
87
- return _this2.changeTrack(track);
88
- },
89
- role: 'presentation',
90
- key: track.id,
91
- style: player.activeAudio && player.activeAudio.id === track.id ? { pointerEvents: 'none' } : null
92
- },
93
- _react2.default.createElement(
94
- 'p',
95
- {
96
- style: player.activeAudio && player.activeAudio.id === track.id ? { color: '#00cec6', pointerEvents: 'none' } : { color: '#333333' }
97
- },
98
- track.name
99
- )
100
- );
101
- })
102
- )
103
- ) : null
104
- );
105
- }
106
- }]);
107
-
108
- return AudioTracksMenuButton;
109
- }(_react.Component);
110
-
111
- AudioTracksMenuButton.propTypes = propTypes;
112
- AudioTracksMenuButton.displayName = 'AudioTracksMenuButton';
113
- exports.default = AudioTracksMenuButton;
@@ -1,88 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
-
7
- var _createClass = function () { 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, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
8
-
9
- var _react = require("react");
10
-
11
- var _react2 = _interopRequireDefault(_react);
12
-
13
- var _propTypes = require("prop-types");
14
-
15
- var _styledComponents = require("styled-components");
16
-
17
- var _styledComponents2 = _interopRequireDefault(_styledComponents);
18
-
19
- var _components = require("@desynova-digital/components");
20
-
21
- var _utils = require("../../utils");
22
-
23
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
24
-
25
- function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
26
-
27
- function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
28
-
29
- function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
30
-
31
- var CameraButtonIcon = (0, _styledComponents2.default)(_components.Button).withConfig({
32
- displayName: "CameraButton__CameraButtonIcon",
33
- componentId: "sc-1iapkc3-0"
34
- })(["background:transparent;border:none;margin:0px;margin-right:10px;&:hover,&:focus{background:transparent;}"]);
35
-
36
- var propTypes = {
37
- actions: _propTypes.PropTypes.instanceOf(Object),
38
- player: _propTypes.PropTypes.instanceOf(Object),
39
- handleClick: _propTypes.PropTypes.func
40
- };
41
-
42
- var CameraButton = function (_Component) {
43
- _inherits(CameraButton, _Component);
44
-
45
- function CameraButton(props, context) {
46
- _classCallCheck(this, CameraButton);
47
-
48
- var _this = _possibleConstructorReturn(this, (CameraButton.__proto__ || Object.getPrototypeOf(CameraButton)).call(this, props, context));
49
-
50
- _this.handleClick = _this.handleClick.bind(_this);
51
- return _this;
52
- }
53
-
54
- _createClass(CameraButton, [{
55
- key: "handleClick",
56
- value: function handleClick() {
57
- var _props = this.props,
58
- onTakeSnapshot = _props.onTakeSnapshot,
59
- video = _props.video;
60
-
61
- var timeObj = {
62
- "thumbnail": (0, _utils.secondsToTime)(this.props.video.currentTime, this.props.frameRate, this.props.initialTime),
63
- "thumbnail_seconds": this.props.video.currentTime
64
- };
65
- onTakeSnapshot(timeObj);
66
- }
67
- }, {
68
- key: "render",
69
- value: function render() {
70
- var playerType = this.props.playerType;
71
-
72
- return playerType === 'tagging' && _react2.default.createElement(CameraButtonIcon, {
73
- display: "rounded",
74
- appearance: "cta",
75
- icon: "camera",
76
- iconWidth: 18,
77
- iconHeight: 18,
78
- width: 20,
79
- height: 20,
80
- onClick: this.handleClick
81
- });
82
- }
83
- }]);
84
-
85
- return CameraButton;
86
- }(_react.Component);
87
-
88
- exports.default = CameraButton;
@@ -1,216 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
-
7
- var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
8
-
9
- var _createClass = function () { 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, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
10
-
11
- var _propTypes = require('prop-types');
12
-
13
- var _react = require('react');
14
-
15
- var _react2 = _interopRequireDefault(_react);
16
-
17
- var _styledComponents = require('styled-components');
18
-
19
- var _styledComponents2 = _interopRequireDefault(_styledComponents);
20
-
21
- var _components = require('@desynova-digital/components');
22
-
23
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
24
-
25
- function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
26
-
27
- function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
28
-
29
- function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
30
-
31
- var propTypes = {
32
- player: _propTypes.PropTypes.instanceOf(Object),
33
- onCommentsAdd: _propTypes.PropTypes.func
34
- };
35
-
36
- var CommentsContainer = (0, _styledComponents2.default)('div').withConfig({
37
- displayName: 'CommentsButton__CommentsContainer',
38
- componentId: 'sc-1ao3o9e-0'
39
- })(['position:relative;']);
40
-
41
- var CommentButton = (0, _styledComponents2.default)(_components.Button).withConfig({
42
- displayName: 'CommentsButton__CommentButton',
43
- componentId: 'sc-1ao3o9e-1'
44
- })(['background:transparent;border:none;margin:0 10px !important;&:hover,&:focus{background:transparent;', '{svg path{fill:#00cec6;}}}', '{transform:translate(-50%,-50%);top:50%;left:50%;position:absolute;}'], _components.Icon.Element, _components.Icon.Element);
45
-
46
- var CommentBlock = (0, _styledComponents2.default)('div').withConfig({
47
- displayName: 'CommentsButton__CommentBlock',
48
- componentId: 'sc-1ao3o9e-2'
49
- })(['position:absolute;width:', ';padding:', ';height:', ';overflow:', ';transition:all 250ms ease-in-out;background:#fff;z-index:10;border-radius:10px;top:', ';left:50%;transform:translateX(-50%);', '{border:none;resize:none;}&:after{content:\'\';border-left:6px solid transparent;position:absolute;border-right:6px solid transparent;border-top:6px solid rgb(0,206,198);bottom:-6px;left:50%;transform:translateX(-50%);}'], function (props) {
50
- return props.active ? '300px' : '0px';
51
- }, function (props) {
52
- return props.active ? '15px 45px 15px 15px' : '0px';
53
- }, function (props) {
54
- return props.active ? '100px' : '0px';
55
- }, function (props) {
56
- return props.active ? 'visible' : 'hidden';
57
- }, function (props) {
58
- return props.active ? '-110px' : '0px';
59
- }, _components.Textarea.Element);
60
-
61
- var BackButton = (0, _styledComponents2.default)(_components.Button).withConfig({
62
- displayName: 'CommentsButton__BackButton',
63
- componentId: 'sc-1ao3o9e-3'
64
- })(['background:transparent;border:none;margin:0 !important;width:20px;height:20px;padding:0;right:15px;top:10px;position:absolute;&:hover,&:focus{background:transparent;', '{svg path{fill:#000;}}}', '{transform:translate(-50%,-50%);top:50%;left:50%;position:absolute;svg path{fill:#000;}}'], _components.Icon.Element, _components.Icon.Element);
65
-
66
- var SendButton = (0, _styledComponents2.default)(_components.Button).withConfig({
67
- displayName: 'CommentsButton__SendButton',
68
- componentId: 'sc-1ao3o9e-4'
69
- })(['background:rgba(0,206,198,0.1);border:none;margin:0 !important;width:30px;height:30px;padding:0;position:absolute;right:15px;top:calc(100% - 45px);&:hover,&:focus{background:rgba(0,206,198,0.1);', '{svg path{fill:#00cec6;}}}', '{transform:translate(-50%,-50%);top:50%;left:50%;position:absolute;svg path{fill:#00cec6;}}'], _components.Icon.Element, _components.Icon.Element);
70
-
71
- var EditorControlMenuButton = function (_Component) {
72
- _inherits(EditorControlMenuButton, _Component);
73
-
74
- function EditorControlMenuButton(props) {
75
- _classCallCheck(this, EditorControlMenuButton);
76
-
77
- var _this = _possibleConstructorReturn(this, (EditorControlMenuButton.__proto__ || Object.getPrototypeOf(EditorControlMenuButton)).call(this, props));
78
-
79
- _this.state = {
80
- comment: '',
81
- commentActive: false
82
- };
83
- _this.handleClick = _this.handleClick.bind(_this);
84
- return _this;
85
- }
86
-
87
- _createClass(EditorControlMenuButton, [{
88
- key: 'onCommentEnter',
89
- value: function onCommentEnter() {
90
- var _props = this.props,
91
- player = _props.player,
92
- onCommentsAdd = _props.onCommentsAdd;
93
- var comment = this.state.comment;
94
-
95
- var data = {
96
- comment: comment,
97
- position: player.currentTime
98
- };
99
- onCommentsAdd(data);
100
- this.onCommentClose();
101
- }
102
- }, {
103
- key: 'onCommentClose',
104
- value: function onCommentClose() {
105
- this.setState({
106
- commentActive: false,
107
- comment: ''
108
- });
109
- }
110
- }, {
111
- key: 'onKeyPress',
112
- value: function onKeyPress(event) {
113
- var keyCode = event.keyCode ? event.keyCode : event.which;
114
- var isShiftKey = event.shiftKey;
115
- if (keyCode === 13 && !isShiftKey) {
116
- this.onCommentEnter();
117
- }
118
- }
119
- }, {
120
- key: 'handleClick',
121
- value: function handleClick() {
122
- this.setState({
123
- commentActive: true,
124
- comment: ''
125
- }, function () {
126
- var inputElem = document.querySelectorAll('.comment-block textarea')[0];
127
- if (inputElem) {
128
- inputElem.focus();
129
- }
130
- });
131
- }
132
- }, {
133
- key: 'updateComment',
134
- value: function updateComment(event) {
135
- this.setState({
136
- comment: event.target.value
137
- });
138
- }
139
- }, {
140
- key: 'render',
141
- value: function render() {
142
- var _this2 = this;
143
-
144
- var _state = this.state,
145
- comment = _state.comment,
146
- commentActive = _state.commentActive;
147
-
148
- return _react2.default.createElement(
149
- CommentsContainer,
150
- null,
151
- _react2.default.createElement(CommentButton, {
152
- display: 'rounded',
153
- appearance: 'cta',
154
- icon: 'comment',
155
- iconWidth: 14,
156
- iconHeight: 14,
157
- width: 16,
158
- height: 16,
159
- onClick: this.handleClick
160
- }),
161
- _react2.default.createElement(
162
- CommentBlock,
163
- { className: 'comment-block', active: commentActive },
164
- _react2.default.createElement(BackButton, _extends({
165
- display: 'rounded',
166
- appearance: 'cta',
167
- icon: 'cross',
168
- width: 20,
169
- height: 20,
170
- iconWidth: 10,
171
- iconHeight: 10,
172
- tabIndex: '0',
173
- onClick: function onClick() {
174
- return _this2.onCommentClose();
175
- }
176
- }, this.props)),
177
- _react2.default.createElement(_components.Textarea, {
178
- type: 'text',
179
- label: 'Comment',
180
- value: comment,
181
- resize: false,
182
- rows: '3',
183
- onKeyPress: function onKeyPress(e) {
184
- return _this2.onKeyPress(e);
185
- },
186
- onChange: function onChange(e) {
187
- return _this2.updateComment(e);
188
- },
189
- placeholder: 'Comment'
190
- }),
191
- _react2.default.createElement(SendButton, _extends({
192
- display: 'rounded',
193
- appearance: 'cta',
194
- icon: 'send',
195
- width: 30,
196
- height: 30,
197
- iconWidth: 12,
198
- iconHeight: 11,
199
- tabIndex: '0',
200
- onClick: function onClick() {
201
- return _this2.onCommentEnter();
202
- }
203
- }, this.props))
204
- )
205
- );
206
- }
207
- }]);
208
-
209
- return EditorControlMenuButton;
210
- }(_react.Component);
211
-
212
- exports.default = EditorControlMenuButton;
213
-
214
-
215
- EditorControlMenuButton.propTypes = propTypes;
216
- EditorControlMenuButton.displayName = 'EditorControlMenuButton';
@@ -1,260 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
-
7
- var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
8
-
9
- var _createClass = function () { 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, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
10
-
11
- var _propTypes = require('prop-types');
12
-
13
- var _react = require('react');
14
-
15
- var _react2 = _interopRequireDefault(_react);
16
-
17
- var _styledComponents = require('styled-components');
18
-
19
- var _styledComponents2 = _interopRequireDefault(_styledComponents);
20
-
21
- var _PlayToggle = require('./PlayToggle');
22
-
23
- var _PlayToggle2 = _interopRequireDefault(_PlayToggle);
24
-
25
- var _ForwardControl = require('./ForwardControl');
26
-
27
- var _ForwardControl2 = _interopRequireDefault(_ForwardControl);
28
-
29
- var _ReplayControl = require('./ReplayControl');
30
-
31
- var _ReplayControl2 = _interopRequireDefault(_ReplayControl);
32
-
33
- var _FullscreenToggle = require('./FullscreenToggle');
34
-
35
- var _FullscreenToggle2 = _interopRequireDefault(_FullscreenToggle);
36
-
37
- var _CurrentTimeDisplay = require('../time-controls/CurrentTimeDisplay');
38
-
39
- var _CurrentTimeDisplay2 = _interopRequireDefault(_CurrentTimeDisplay);
40
-
41
- var _DurationDisplay = require('../time-controls/DurationDisplay');
42
-
43
- var _DurationDisplay2 = _interopRequireDefault(_DurationDisplay);
44
-
45
- var _TimeDivider = require('../time-controls/TimeDivider');
46
-
47
- var _TimeDivider2 = _interopRequireDefault(_TimeDivider);
48
-
49
- var _SettingsMenuButton = require('./SettingsMenuButton');
50
-
51
- var _SettingsMenuButton2 = _interopRequireDefault(_SettingsMenuButton);
52
-
53
- var _AudioTracksMenuButton = require('./AudioTracksMenuButton');
54
-
55
- var _AudioTracksMenuButton2 = _interopRequireDefault(_AudioTracksMenuButton);
56
-
57
- var _VolumeMenuButton = require('./VolumeMenuButton');
58
-
59
- var _VolumeMenuButton2 = _interopRequireDefault(_VolumeMenuButton);
60
-
61
- var _utils = require('../../utils');
62
-
63
- var _colors = require('../../colors');
64
-
65
- var _colors2 = _interopRequireDefault(_colors);
66
-
67
- var _MarkingControl = require('../marking-controls/MarkingControl');
68
-
69
- var _MarkingControl2 = _interopRequireDefault(_MarkingControl);
70
-
71
- var _SubtitleLanguagesMenuButton = require('./SubtitleLanguagesMenuButton');
72
-
73
- var _SubtitleLanguagesMenuButton2 = _interopRequireDefault(_SubtitleLanguagesMenuButton);
74
-
75
- var _CameraButton = require('./CameraButton');
76
-
77
- var _CameraButton2 = _interopRequireDefault(_CameraButton);
78
-
79
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
80
-
81
- function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
82
-
83
- function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
84
-
85
- function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
86
- // import CommentsButton from './CommentsButton';
87
-
88
-
89
- var propTypes = {
90
- autoHide: _propTypes.PropTypes.bool,
91
- className: _propTypes.PropTypes.string,
92
- controlType: _propTypes.PropTypes.string,
93
- fileType: _propTypes.PropTypes.oneOf(['video', 'image', 'audio']),
94
- playerType: _propTypes.PropTypes.oneOf(['dubbing_review', 'clipping_default', 'default', 'tagging', 'qc', 'subtitle', 'snp_edit', 'archive', 'restore', 'clipping', 'storyboard', 'panel']),
95
- children: _propTypes.PropTypes.arrayOf(_propTypes.PropTypes.element),
96
- player: _propTypes.PropTypes.instanceOf(Object)
97
- };
98
-
99
- var PlayerControlBlock = _styledComponents2.default.div.withConfig({
100
- displayName: 'ControlBar__PlayerControlBlock',
101
- componentId: 'sc-u3uawu-0'
102
- })(['width:100%;height:', ';overflow:', ';position:', ';bottom:', ';background:', ';display:flex;justify-content:flex-start;align-items:center;transition:all 250ms ease-in-out;'], function (props) {
103
- return props.player === 'panel' && props.active || props.player !== 'panel' ? '50px' : '0px';
104
- }, function (props) {
105
- return props.player === 'panel' && props.active || props.player !== 'panel' ? 'visible' : 'hidden';
106
- }, function (props) {
107
- return props.player === 'panel' ? 'absolute' : 'relative';
108
- }, function (props) {
109
- return props.player === 'panel' ? '0px' : 'initial';
110
- }, _colors2.default.common.base.black);
111
-
112
- var VideoControlBlock = _styledComponents2.default.div.withConfig({
113
- displayName: 'ControlBar__VideoControlBlock',
114
- componentId: 'sc-u3uawu-1'
115
- })(['width:100%;display:flex;justify-content:flex-start;align-items:center;']);
116
-
117
- var defaultProps = {
118
- autoHide: false,
119
- className: ''
120
- };
121
-
122
- var ControlBar = function (_Component) {
123
- _inherits(ControlBar, _Component);
124
-
125
- function ControlBar(props) {
126
- _classCallCheck(this, ControlBar);
127
-
128
- var _this = _possibleConstructorReturn(this, (ControlBar.__proto__ || Object.getPrototypeOf(ControlBar)).call(this, props));
129
-
130
- _this.getDefaultChildren = _this.getDefaultChildren.bind(_this);
131
- _this.getAdvancedChildren = _this.getAdvancedChildren.bind(_this);
132
- return _this;
133
- }
134
-
135
- _createClass(ControlBar, [{
136
- key: 'getDefaultChildren',
137
- value: function getDefaultChildren() {
138
- var playerType = this.props.playerType;
139
-
140
- return [_react2.default.createElement(_PlayToggle2.default, _extends({}, this.props, { key: 'play-toggle', order: 2 })), _react2.default.createElement(_ReplayControl2.default, _extends({}, this.props, { seconds: 10, key: 'replay-control-10', order: 3 })), _react2.default.createElement(_ReplayControl2.default, _extends({}, this.props, { key: 'replay-control', order: 3.1 })), _react2.default.createElement(_ForwardControl2.default, _extends({}, this.props, { key: 'forward-control', order: 4 })), _react2.default.createElement(_ForwardControl2.default, _extends({}, this.props, { seconds: 10, key: 'forward-control-10', order: 4.1 })), _react2.default.createElement(_CurrentTimeDisplay2.default, _extends({}, this.props, {
141
- key: 'current-time-display',
142
- order: 5.1
143
- })), _react2.default.createElement(_TimeDivider2.default, _extends({}, this.props, { key: 'time-divider', order: 5.2 })), _react2.default.createElement(_DurationDisplay2.default, _extends({}, this.props, { key: 'duration-display', order: 5.3 })), _react2.default.createElement(_MarkingControl2.default, _extends({}, this.props, { key: 'marking-controls', order: 6 })),
144
- // <CommentsButton {...this.props} key="comments-button" order={6.01} />,
145
- // <EditorControlMenuButton
146
- // style={{ margin: 'auto 10px auto auto' }}
147
- // {...this.props}
148
- // key="edit-menu-button"
149
- // order={6.1}
150
- // />,
151
- _react2.default.createElement(_VolumeMenuButton2.default, _extends({
152
- style: { margin: 'auto 10px auto auto' }
153
- }, this.props, {
154
- key: 'volume-menu-button',
155
- order: 7
156
- })), _react2.default.createElement(_SubtitleLanguagesMenuButton2.default, _extends({}, this.props, {
157
- key: 'subtitle-menu-button',
158
- order: 7
159
- })), _react2.default.createElement(_AudioTracksMenuButton2.default, _extends({}, this.props, {
160
- key: 'audio-tracks-menu-button',
161
- order: 7
162
- })), _react2.default.createElement(_SettingsMenuButton2.default, _extends({}, this.props, {
163
- key: 'settings-menu-button',
164
- order: 8
165
- })), _react2.default.createElement(_FullscreenToggle2.default, _extends({}, this.props, { key: 'fullscreen-toggle', order: 9, style: { marginRight: '10px' } }))];
166
- }
167
- }, {
168
- key: 'getAdvancedChildren',
169
- value: function getAdvancedChildren() {
170
- var playerType = this.props.playerType;
171
-
172
- return [_react2.default.createElement(_PlayToggle2.default, _extends({}, this.props, { key: 'play-toggle', order: 2 })), _react2.default.createElement(_ReplayControl2.default, _extends({}, this.props, { seconds: 10, key: 'replay-control-10', order: 3 })), _react2.default.createElement(_ReplayControl2.default, _extends({}, this.props, { key: 'replay-control', order: 3.1 })), _react2.default.createElement(_ForwardControl2.default, _extends({}, this.props, { key: 'forward-control', order: 4 })), _react2.default.createElement(_ForwardControl2.default, _extends({}, this.props, { seconds: 10, key: 'forward-control-10', order: 4.1 })), _react2.default.createElement(_CurrentTimeDisplay2.default, _extends({}, this.props, {
173
- key: 'current-time-display',
174
- order: 5.1
175
- })), _react2.default.createElement(_TimeDivider2.default, _extends({}, this.props, { key: 'time-divider', order: 5.2 })), _react2.default.createElement(_DurationDisplay2.default, _extends({}, this.props, { key: 'duration-display', order: 5.3 })), _react2.default.createElement(_MarkingControl2.default, _extends({}, this.props, { key: 'marking-controls', order: 6 })),
176
- // {/* <CommentsButton {...this.props} key="comments-button" order={6.01} />, */}
177
- // {/* <ZoomMenuButton
178
- // style={{ marginLeft: '0 10px' }}
179
- // {...this.props}
180
- // key="zoom-menu-button"
181
- // order={7}
182
- // />, */}
183
- // <EditorControlMenuButton
184
- // style={{ margin: 'auto 10px auto auto' }}
185
- // {...this.props}
186
- // key="edit-menu-button"
187
- // order={7}
188
- // />,
189
- _react2.default.createElement(_VolumeMenuButton2.default, _extends({
190
- style: { margin: 'auto 10px auto auto' }
191
- }, this.props, {
192
- key: 'volume-menu-button',
193
- order: 8
194
- })), _react2.default.createElement(_SubtitleLanguagesMenuButton2.default, _extends({}, this.props, {
195
- key: 'subtitle-menu-button',
196
- order: 8
197
- })), _react2.default.createElement(_CameraButton2.default, {
198
- order: 9,
199
- playerType: playerType
200
- }), _react2.default.createElement(_AudioTracksMenuButton2.default, _extends({}, this.props, {
201
- key: 'audio-tracks-menu-button',
202
- order: 9
203
- })), _react2.default.createElement(_SettingsMenuButton2.default, _extends({}, this.props, {
204
- key: 'settings-menu-button',
205
- order: 10
206
- })), _react2.default.createElement(_FullscreenToggle2.default, _extends({}, this.props, { key: 'fullscreen-toggle', order: 11, style: { marginRight: '10px' } }))];
207
- }
208
- }, {
209
- key: 'getImageChildrens',
210
- value: function getImageChildrens() {
211
- return [];
212
- }
213
- }, {
214
- key: 'getChildren',
215
- value: function getChildren() {
216
- var _props = this.props,
217
- controlType = _props.controlType,
218
- children = _props.children,
219
- fileType = _props.fileType,
220
- player = _props.player;
221
-
222
- var childrens = _react2.default.Children.toArray(children);
223
- var defaultChildren = [];
224
- if (fileType === 'image') {
225
- defaultChildren = this.getImageChildrens();
226
- } else {
227
- defaultChildren = controlType === 'advanced' && !player.isFullscreen ? this.getAdvancedChildren() : this.getDefaultChildren();
228
- }
229
-
230
- return (0, _utils.mergeAndSortChildren)(defaultChildren, childrens, this.props);
231
- }
232
- }, {
233
- key: 'render',
234
- value: function render() {
235
- var children = this.getChildren();
236
- var _props2 = this.props,
237
- userActivity = _props2.player.userActivity,
238
- playerType = _props2.playerType;
239
-
240
- return _react2.default.createElement(
241
- PlayerControlBlock,
242
- { active: userActivity, player: playerType },
243
- _react2.default.createElement(
244
- VideoControlBlock,
245
- this.props,
246
- children
247
- )
248
- );
249
- }
250
- }]);
251
-
252
- return ControlBar;
253
- }(_react.Component);
254
-
255
- exports.default = ControlBar;
256
-
257
-
258
- ControlBar.propTypes = propTypes;
259
- ControlBar.defaultProps = defaultProps;
260
- ControlBar.displayName = 'ControlBar';