You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
48 lines
1016 B
48 lines
1016 B
import React from 'react'; |
|
import PropTypes from 'prop-types'; |
|
|
|
class ExtendedVideoPlayer extends React.PureComponent { |
|
|
|
static propTypes = { |
|
src: PropTypes.string.isRequired, |
|
time: PropTypes.number, |
|
controls: PropTypes.bool.isRequired, |
|
muted: PropTypes.bool.isRequired, |
|
}; |
|
|
|
handleLoadedData = () => { |
|
if (this.props.time) { |
|
this.video.currentTime = this.props.time; |
|
} |
|
} |
|
|
|
componentDidMount () { |
|
this.video.addEventListener('loadeddata', this.handleLoadedData); |
|
} |
|
|
|
componentWillUnmount () { |
|
this.video.removeEventListener('loadeddata', this.handleLoadedData); |
|
} |
|
|
|
setRef = (c) => { |
|
this.video = c; |
|
} |
|
|
|
render () { |
|
return ( |
|
<div className='extended-video-player'> |
|
<video |
|
ref={this.setRef} |
|
src={this.props.src} |
|
autoPlay |
|
muted={this.props.muted} |
|
controls={this.props.controls} |
|
loop={!this.props.controls} |
|
/> |
|
</div> |
|
); |
|
} |
|
|
|
} |
|
|
|
export default ExtendedVideoPlayer;
|
|
|