blob: 75e53b4062e9c98524182afd85074964b7741c6a (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
|
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { PlayButton, PlayerTime, VolumeControl } from './viewer.icons'
class NavPlayer extends Component {
constructor(props) {
super(props)
this.stopPropagation = this.stopPropagation.bind(this)
}
stopPropagation(e) {
e && e.stopPropagation()
}
render() {
const { playing, play_ts, duration, volume } = this.props
const className = playing ? 'nav-player playing' : 'nav-player'
return (
<div className={className} onClick={this.stopPropagation}>
<PlayButton playing={playing} />
<PlayerTime play_ts={play_ts} duration={duration} />
<VolumeControl volume={volume} />
</div>
)
}
}
const mapStateToProps = state => ({
playing: state.audio.playing,
volume: state.audio.volume,
play_ts: state.viewer.currentSection ? state.audio.play_ts - state.viewer.currentSection.start_ts : 0,
duration: state.viewer.currentSection ? state.viewer.currentSection.end_ts - state.viewer.currentSection.start_ts : 0,
})
export default connect(mapStateToProps)(NavPlayer)
|