How to make a loading for wait delay radio streaming

[Adam_Suchi_Hafizulla]

Hi.

Now i have a project to make radio streaming apps with HTML5 Intel XDK, but my problem is when i click play button, its have delay for the radio sound out. I want to ask, how to make a loading information for waiting that delay? When the radio sound out, then the loading dissapear.

Thank you before.

[Diego_Calp]

Hello,

Could you post the lines of code that calls the play button to start the radio streaming?

Regards

Diego

[Adam_Suchi_Hafizulla]

Diego Calp wrote:

Hello,

Could you post the lines of code that calls the play button to start the radio streaming?

Regards

Diego

I use <audio> tag for the streaming, and javascript audio.play() to play the radio.

<audio autobuffer preload="auto" id="RadioPlayer">
<source src="http://link_streaming/;stream.mp3" type="audio/mp3">
Your browser does not support the audio element.
</audio>
//Button
 <a onclick="radioPlay()" id="btnPlay"><img src="images/btnPlay.png" width="36" height="36"></a>


//Javascript (in other file)
function radioPlay(){
    var audio = document.getElementById("RadioPlayer");
    audio.play();
}

[Diego_Calp]

Look for html5 audio tag events, here is some information:

http://stackoverflow.com/questions/8059434/how-do-you-check-if-a-html5-audio-element-is-loaded

Not much time now for an example, post again if you can't find a solution.

Regards

Diego

[Adam_Suchi_Hafizulla]

Diego Calp wrote:

Look for html5 audio tag events, here is some information:

http://stackoverflow.com/questions/8059434/how-do-you-check-if-a-html5-a...

Not much time now for an example, post again if you can't find a solution.

Regards

Diego

Thank you before, so there is have a event to check the sound of <audio> is out? Because when user click play button, there is have a delay about 15-45 second before sound of radio can hear.

[Diego_Calp · Accepted solution]

Hi,

Yes, with the events you may show a waiting indicator. 

But, I take again a look to your sample code. Try changing preload="auto" to preload="none"

I did an app that plays mp3 files (no live) and this help to reduce the time to start.

Remove autobuffer property, is not used anymore.

"autobuffer attribute | autobuffer property

Use the preload element instead. The autobuffer property was initially listed in the W3C spec, but has been dropped."

Regards

Diego

[Adam_Suchi_Hafizulla]

Diego Calp wrote:

Hi,

Yes, with the events you may show a waiting indicator. 

But, I take again a look to your sample code. Try changing preload="auto" to preload="none"

I did an app that plays mp3 files (no live) and this help to reduce the time to start.

Remove autobuffer property, is not used anymore.

"autobuffer attribute | autobuffer property

Use the preload element instead. The autobuffer property was initially listed in the W3C spec, but has been dropped."

Regards

Diego

Thank you :)