mediacms icon indicating copy to clipboard operation
mediacms copied to clipboard

[Feature] integrate an audio visualizer

Open mgogoulos opened this issue 3 years ago • 7 comments

What audio library could be added to make audio streaming more interesting?

Eg https://github.com/katspaugh/wavesurfer.js

mgogoulos avatar Mar 22 '21 15:03 mgogoulos

I can do some research on this and suggest a few.

yashm1 avatar Mar 22 '21 16:03 yashm1

I can do some research on this and suggest a few.

please do, and write back findings!

mgogoulos avatar Mar 22 '21 17:03 mgogoulos

  1. https://github.com/samuveljohns/Wave.js: Minimal wave visualizer for javascript from wave.js Visual audio from element or microphone stream
  2. https://github.com/chrisweb/waveform-visualizer#readme: Waveform created using data that got generated using the waveform data generator
  3. https://github.com/theanam/webaudio-oscilloscope: A highly customizable oscilloscope for web Audio that supports any source supported by the browser, and renders on an HTML5 canvas.
  4. https://github.com/VladislavPetyukevich/audio-visualizer Audio visualizer generator for Node.js with a simple configuration. Supports PNG, JPG for images and MP3, WAV for audio.
  5. https://github.com/cbrandolino/local-audio-visualizer Drag an audio file to the browser window. It will be played directly from your hard disk, and you'll have a neat spectrum visualization.

I found a few libraries you can have a look. Let me know if you need more

yashm1 avatar Mar 22 '21 19:03 yashm1

Hello Sir, Please let me know if you need more findings

yashm1 avatar Mar 23 '21 07:03 yashm1

I was thinking, an audio visualizer that can show subtitles would be very useful. Podcasts, interviews. If it could work with the same web vtt files we use for videos, that would be awesome!

Dan1ell avatar Apr 30 '21 22:04 Dan1ell

Yes, that's a great idea. We can use Audio to text libraries to do it.

yashm1 avatar May 01 '21 16:05 yashm1

Considering the fact that MediaCMS is using Video.js to play media, it makes sense to use a Video.js plugin like this one:

https://github.com/collab-project/videojs-wavesurfer

Megidd avatar Jan 27 '22 06:01 Megidd