waveform seek bars

I’ve been thinking about building a music app with Electron for a while since I’m really missing a player that has waveform seek bars on MacOS (like the ultimate music player foobar2000 has on Windows). I just found museeks and really like the clarity of the code and the technology choices (esp. React, Redux, ES6) so contributing looks like a realistic alternative on by behalf.

a possible implementation would be to draw and cache waveforms on demand. with the snippet below, generating a waveform for a 3-4 minute track would take about 1-2 seconds. the images should be cached somewhere and only re-drawn if the content of the audio has changed (cached waveform images could be referenced to with hashes of the audio content). waveform seek bars should be optional and only available if a sufficient version of ffmpeg is detected on a users system.

I have experimented with different methods to draw waveforms with Node a lot, and have come to the conclusion that ffmpeg with node-fluent-ffmpeg is currently the best way. getting a waveform as a PNG stream is as easy as:

ffmpeg(audioInputStream)
  .format('image2pipe')
  .outputOptions(['-frames:v 1', '-vcodec png'])
  .complexFilter(
    'showwavespic=s=1000x200,format=rgba,colorkey=black,colorchannelmixer=rr=0:gg=0:bb=0'
  )
  .pipe();

would you be interested in this kind of functionality or should I start developing a completely separate version?

[maxjvh]

I don’t think that’s a problem if it’s an optional feature! once a user chooses to enable waveform seek bars in the settings they surely anticipate that something will change in the UI and the change shouldn’t confuse them. but I agree that by default the “classic” seek bar should be used.

[dkniffin]

not meant to be modular, for now

Although, I’d really like to discuss this in #260.

We’re talking about a music player, not something you will spend 8 hours a days on.

But I do spend 8 hours a day (or more) listening to music :trollface: