Sound Alerts Request

Currently I think we only have alerts displayed as text.

It would be great if we can have sound alerts that could play/ring in a specified conditions.

Example:

  1. I am working on creating a social app…In this case ,if the current user is getting any notifications or messages from the other user. he can get a sound notification/alert .

  2. If a timer is set to 15 mins… a sound alert can be set when the countdown turns to 0.

3 Likes

Have you seen some good plugins to do this on the web?

1 Like

Couldn’t you just play a sound file?

W3C Notifications API Standard: https://davidwalsh.name/notifications-api

The Notifications API Standard mentions that it could provide sounds through a sound URL: https://notifications.spec.whatwg.org/#sound-url

Other options:

  • http://ionden.com/a/plugins/ion.sound/en.html
  • https://pushover.net/ (could be a good option and easy plugin for Bubble. Very cheap one-time license fee for each platform). Not sure if this is a elegant as the Notifications API though. Appears to need a browser tab open to the pushover website in order to get the notifications on a desktop.
3 Likes

Here’s a good tutorial on setting up the Notification API and playing sounds.

http://blog.sourcebender.com/building-an-html5-application-part2.html

2 Likes

Seems like you guys could experiment with HTML elements first :slight_smile:

Hi, I can play using a HTML element, but I can’t get to make it work in a workflow. Any hint?

I haven’t tried, but I think if you put the HTML in a group and define the content of the HTML as the parent groups text, and display a text in the group the HTML will be run in a workflow

Thanks @emmanuel. It will run in Editor everytime I select the group, but it’s a no go in preview - tried to use toggle, display data in the workflow but I can’t say how to handle this.

Searching the net I can only get the standard HTML audio codes to run (create a button or use controls, autoplay, increase/decrease sound), but anything beyond that needs a script, what is not hard to use but I don’t know how to use javascript in Bubble (only using a plugin?)

If there’s no alternative it would be great to see this play action exposed.

PS - if you want to take a look at my attempt I’ll send the link

We’re working on element plugins so in a few weeks users should be able to add that themselves. If it’s critical we can talk about sponsoring by email:

4 Likes

Glad to here. It’s not critical right now, so let’s see what is coming first :+1:

There is a way to play sound alerts. It’s a bit of a hack, but it gets the job done.

Set the music player to be 1px by 1px (or something else not particularly visible). Set a dynamic link for the mp3 link and reference a custom state on the page. Set the music player to auto-play when a new song is set.

Then, change the custom state to the url of the mp3 you want to play based on the specific conditions you want to play it. And, have it toggle between that mp3 sound and another “blank” mp3 so that the url is changing and therefore it’ll play the sound each time since it’s set to auto-play when a new song is set.

Note - I believe the easiest way to manage the toggle between the mp3 urls is to include 2 steps in your workflow to play the sound. Have the 1st one set the url state to the “blank” mp3 url. Then, for the next step have it set the url state to the correct url for the mp3 for the sound you want to play.

7 Likes

I’m having same issue, I thought maybe using a video hidden behind a panel and I think you can have it start at different points of the video so can probably have all audio elements on one track. What do you think?

@sridharan.s There’s 2 sound files “ok.mp3” and “fake.mp3”, Using your suggestion I got the sound to play on a workflow (button press), but it will run just one time.

When I play “ok.mp3” then in the next step “fake.mp3” will stop “ok.mp3” and play instead, since the steps will run too fast.
I tried using fake first in the workflow (so every time it toggled the sound file) hoping “ok.mp3” would play, but it will play in the first run only.

Both will work on debug mode, but not on run mode :confounded:

You may be able to add a delay / pause between fake.mp3 and ok.mp3. If that works, that’d be the easiest way to solve it.

thanks @sridharan.s it works like a charm

1 Like

Can someone elaborate more on the set up - how to get a workflow to trigger playing a music file? I don’t quite follow the steps. Like ‘creating a state’ - creating a state for what? the page? the music player? and if its for the music player, there is no condition on the conditions tab that allows you to change the dynamic link.

Can someone please help with this?

I have an audio file that I just need to play once, in a workflow.

@cooljen, happy to help.

“creating a state” = adding a custom state on the page (or on the group or element). Each location works equally well, just need a custom state that you can use on the page.

Set the custom state to be a text field.

Set the value of the custom state to the url or the mp3 you want played.

Then, set a workflow to run when, say, a user presses a button (or any other action that you want to cause the sound). You’ll want to already have set the music player to auto-play when a new song is set so then during the workflow, you’ll set the song to a blank song, and a short pause (a few miliseconds) then set the song to be the mp3 value from the custom state. Since the music player is set to play when a new song is set, it will play the mp3 at this time.

Make sense?

Scott

@sridharan.s Thanks for responding!

Hmm I’m still having difficulty though. So I have a workflow and the last action is the Set state of…
At first I had it as Set State of Music Player,
I created the text state ‘mode’ and put in the http://s3.amazonaws… address
But it didn’t work

So then I tried switching it to Set state of index.

I have the ‘autoplay when new file is sent’ box checked, and I simply put spaces in the ‘dynamic link’ field to have something text there.

But it still does not work.

Not quite sure I follow the details of your setup, but I think what’s not working is the dynamic link part.

One way is to set the dynamic link to reference the custom state. Have it default to an mp3 that plays a blank sound (i.e., no sound, but still an mp3). Then, when someone say, clicks a button, change that custom state to the link of the mp3 you want to play.

Let me know whether this gets it working for you.