kosmetism/react-soundplayer

How to achieve track fine seeking/scrubbing on Progress component

ridhwaans opened this issue · 1 comments

In the PlaylistSoundPlayer.js demo on https://labs.voronianski.com/react-soundplayer/, how do you achieve fast fowarding or rewinding the track while clicking on the Progress bar? I have a readstream in the back like so but I am unable to reproduce the same behaviour

function(req, res) {
  const path = <path_to_track_file>
  const stat = fs.statSync(path)
  const head = {
      'Content-Type': 'audio/mpeg',
      'Content-Length': stat.size
  }
  res.writeHead(200, head);
  fs.createReadStream(path).pipe(res);
});

@ridhwaans here's where seekiing behavior is happening -

https://github.com/kosmetism/react-soundplayer/blob/master/src/components/Progress.js#L12

You need to check then instance of HTML audio element and figure out is it missing these fields and why. Reference on the fields and their descriptions are available here - https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement.