[Marketplace Plugin] Audio Player Plugin

Plugin details

Advanced music controls, callback actions, and playlist support available. Play a single audio or an entire track.
Demo page: https://ncv-demos4.bubbleapps.io/version-test/audio_player
Editor: Ncv-demos4 | Bubble Editor

Key Features:
:heavy_check_mark: Multiple instance support
:heavy_check_mark: Various audio format support
:heavy_check_mark: Works inside repeating groups
:heavy_check_mark: Playlist management
:heavy_check_mark: Track navigation (next/previous)
:heavy_check_mark: Media session integration
:heavy_check_mark: Download tracks
:heavy_check_mark: Open tracks in new tab
:heavy_check_mark: Automatic state management
:heavy_check_mark: Playback speed control
:heavy_check_mark: Time-based navigation
:heavy_check_mark: Volume control

Advanced Controls:
:heavy_check_mark: Play/Pause
:heavy_check_mark: Mute/Unmute
:heavy_check_mark: Forward/Backward seeking
:heavy_check_mark: Track selection
:heavy_check_mark: Volume adjustment
:heavy_check_mark: Playlist navigation
:heavy_check_mark: Track download event
:heavy_check_mark: Track opening event

States & Events:
:heavy_check_mark: Current track information
:heavy_check_mark: Playback status
:heavy_check_mark: Duration and current time
:heavy_check_mark: Track list management
:heavy_check_mark: Download/Open states
:heavy_check_mark: Navigation events

Supported Files:
For supported formats see: HTML audio - Wikipedia

Pro’s:
:heavy_check_mark: Works with multiple instances
:heavy_check_mark: Works inside repeating groups
:heavy_check_mark: Full playlist support
:heavy_check_mark: Media session integration
:heavy_check_mark: Comprehensive track management
:heavy_check_mark: Automatic state handling

Behavior Notes:
• Audio stops when player is hidden/removed
• States reset when player is hidden
• Supports both single file and playlist modes
• Automatic track progression in playlist mode

image

Link: Audio Player Plugin | Bubble

@quantumind, thanks for your feedback! We’ve made several improvements to this plugin. You can now play tracks, fast forward or rewind, and download or open URLs. We’ve also added events to track these actions.

We just added a clickable progress indicator!

Hey.

I found one small bug. When built in progress bar is set to “no”, current time and percentage values are not updated. Doesn’t impact me, since I want to use your progress bar, but just for plugin’s quality, maybe you want to fix that.

btw I love the indicator function of your progressbar!!

1 Like

I’ll sort this out.

I have two more feature requests :slight_smile:

  1. An action to jump to a track in the playlist. Similar to your “open a track” action, but to jump to a track (by providing a track number) and start autoplaying it.

  2. This is a bit crazyer :slight_smile: . Your “jump to time when clicking on progress bar” works well, but it would be so much better (and more like other apps work) if I could also drag the progress indicator on the progress bar before letting go. Like Spotify. Currently it looks to some users that the progress indicator is broken. They are used to dragging it.

1 Like

We should be able to add this in. Apologies on the delay, we had to prioritize other tasks.

We’ve added a new update in version 1.16.0 with the ability to go to a track, by providing the track number and autoplay to true/false.

Version 1.17.0 supports dragging the progress bar as you’re used to in Spotify. It will play once you stop dragging and let go of the cursor.

@quantumind We’ve made a lot of improvements to the audio player thanks to your feedback! If there’s anything else we can do, let us know. We appreciate your support! :raising_hands:

New changes added on version 1.18.0

  1. Auto_play next track yes/false (different from auto_play)
  2. Grab cursor when hovering/grabbing the progress indicator (defaults to false)
  3. Control the progress bar height using the Plugin settings and not bubble’s height, as we will need to set the height of the canvas slightly larger in order to show the indicator properly (see the demo app)

Looks really great. Thank you, amazing work.
The only thing I would add would be to slightly increase the size of the grab area, since when the progress bar and indicator are thin (10px for example) it is sometimes hard to catch the indicator. Would that be possible?

1 Like

You can change the height of the progress bar. In the demo, it was fixed at 10px, but I’ve updated it and set it to 20px, you can have it adapt dynamically as well, but i’d recommend not to do so as you can control the height of the progress bar and indicator dynamically.

I’ve also released version version 1.19.0 that lets you hide the indicator if needed. You can check it out in the demo.

Awesome. I misunderstood how the progressbar height and element height is related. Now it’s all good.

Can you also add shuffle play mode?

1 Like

We added support for shuffle in version 1.20.0 :+1:

Thank you!! Awesome.
One more thing we noticed… don’t know if this is intentional… or am I doing something wrong.

  1. I load in a playlist with “loop playlist - no”
  2. I advance some other track than the first (second, third etc.)
  3. I play the track
  4. While the track is playing (any other than the first) I trigger “loop playist - yes”
    Result: Audio jumps back to first track and starts playing that, instead of continuing playing the track that was playing.

(same with loop single audio)

1 Like

Hey. Do you have any comments of updates on this :backhand_index_pointing_up:?

1 Like

This should now be resolved in version 1.21.0, the player does not reset when updating settings.