Forum Academy Marketplace Showcase Pricing Features

Visualize audio waveform / music playback with timestamped comments?

Hello Bubble forums,

I’m currently trying to create a page which displays an audio file’s waveform in a player, which additionally allows for a user to click above the waveform display and create timestamped comments relative to the audio file. This could perhaps be similar to SoundCloud. A screenshot of something similar is attached.


Does anyone have any ideas/plugins to create at least an audio waveform display from a file? The only plugin I’ve found so far that creates a similar display is Bubble’s native Audio Recorder & Visualizer, but I can’t seem to find any documentation for that, or any way to use the waveform visualizer for files that are already stored and in the database or in AWS.

Any help in finding a solution would be much appreciated!

Thanks,
-Josh

1 Like

Anyone have any ideas on this? To reiterate we’re trying to:

  1. Create a waveform visualization of an audio file (can use an existing plugin, or simplest means available)
  2. Allow users to add timestamped comments along the length of the audio (within the region at the correct x-axis points, and attribute those physical locations to time locations of the audio)

Any help or guidance would be much appreciated!

Thank you

1 Like

I had an app a while back that displayed waveforms of existing audio files, but I’m unable to find the plugin that I used. It’s a shame that there is no ‘trial’ of the paid plugins so I can test various plugins w/o draining my bank account. There are so many plugins that simply don’t work as advertised. The one that I used in my previous app, but it might either be wrongly categorized, the dev pulled it or made it a paid plugin.

If you find anything, let me know?

(Also, I was trying to use the Bubble audio plugin work to display the waveform of an existing file, but no luck either.)

I found this article on writing something using JS… Making an Audio Waveform Visualizer with Vanilla JavaScript | CSS-Tricks. But I am no programmer.