Need help with "Air Native Audio Player"

I’m using the Air Native Audio Player plugin by @ZeroqodeSupport and need to implement the following features, which I assumed would be there because they are essential for audio players. But they don’t seem to be built into the plugin.

  • Continue playing audio when the phone screen is closed or the app is moved to the background.
  • Navigable playback progress bar (seek track to slider’s position).
  • Display the current playback position (as text or a number).
  • Trigger workflows when the player ends or the song is finished.
  • Set the track’s position or skip backward 15 seconds.

Any guidance would be greatly appreciated!

Hi @cohereandnow,

Thank you for reaching out.
We want to confirm, by Air Native Audio Player - do you mean the Air Native plugin component - Air Native player?

If you are using the Air Native player component inside your app, then below you can find more info regarding each point.

  1. Continue playing audio when the phone screen is closed or the app is moved to the background:

    • The Air Native Audio Player plugin does support background audio playback. You can check the Player Widget that are enabled once you use the component.
    • Air Native Player
  2. Navigable playback progress bar (seek track to slider’s position):

    • The plugin allows you to seek to a specific position within the track. The widget contains a progress bar with which you can interact. Here’s an example:

  1. Display the current playback position (as text or a number):

    • Currently, the plugin does not include this specific state. However, we will add it to our list of potential improvements and assess the feasibility of incorporating it in future updates. In the meantime, you can explore the existing states available here: Air Native Player States.
  2. Trigger workflows when the player ends or the song is finished:

    • Yes, you can use plugin events and actions, depending on your use case. Please check the supporting documentation: Air Native Player
  3. Set the track’s position or skip backward 15 seconds:

    • Unfortunately, the current version of the plugin does not include a Playback Position state, so this functionality isn’t available at the moment. We apologize for the inconvenience and will consider adding this feature in future updates to the plugin.

I hope this information is helpful. Feel free to explore other solutions and Zeroqode Plugins for Playing audio.

Best regards,
Zeroqode Support Team

** The Air Native Audio Player plugin does support background audio playback. You can check the Player Widget that are enabled once you use the component.*

Currently the player stops when app is closed or moved to background. I do not see a option to enable or disable this within the plugin. I also don’t see that listed in the documentation. Can you please be more specific about how where I can find this option to enable it?

** The plugin allows you to seek to a specific position within the track. The widget contains a progress bar with which you can interact. Here’s an example:*

This image you provided above seems to be the player that Apple displays on the phones locked screen. I’m asking about displaying a Navigable progress bar within the Bubble app interface. So that users don’t have to lock their screen to see or change the track position.

. *Display the current playback position (as text or a number):

  • Currently, the plugin does not include this specific state. However, we will add it to our list of potential improvements and assess the feasibility of incorporating it in future updates. In the meantime, you can explore the existing states available here: Air Native Player States.

Thank you. This current time state and the progress bar both like a pretty standard things for a audio player to have. I’m curious what the reason was for not having it in the first place? I understand that this can be seen and nagivated on the lock screen of the phone but having this in the app interface seems crucial for most use cases.

. *Trigger workflows when the player ends or the song is finished:

  • Yes, you can use plugin events and actions, depending on your use case. Please check the supporting documentation: Air Native Player
    [/quote]

I see the following workflows are available but not one for “when the track ends”. Which also seems to be pretty standard in all other audio player plugins.

I’ve tried three of your other audio player plugins which have all of the above features “Howler” “Custom audio player” and “Advanced audio player” . Of course, none of which have the Air Native player features compatible for iOS mobile apps. Right now I’m left with not being able to use any of the three plugins I’ve purchased from you guys. If i could somehow combine the custom audio players navigation progress bar, current playback position state and “track ends” workflow with the Air Native Player, this would be perfect. Or if the Air Native Player had these features that all audio players typically have.

Thank you for your help.

Hi @cohereandnow,

Thank you for your detailed reply.

The Air Native Audio Player component was developed as an extension to the Air Native plugin, primarily focusing on enabling users to play audio outside the app via the mobile widget, as shown in the previous response. It wasn’t designed to include a progress bar within the app. For that functionality, you may need to use a different plugin tailored for in-app audio playback.

To the best of our knowledge, the audio should continue playing through the plugin widget when you exit the app or move it to the background, similar to how other audio apps like Spotify function.

