The MediaPlayer component will contain the ReactPlayer component, starting with the initial control values before we add the custom controls and handling code.
First, we will set the initial control values to state.
mern-mediastream/client/media/MediaPlayer.js:
state = { playing: true, volume: 0.8, muted: false, played: 0, loaded: 0, duration: 0, ended:false, playbackRate: 1.0, loop: false, fullscreen: false, videoError: false}
In the view, we will add ReactPlayer with the control values and source URL, using the prop sent from the Media component.
mern-mediastream/client/media/MediaPlayer.js:
const { playing, ended, volume, muted, loop, played, loaded, duration, playbackRate, fullscreen, videoError } = this.state ...
