UNPKG

@lahzenegar/video-react

Version:

Video-React is a web video player built from the ground up for an HTML5 world using React library.

138 lines (99 loc) 4.08 kB
'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); var _extends2 = require('babel-runtime/helpers/extends'); var _extends3 = _interopRequireDefault(_extends2); var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of'); var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf); var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck'); var _classCallCheck3 = _interopRequireDefault(_classCallCheck2); var _createClass2 = require('babel-runtime/helpers/createClass'); var _createClass3 = _interopRequireDefault(_createClass2); var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn'); var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2); var _inherits2 = require('babel-runtime/helpers/inherits'); var _inherits3 = _interopRequireDefault(_inherits2); var _propTypes = require('prop-types'); var _propTypes2 = _interopRequireDefault(_propTypes); var _react = require('react'); var _react2 = _interopRequireDefault(_react); var _reactDom = require('react-dom'); var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames); var _dom = require('../../utils/dom'); var Dom = _interopRequireWildcard(_dom); var _SeekBar = require('./SeekBar'); var _SeekBar2 = _interopRequireDefault(_SeekBar); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } var propTypes = { player: _propTypes2.default.object, className: _propTypes2.default.string }; var ProgressControl = function (_Component) { (0, _inherits3.default)(ProgressControl, _Component); function ProgressControl(props, context) { (0, _classCallCheck3.default)(this, ProgressControl); var _this = (0, _possibleConstructorReturn3.default)(this, (ProgressControl.__proto__ || (0, _getPrototypeOf2.default)(ProgressControl)).call(this, props, context)); _this.state = { mouseTime: { time: null, position: 0 } }; _this.handleMouseMoveThrottle = _this.handleMouseMove.bind(_this); return _this; } (0, _createClass3.default)(ProgressControl, [{ key: 'handleMouseMove', value: function handleMouseMove(event) { if (!event.pageX) { return; } var _props$player = this.props.player, hasDVR = _props$player.hasDVR, duration = _props$player.duration, playOffset = _props$player.playOffset, mediaDuration = _props$player.mediaDuration; var _duration = void 0; if (hasDVR) { _duration = mediaDuration; } else { _duration = duration; } var node = (0, _reactDom.findDOMNode)(this.seekBar); var newTime = Dom.getPointerPosition(node, event).x * _duration; var position = event.pageX - Dom.findElPosition(node).left; this.setState({ mouseTime: { time: newTime, position: position } }); } }, { key: 'render', value: function render() { var _this2 = this; var className = this.props.className; return _react2.default.createElement( 'div', { onMouseMove: this.handleMouseMoveThrottle, className: (0, _classnames2.default)('video-react-progress-control video-react-control', className) }, _react2.default.createElement(_SeekBar2.default, (0, _extends3.default)({ mouseTime: this.state.mouseTime, ref: function ref(c) { _this2.seekBar = c; } }, this.props)) ); } }]); return ProgressControl; }(_react.Component); exports.default = ProgressControl; ProgressControl.propTypes = propTypes; ProgressControl.displayName = 'ProgressControl';