The test app we previously built has expired, so we need to create a new build to properly test the component. We’ll notify you once the new build is ready and provide a link so you can test the Air Native Audio Player component on your side as well.

If you’re interested in adding custom improvements to the Air Native Audio Player component, we invite you to sponsor the development. To begin the review of your sponsorship request, please complete this Sponsoring Plugin Features Form.

We will review it and provide an estimate of the hours required and the associated cost.

We look forward to collaborating with you and better meeting your needs.

Best regards,
Zeroqode Support Team

I can tell that it was designed this way. What I’m curious about is why it was designed without these things?

I can’t image a use case where the user wouldn’t have the ability to see the track position and not be able to navigate it from within the app.

Have you ever seen a music or other audio app that doesn’t have a track progress bar / display the track position?

I’d normally consider sponsoring the development of this but I’ve tried that with you guys in for a different plugin in the past and it was a nightmare. Nothing was implemented and ended up being a waste of time and money.

It doesn’t seem to be working in my app. It stops playing as soon as i lock the screen or exit the app.

Hi @cohereandnow,
Thank you for your reply.

To understand better how you’ve set up the plugin element in your Bubble app, please share a detailed step-by-step screen recording, and the actual result from your app (the device name used for tests and OS version).

The Air Native Player component was developed as an extension to the Air Native plugin, primarily focusing on enabling users to play audio outside the app via the mobile widget.

For more workflow examples and setup, we recommend referring to the test demo page:

If you have other questions, please let us know.

Regards,
Zeroqode Support Team.

I’d like to add my own custom Seekable progress bar and sync it with the Air Native player. This means integrating a custom progress bar to display and control the playback position of the Air Native player within my apps interface. Could you provide the following information so that I can complete this integration?

  1. Accessing Audio Duration and Current Time:
    What are the state variables or methods I can use to retrieve the total duration and current playback time of the audio in the Air Native Audio Player?

  2. Seeking to a Specific Time:

  • What method should I call to seek to a specific time in the track when the user interacts with the custom progress bar (i.e., moving the slider)?
  1. Event Listeners:
  • Does the plugin provide any event listeners for when the playback time updates (like onTimeUpdate) or when the track ends?
  1. Any Other Relevant API Methods:
  • Are there any other methods or states exposed by the Air Native Audio Player that would help sync the custom progress bar with the audio?

Your assistance would be greatly appreciated!

Below is the code Intended to achevie this with:

Progress Bar HTML
< input id=“seek-bar” type=“range” min=“0” max=“100” value=“0” step=“1”>

JavaScript to sync the custom progress bar with the Air Native Audio Player

const seekBar = document.getElementById('seek-bar');

// Replace these with actual methods or variables from Air Native Audio Player
const audioDuration = /* Get the total duration of the audio from Air Native Player */; 
 const audioCurrentTime = /* Get the current playback time from Air Native Player */;

// Update the seek bar as the Air Native audio plays
function updateSeekBar() {
    const value = (audioCurrentTime / audioDuration) * 100;
    seekBar.value = value;
}

// Update seek bar every second
setInterval(updateSeekBar, 1000);

// Seek to the new position when the user moves the seek bar
seekBar.addEventListener('input', function() {
    const seekTo = audioDuration * (seekBar.value / 100);
    // Sync with Air Native Player's seek function
    /* Call Air Native Player API to seek to the new time, e.g., airNativePlayer.setCurrentTime(seekTo) */;
});

Hi @cohereandnow,

Thank you for getting back to us.

We will need to consult with the dev team regarding your inquiries and will provide a detailed response shortly.

In the meantime, you can review the supporting documentation to learn more about the plugin element and the available states:

image

Once we receive updates from the dev team, we’ll inform you promptly. :pray:

Best regards,
Zeroqode Support Team

Awesome. Thank you.

Hello @cohereandnow,

Thank you for your patience. :pray:

We’ve consulted with the dev team, and unfortunately, the plugin currently does not support retrieving the track duration or current playback time.

To explore the possibility of adding this feature and to provide you with a cost estimate, we invite you to consider sponsoring the development. To get started, please fill out the Sponsoring Plugin Features Form.

Once we receive your request, we will review it and provide an estimate of the time and costs involved, please include all the details and improvements you would like the Air Native plugin to have and our Dev team will analyze them closely.

We look forward to the opportunity to collaborate and further improve the plugin to meet your needs.

Best regards,
Zeroqode Support Team.