@desynova-digital/player 3.9.7 → 4.0.1

package/components/control-bar/AudioTracksMenuButton.js

@@ -1,113 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-
-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; }; }();
-
-var _propTypes = require('prop-types');
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _styledComponents = require('styled-components');
-
-var _styledComponents2 = _interopRequireDefault(_styledComponents);
-
-var _Menu = require('../Menu');
-
-var _Menu2 = _interopRequireDefault(_Menu);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-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; }
-
-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; }
-
-var propTypes = {
-  actions: _propTypes.PropTypes.instanceOf(Object),
-  player: _propTypes.PropTypes.instanceOf(Object)
-};
-
-var AudioTrackBlock = (0, _styledComponents2.default)('div').withConfig({
-  displayName: 'AudioTracksMenuButton__AudioTrackBlock',
-  componentId: 'sc-15v7c9a-0'
-})(['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;}']);
-
-var AudioTracksMenuButton = function (_Component) {
-  _inherits(AudioTracksMenuButton, _Component);
-
-  function AudioTracksMenuButton(props, context) {
-    _classCallCheck(this, AudioTracksMenuButton);
-
-    return _possibleConstructorReturn(this, (AudioTracksMenuButton.__proto__ || Object.getPrototypeOf(AudioTracksMenuButton)).call(this, props, context));
-  }
-
-  _createClass(AudioTracksMenuButton, [{
-    key: 'changeTrack',
-    value: function changeTrack(track) {
-      var actions = this.props.actions;
-
-      actions.handleAudioTrackChange(track);
-    }
-  }, {
-    key: 'render',
-    value: function render() {
-      var _this2 = this;
-
-      var _props = this.props,
-          player = _props.player,
-          actions = _props.actions;
-
-
-      return _react2.default.createElement(
-        _react2.default.Fragment,
-        null,
-        player.audioTracksArr && player.audioTracksArr.length ? _react2.default.createElement(
-          _Menu2.default,
-          {
-            icon: 'audio-track',
-            player: player,
-            actions: actions,
-            style: { marginRight: '10px' },
-            position: 'left'
-          },
-          _react2.default.createElement(
-            'div',
-            { className: 'menu-container' },
-            player.audioTracksArr.map(function (track) {
-              return _react2.default.createElement(
-                AudioTrackBlock,
-                {
-                  onClick: function onClick() {
-                    return _this2.changeTrack(track);
-                  },
-                  role: 'presentation',
-                  key: track.id,
-                  style: player.activeAudio && player.activeAudio.id === track.id ? { pointerEvents: 'none' } : null
-                },
-                _react2.default.createElement(
-                  'p',
-                  {
-                    style: player.activeAudio && player.activeAudio.id === track.id ? { color: '#00cec6', pointerEvents: 'none' } : { color: '#333333' }
-                  },
-                  track.name
-                )
-              );
-            })
-          )
-        ) : null
-      );
-    }
-  }]);
-
-  return AudioTracksMenuButton;
-}(_react.Component);
-
-AudioTracksMenuButton.propTypes = propTypes;
-AudioTracksMenuButton.displayName = 'AudioTracksMenuButton';
-exports.default = AudioTracksMenuButton;

package/components/control-bar/CameraButton.js

