Method for embedding sound files into your RP document

advanced-prototyping
#21

Unfortunately I’m stuck on RP9 and can’t open your file (Axure, please give me a perpetual license option so I can upgrade!), but if I had to guess, you probably need to make sure your play/pause actions are targeting the right player.

In my code in the original post, there’s this part:
append("<audio controls id='player'>
where the id='player' part is how you target the sound. So if you have multiple sounds, you probably want to change that for each one to something like id='sound1', etc.

And make sure you’re appending each player to a dynamic panel with a unique name, otherwise they’ll all be the same.

#22

Thank you, again for looking into this and trying to help… Please see the link below, I tried to share the JS as much as I could…

https://qz0ldz.axshare.com/#g=14

#23

No problem. I can’t tell what the issue is from what you posted, but here’s an rp file with two embedded sound files, both looped, that can play/pause independently:

Live example | two-at-once.rp (85.8 KB)

Let me know if this gets things working for you.

#24

You hit the nail on the head. I sincerely appreciate your assistance - I’ve noticed that the problem I experienced was part due to syntax, and part to Safari not performing consistently - chrome seemed to deliver more consistent results with both. With your permission I’d like to refer to you as Sifu Ishillman.
Thanks for helping Axure do things it was perhaps not designed to do… yet, we’re almost in 2023, and I hope Axure product managers pay greater attention to the conversations taking place in this forum and understand that we demand an experience prototyping platform that goes much further… cannot help but notice how Adobe and Figma are joining forces to build the next big thing…

#25

Ah, splendid! Very glad to see it ended up working for you. Your prototype is sure to impress.

And yes, here’s hoping someone out there is paying attention!

#26

Hello @ProtoAlex
After a couple of years I now find myself needing a bit of help on the multiple sound tip above. Sorry to be a clod on this but I’m not clear on where all the base64 sound content should reside. Is it one audioPlayer file with all the encoded sound content, and with each sound separated by “<audio controls id=‘playSound1’><source src=‘data:audio/mp3;base64,ENCODED_Sound1’ type=‘audio/mp3’></audio>” or something different?

I’m also a bit lost on how the global variable would work here. I can certainly create one but is its default data the audioplayer data? Thank you so much in advance. I’m still using v9.0

#27

@uiguyjohn each base64-encoded audio clip gets its own player (<audio>...</audio>), which you’re appending to an Axure widget (e.g., a dynamic panel or just a rectangle) named “audioPlayer” in ProtoAlex’s example (but you can call it whatever you want). The actual audio data goes in the <source> tag where you’ve got ENCODED_Sound1.

ProtoAlex is suggesting storing the audio player code (the <audio> tags and everything between them) in a global variable in case you’re going to be reusing the sound files across multiple pages. If you’re only using it in one place, no need to use a global variable.

My example RP file here was built in v9 if it helps.

#28

Awesome, thank you so much @Ishillman, this is exactly what I need to do the job. I was close as I set it up similarity but missed a minor detail. All good now. Thanks again

#29

Excellent, glad to hear it’s working!