Users will be able to play, pause, and replay the current video, and we will implement these three options using Material-UI components bound to ReactPlayer attributes and events:
To implement the play, pause, and replay functionality, we will add a play, pause, or replay icon button conditionally depending on whether the video is playing, paused, or has ended.
mern-mediastream/client/media/MediaPlayer.js:
<IconButton color="primary" onClick={this.playPause}> <Icon>{playing ? 'pause': (ended ? 'replay' : 'play_arrow')}</Icon></IconButton>
When the user clicks the button, we will update the playing value in state, so ...