@@ -1,88 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-
-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; }; }();
-
-var _react = require("react");
-
-var _react2 = _interopRequireDefault(_react);
-
-var _propTypes = require("prop-types");
-
-var _styledComponents = require("styled-components");
-
-var _styledComponents2 = _interopRequireDefault(_styledComponents);
-
-var _components = require("@desynova-digital/components");
-
-var _utils = require("../../utils");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-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; }
-
-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; }
-
-var CameraButtonIcon = (0, _styledComponents2.default)(_components.Button).withConfig({
-    displayName: "CameraButton__CameraButtonIcon",
-    componentId: "sc-1iapkc3-0"
-})(["background:transparent;border:none;margin:0px;margin-right:10px;&:hover,&:focus{background:transparent;}"]);
-
-var propTypes = {
-    actions: _propTypes.PropTypes.instanceOf(Object),
-    player: _propTypes.PropTypes.instanceOf(Object),
-    handleClick: _propTypes.PropTypes.func
-};
-
-var CameraButton = function (_Component) {
-    _inherits(CameraButton, _Component);
-
-    function CameraButton(props, context) {
-        _classCallCheck(this, CameraButton);
-
-        var _this = _possibleConstructorReturn(this, (CameraButton.__proto__ || Object.getPrototypeOf(CameraButton)).call(this, props, context));
-
-        _this.handleClick = _this.handleClick.bind(_this);
-        return _this;
-    }
-
-    _createClass(CameraButton, [{
-        key: "handleClick",
-        value: function handleClick() {
-            var _props = this.props,
-                onTakeSnapshot = _props.onTakeSnapshot,
-                video = _props.video;
-
-            var timeObj = {
-                "thumbnail": (0, _utils.secondsToTime)(this.props.video.currentTime, this.props.frameRate, this.props.initialTime),
-                "thumbnail_seconds": this.props.video.currentTime
-            };
-            onTakeSnapshot(timeObj);
-        }
-    }, {
-        key: "render",
-        value: function render() {
-            var playerType = this.props.playerType;
-
-            return playerType === 'tagging' && _react2.default.createElement(CameraButtonIcon, {
-                display: "rounded",
-                appearance: "cta",
-                icon: "camera",
-                iconWidth: 18,
-                iconHeight: 18,
-                width: 20,
-                height: 20,
-                onClick: this.handleClick
-            });
-        }
-    }]);
-
-    return CameraButton;
-}(_react.Component);
-
-exports.default = CameraButton;

package/components/control-bar/CommentsButton.js

