Looking for a solution to load different audio sessions using Next and Prev

Questions
,
1

Looking for a solution to load different sessions with audio files. It should also change the text at the radio buttons. If “Next” is clicked, Session_2 should appear with the next three audio files and the associated text.

I tried to put the audio sessions in an external script to load it from there. I think that would make sense, but I have not succeeded yet. Example: https://jsfiddle.net/w4m4uev7/1/

Does anyone know how this can be done easiest? Thank’s

2

I have a question about your audio files. Are you going to play sound effects like steps, shots and things like that? Or is it background music?

1 Like
3

@Mugen87 These are recorded conversations that are played. The sounds are just examples.

4

The thing is, THREE.Audio and THREE.PositionalAudio load the entire audio file at once, decode it and hold the buffer ready for playback. This is actually no good approach for large audio files typically used for ambient or background music. In this case, it’s much better to use HTMLAudioElement. Unfortunately, there is no API in three.js for this feature so far. We had a PR once but the API was not satisfying.

So if your audio files are big and you don’t need spatial audio or perfect timing, try to use ordinary HTML audio elements. In this case, you can search for JavaScript /HTML5 audio players. Existing solutions might fit your mentioned requirements.

1 Like
5

Thank you for your response. The audio files are very different but not bigger than 1 - 3 MB. I load them one at a time, so that it does work very well with the THREE.AudioLoader. Previously, I used an HTML5 audio player, but I had more problems with it, because they are animations are add.

I am looking for a solution to load different sessions of three or groups of four audio files by Next button. The group Session_1 with three audio files is ready when the page opens, and can be loaded and played by clicking on the Rd.Buttons.

Now it should be possible to load several such sessions. With the Next button sould Session_2 should be able to be loaded to the same place and overwrite the old text with the new one.