We have a web forum that is almost ready. It was built on the Discourse.org platform.
It uses: JavaScript, Ember.js, Ruby on Rails backed, Postgres database, Redis cache.



Development needs to be done on your server, digitalocean (I also have a test server and a production server there). Working through github.



One of the tasks:

If there is an mp3 file in the text message, our audio player is used instead of the default one. The player is ready and working.


Visualization is done in the player with a script: https://wavesurfer-js.org.
The visualization is saved as .json files.



It is necessary to make caching for the visual range of audio, so that the visualization for audio files is created only once.

+ audio and visualization files are stored on S3; when removing audio, the visualization should also be removed.

+ if no visualization is found for an existing audio visualization, the script should create a new .json and use it.



This script already has a visualization caching function. https://wavesurfer-js.org/example/audio-element/