@@ -1,216 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-
-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; };
-
-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; }; }();
-
-var _propTypes = require('prop-types');
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _styledComponents = require('styled-components');
-
-var _styledComponents2 = _interopRequireDefault(_styledComponents);
-
-var _components = require('@desynova-digital/components');
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-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; }
-
-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; }
-
-var propTypes = {
-  player: _propTypes.PropTypes.instanceOf(Object),
-  onCommentsAdd: _propTypes.PropTypes.func
-};
-
-var CommentsContainer = (0, _styledComponents2.default)('div').withConfig({
-  displayName: 'CommentsButton__CommentsContainer',
-  componentId: 'sc-1ao3o9e-0'
-})(['position:relative;']);
-
-var CommentButton = (0, _styledComponents2.default)(_components.Button).withConfig({
-  displayName: 'CommentsButton__CommentButton',
-  componentId: 'sc-1ao3o9e-1'
-})(['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);
-
-var CommentBlock = (0, _styledComponents2.default)('div').withConfig({
-  displayName: 'CommentsButton__CommentBlock',
-  componentId: 'sc-1ao3o9e-2'
-})(['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) {
-  return props.active ? '300px' : '0px';
-}, function (props) {
-  return props.active ? '15px 45px 15px 15px' : '0px';
-}, function (props) {
-  return props.active ? '100px' : '0px';
-}, function (props) {
-  return props.active ? 'visible' : 'hidden';
-}, function (props) {
-  return props.active ? '-110px' : '0px';
-}, _components.Textarea.Element);
-
-var BackButton = (0, _styledComponents2.default)(_components.Button).withConfig({
-  displayName: 'CommentsButton__BackButton',
-  componentId: 'sc-1ao3o9e-3'
-})(['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);
-
-var SendButton = (0, _styledComponents2.default)(_components.Button).withConfig({
-  displayName: 'CommentsButton__SendButton',
-  componentId: 'sc-1ao3o9e-4'
-})(['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);
-
-var EditorControlMenuButton = function (_Component) {
-  _inherits(EditorControlMenuButton, _Component);
-
-  function EditorControlMenuButton(props) {
-    _classCallCheck(this, EditorControlMenuButton);
-
-    var _this = _possibleConstructorReturn(this, (EditorControlMenuButton.__proto__ || Object.getPrototypeOf(EditorControlMenuButton)).call(this, props));
-
-    _this.state = {
-      comment: '',
-      commentActive: false
-    };
-    _this.handleClick = _this.handleClick.bind(_this);
-    return _this;
-  }
-
-  _createClass(EditorControlMenuButton, [{
-    key: 'onCommentEnter',
-    value: function onCommentEnter() {
-      var _props = this.props,
-          player = _props.player,
-          onCommentsAdd = _props.onCommentsAdd;
-      var comment = this.state.comment;
-
-      var data = {
-        comment: comment,
-        position: player.currentTime
-      };
-      onCommentsAdd(data);
-      this.onCommentClose();
-    }
-  }, {
-    key: 'onCommentClose',
-    value: function onCommentClose() {
-      this.setState({
-        commentActive: false,
-        comment: ''
-      });
-    }
-  }, {
-    key: 'onKeyPress',
-    value: function onKeyPress(event) {
-      var keyCode = event.keyCode ? event.keyCode : event.which;
-      var isShiftKey = event.shiftKey;
-      if (keyCode === 13 && !isShiftKey) {
-        this.onCommentEnter();
-      }
-    }
-  }, {
-    key: 'handleClick',
-    value: function handleClick() {
-      this.setState({
-        commentActive: true,
-        comment: ''
-      }, function () {
-        var inputElem = document.querySelectorAll('.comment-block textarea')[0];
-        if (inputElem) {
-          inputElem.focus();
-        }
-      });
-    }
-  }, {
-    key: 'updateComment',
-    value: function updateComment(event) {
-      this.setState({
-        comment: event.target.value
-      });
-    }
-  }, {
-    key: 'render',
-    value: function render() {
-      var _this2 = this;
-
-      var _state = this.state,
-          comment = _state.comment,
-          commentActive = _state.commentActive;
-
-      return _react2.default.createElement(
-        CommentsContainer,
-        null,
-        _react2.default.createElement(CommentButton, {
-          display: 'rounded',
-          appearance: 'cta',
-          icon: 'comment',
-          iconWidth: 14,
-          iconHeight: 14,
-          width: 16,
-          height: 16,
-          onClick: this.handleClick
-        }),
-        _react2.default.createElement(
-          CommentBlock,
-          { className: 'comment-block', active: commentActive },
-          _react2.default.createElement(BackButton, _extends({
-            display: 'rounded',
-            appearance: 'cta',
-            icon: 'cross',
-            width: 20,
-            height: 20,
-            iconWidth: 10,
-            iconHeight: 10,
-            tabIndex: '0',
-            onClick: function onClick() {
-              return _this2.onCommentClose();
-            }
-          }, this.props)),
-          _react2.default.createElement(_components.Textarea, {
-            type: 'text',
-            label: 'Comment',
-            value: comment,
-            resize: false,
-            rows: '3',
-            onKeyPress: function onKeyPress(e) {
-              return _this2.onKeyPress(e);
-            },
-            onChange: function onChange(e) {
-              return _this2.updateComment(e);
-            },
-            placeholder: 'Comment'
-          }),
-          _react2.default.createElement(SendButton, _extends({
-            display: 'rounded',
-            appearance: 'cta',
-            icon: 'send',
-            width: 30,
-            height: 30,
-            iconWidth: 12,
-            iconHeight: 11,
-            tabIndex: '0',
-            onClick: function onClick() {
-              return _this2.onCommentEnter();
-            }
-          }, this.props))
-        )
-      );
-    }
-  }]);
-
-  return EditorControlMenuButton;
-}(_react.Component);
-
-exports.default = EditorControlMenuButton;
-
-
-EditorControlMenuButton.propTypes = propTypes;
-EditorControlMenuButton.displayName = 'EditorControlMenuButton';

package/components/control-bar/ControlBar.js

@@ -1,260 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-
-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; };
-
-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; }; }();
-
-var _propTypes = require('prop-types');
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _styledComponents = require('styled-components');
-
-var _styledComponents2 = _interopRequireDefault(_styledComponents);
-
-var _PlayToggle = require('./PlayToggle');
-
-var _PlayToggle2 = _interopRequireDefault(_PlayToggle);
-
-var _ForwardControl = require('./ForwardControl');
-
-var _ForwardControl2 = _interopRequireDefault(_ForwardControl);
-
-var _ReplayControl = require('./ReplayControl');
-
-var _ReplayControl2 = _interopRequireDefault(_ReplayControl);
-
-var _FullscreenToggle = require('./FullscreenToggle');
-
-var _FullscreenToggle2 = _interopRequireDefault(_FullscreenToggle);
-
-var _CurrentTimeDisplay = require('../time-controls/CurrentTimeDisplay');
-
-var _CurrentTimeDisplay2 = _interopRequireDefault(_CurrentTimeDisplay);
-
-var _DurationDisplay = require('../time-controls/DurationDisplay');
-
-var _DurationDisplay2 = _interopRequireDefault(_DurationDisplay);
-
-var _TimeDivider = require('../time-controls/TimeDivider');
-
-var _TimeDivider2 = _interopRequireDefault(_TimeDivider);
-
-var _SettingsMenuButton = require('./SettingsMenuButton');
-
-var _SettingsMenuButton2 = _interopRequireDefault(_SettingsMenuButton);
-
-var _AudioTracksMenuButton = require('./AudioTracksMenuButton');
-
-var _AudioTracksMenuButton2 = _interopRequireDefault(_AudioTracksMenuButton);
-
-var _VolumeMenuButton = require('./VolumeMenuButton');
-
-var _VolumeMenuButton2 = _interopRequireDefault(_VolumeMenuButton);
-
-var _utils = require('../../utils');
-
-var _colors = require('../../colors');
-
-var _colors2 = _interopRequireDefault(_colors);
-
-var _MarkingControl = require('../marking-controls/MarkingControl');
-
-var _MarkingControl2 = _interopRequireDefault(_MarkingControl);
-
-var _SubtitleLanguagesMenuButton = require('./SubtitleLanguagesMenuButton');
-
-var _SubtitleLanguagesMenuButton2 = _interopRequireDefault(_SubtitleLanguagesMenuButton);
-
-var _CameraButton = require('./CameraButton');
-
-var _CameraButton2 = _interopRequireDefault(_CameraButton);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-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; }
-
-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; }
-// import CommentsButton from './CommentsButton';
-
-
-var propTypes = {
-  autoHide: _propTypes.PropTypes.bool,
-  className: _propTypes.PropTypes.string,
-  controlType: _propTypes.PropTypes.string,
-  fileType: _propTypes.PropTypes.oneOf(['video', 'image', 'audio']),
-  playerType: _propTypes.PropTypes.oneOf(['dubbing_review', 'clipping_default', 'default', 'tagging', 'qc', 'subtitle', 'snp_edit', 'archive', 'restore', 'clipping', 'storyboard', 'panel']),
-  children: _propTypes.PropTypes.arrayOf(_propTypes.PropTypes.element),
-  player: _propTypes.PropTypes.instanceOf(Object)
-};
-
-var PlayerControlBlock = _styledComponents2.default.div.withConfig({
-  displayName: 'ControlBar__PlayerControlBlock',
-  componentId: 'sc-u3uawu-0'
-})(['width:100%;height:', ';overflow:', ';position:', ';bottom:', ';background:', ';display:flex;justify-content:flex-start;align-items:center;transition:all 250ms ease-in-out;'], function (props) {
-  return props.player === 'panel' && props.active || props.player !== 'panel' ? '50px' : '0px';
-}, function (props) {
-  return props.player === 'panel' && props.active || props.player !== 'panel' ? 'visible' : 'hidden';
-}, function (props) {
-  return props.player === 'panel' ? 'absolute' : 'relative';
-}, function (props) {
-  return props.player === 'panel' ? '0px' : 'initial';
-}, _colors2.default.common.base.black);
-
-var VideoControlBlock = _styledComponents2.default.div.withConfig({
-  displayName: 'ControlBar__VideoControlBlock',
-  componentId: 'sc-u3uawu-1'
-})(['width:100%;display:flex;justify-content:flex-start;align-items:center;']);
-
-var defaultProps = {
-  autoHide: false,
-  className: ''
-};
-
-var ControlBar = function (_Component) {
-  _inherits(ControlBar, _Component);
-
-  function ControlBar(props) {
-    _classCallCheck(this, ControlBar);
-
-    var _this = _possibleConstructorReturn(this, (ControlBar.__proto__ || Object.getPrototypeOf(ControlBar)).call(this, props));
-
-    _this.getDefaultChildren = _this.getDefaultChildren.bind(_this);
-    _this.getAdvancedChildren = _this.getAdvancedChildren.bind(_this);
-    return _this;
-  }
-
-  _createClass(ControlBar, [{
-    key: 'getDefaultChildren',
-    value: function getDefaultChildren() {
-      var playerType = this.props.playerType;
-
-      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, {
-        key: 'current-time-display',
-        order: 5.1
-      })), _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 })),
-      // <CommentsButton {...this.props} key="comments-button" order={6.01} />,
-      // <EditorControlMenuButton
-      //   style={{ margin: 'auto 10px auto auto' }}
-      //   {...this.props}
-      //   key="edit-menu-button"
-      //   order={6.1}
-      // />,
-      _react2.default.createElement(_VolumeMenuButton2.default, _extends({
-        style: { margin: 'auto 10px auto auto' }
-      }, this.props, {
-        key: 'volume-menu-button',
-        order: 7
-      })), _react2.default.createElement(_SubtitleLanguagesMenuButton2.default, _extends({}, this.props, {
-        key: 'subtitle-menu-button',
-        order: 7
-      })), _react2.default.createElement(_AudioTracksMenuButton2.default, _extends({}, this.props, {
-        key: 'audio-tracks-menu-button',
-        order: 7
-      })), _react2.default.createElement(_SettingsMenuButton2.default, _extends({}, this.props, {
-        key: 'settings-menu-button',
-        order: 8
-      })), _react2.default.createElement(_FullscreenToggle2.default, _extends({}, this.props, { key: 'fullscreen-toggle', order: 9, style: { marginRight: '10px' } }))];
-    }
-  }, {
-    key: 'getAdvancedChildren',
-    value: function getAdvancedChildren() {
-      var playerType = this.props.playerType;
-
-      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, {
-        key: 'current-time-display',
-        order: 5.1
-      })), _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 })),
-      // {/* <CommentsButton {...this.props} key="comments-button" order={6.01} />, */}
-      // {/* <ZoomMenuButton
-      //   style={{ marginLeft: '0 10px' }}
-      //   {...this.props}
-      //   key="zoom-menu-button"
-      //   order={7}
-      // />, */}
-      // <EditorControlMenuButton
-      //   style={{ margin: 'auto 10px auto auto' }}
-      //   {...this.props}
-      //   key="edit-menu-button"
-      //   order={7}
-      // />,
-      _react2.default.createElement(_VolumeMenuButton2.default, _extends({
-        style: { margin: 'auto 10px auto auto' }
-      }, this.props, {
-        key: 'volume-menu-button',
-        order: 8
-      })), _react2.default.createElement(_SubtitleLanguagesMenuButton2.default, _extends({}, this.props, {
-        key: 'subtitle-menu-button',
-        order: 8
-      })), _react2.default.createElement(_CameraButton2.default, {
-        order: 9,
-        playerType: playerType
-      }), _react2.default.createElement(_AudioTracksMenuButton2.default, _extends({}, this.props, {
-        key: 'audio-tracks-menu-button',
-        order: 9
-      })), _react2.default.createElement(_SettingsMenuButton2.default, _extends({}, this.props, {
-        key: 'settings-menu-button',
-        order: 10
-      })), _react2.default.createElement(_FullscreenToggle2.default, _extends({}, this.props, { key: 'fullscreen-toggle', order: 11, style: { marginRight: '10px' } }))];
-    }
-  }, {
-    key: 'getImageChildrens',
-    value: function getImageChildrens() {
-      return [];
-    }
-  }, {
-    key: 'getChildren',
-    value: function getChildren() {
-      var _props = this.props,
-          controlType = _props.controlType,
-          children = _props.children,
-          fileType = _props.fileType,
-          player = _props.player;
-
-      var childrens = _react2.default.Children.toArray(children);
-      var defaultChildren = [];
-      if (fileType === 'image') {
-        defaultChildren = this.getImageChildrens();
-      } else {
-        defaultChildren = controlType === 'advanced' && !player.isFullscreen ? this.getAdvancedChildren() : this.getDefaultChildren();
-      }
-
-      return (0, _utils.mergeAndSortChildren)(defaultChildren, childrens, this.props);
-    }
-  }, {
-    key: 'render',
-    value: function render() {
-      var children = this.getChildren();
-      var _props2 = this.props,
-          userActivity = _props2.player.userActivity,
-          playerType = _props2.playerType;
-
-      return _react2.default.createElement(
-        PlayerControlBlock,
-        { active: userActivity, player: playerType },
-        _react2.default.createElement(
-          VideoControlBlock,
-          this.props,
-          children
-        )
-      );
-    }
-  }]);
-
-  return ControlBar;
-}(_react.Component);
-
-exports.default = ControlBar;
-
-
-ControlBar.propTypes = propTypes;
-ControlBar.defaultProps = defaultProps;
-ControlBar.displayName = 'ControlBar';