I've got an issue with my app and I could reproduce it on this sample: https://webrtc.github.io/samples/src/content/getusermedia/record/
During a phone call, if I open a tab with a video with audio element, the video automatically pause (and can see a pause event on the element)
This does not happen if the video element was loaded and played before the phone call start, or if the video has no audio.
Is this a normal behaviour, and can it be tracked (by an event other than the pause one) ? Is there any way to know there is a phone call ongoing, or any way to restart the video during the phone call (element.play() works, but a pause event immediately happens) ?
To reproduce:
On a mobile (iOS or Android)
Start a phone call
Open https://webrtc.github.io/samples/src/content/getusermedia/record/
The video is paused
If you manually launch element.play(), you can see the frame in the video updating, and then pause again
The record works correctly
what (likely) happens is that the video element (which needs to synchronize audio and video) is waiting for audio data but doesn't get any from the underlying layers when a phone call is active.
A possible workaround would be to change how you display audio and video, each in their own elements with MediaStream as srcObject that only have the respective audio and video track of the original stream.
Can you file a specification issue on https://github.com/w3c/mediacapture-main/ please? This is a rather interesting case that warrants some discussion.
Related
Some mobile sites, like YouTube and Twitch, will pause html <video> elements if other apps (like Spotify, or a podcast player that puts media controls in the notifications) start to play audio.
Interestingly, these don't just take audio focus - they also stop playing if they can't obtain it. As an example, I'm using firefox for android, so I tried disabling its ability to take audio focus with adb:
cmd appops set org.mozilla.firefox TAKE_AUDIO_FOCUS ignore
But now, videos just immediately pause, since it can't pause the other audio source.
How do the sites detect this? I attached a debugger to my phone and looked through the docs but I didn't see anything in either place.
I'm not sure about how this specific flag "TAKE_AUDIO_FOCUS" is interpretted, but modern Android focus management is based on "requesting" (not taking) audio focus. Apps would request it and either get it immediately or listen for updates from the AudioManager as to whether they got it. Similarly they will get updates when someone else requests (and then subsequently receives) focus, and they should react accordingly (i.e. pause/duck themselves). Presumably the apps you mention have asked for audioFocus and were denied it and then hadn't received focus yet, so they just chose to stay paused rather than start playing audio/video and blare out over the app that hadn't released focus yet.
source: https://developer.android.com/guide/topics/media-apps/audio-focus
I have an html5 audio player on my page that streams from my icecast server, all working OK. However, when people block their phone there's no metadata, only the play button that iOS/Android offers.
Is there a way to show something like 'Glaciar's livestream', like when the Spotify app shows the song's title and artist? I'm using PHP and Javascript apart from HTML and CSS.
Thanks in advance!
You can use the Media Session API to customize what's been shown on the lock screen.
But it is not supported by Safari which means you can't use it to customize the lock screen on an iOS device.
I just came along the same issue. Our Webapp would not display anything on the lock screen even though audio was playing. This is what I just found out:
We are setting up an new Audio() element in javascript - within the user interaction we call audio.load(). Then we wait for the canplay event to fire and with that event handler, we call audio.play(). When the phone now gets locked, there is nothing shown on the lock screen.
However, when we add audio.play() directly after audio.load(), so it is called within the same user interaction, everything shows up fine on the lock screen. So it seems like, it matters if audio.play() is called within a user interaction.
Some more background in case someone wonders why we are not calling play within the user interaction: We usually use an audio context (that is unlocked within a user interaction) and just started to fall back to an audio element, due to numerous audio related bugs in safari.
For mobile devices, it seems user action such as a click/touch is needed in order to play video (or perhaps audio too) - specifically before calling the play() method on a video element is successful.
See for example Can you autoplay HTML5 videos on the iPad?
However, is that for every play() or just the first? i.e. can I have a "start" button which quickly calls play() and pause() on a video element, and then subsequent play() on that video element will not be via user action but rather some other internal logic down the line?
When i change video element current time to a point where it hasn't buffered the video stops playing. And i want to know when it starts playing as soon as the first frame.
I have tried canplay and playing without success.
Tho i did get it to work by using play and pause.
So when i pause it canplay event works and then i listen for it and which tells me that at new position at which i paused now can be played. Then i just play it however. Is it, should be, possible to do it without pausing. Why there is no readystatechange as in ajax. If video is paused,stopped,waiting for buffering(as in my case) fire an event.
This list of all media element events should be helpful:
http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#event-definitions
The waiting and playing events should be relevant if you're just playing and the video pauses by itself. waiting fires when the video is forced to pause because it's buffering data from the network, and playing fires when it's ready to resume. It's worth noting the difference between play and playing. play fires when it's "trying" to play, i.e. .paused === false. But playing means that it's actually playing (although there are some weird cases where that's not strictly true, as noted in the linked document).
However, if you're seeking, you could use the seeking and seeked events. What I would do is keep a listener on all four events as well as canplay, and check the .readyState property in there.
I've been evaluating HTML5 audio on iOS 4 and have been trying to understand its limitations. From what I can tell...
It is possible to play audio in the background
It is not possible to fire JavaScript events in the background upon track completion
It is possible to fire JavaScript events while the screen is off, but Safari must be in the foreground (before turning the screen off)
My goal for this current project is to create a dynamic playlist that will continue to fire events and move to the next track even while Safari is not in the foreground. Is this possible with the current way HTML5 audio works on iOS?
I am curious about how the chaining of JavaScript events works on iOS if anyone has additional information. It seems that you are allowed to queue back to back sounds, but it must happen shortly after a "human" function happens (for example, tapping an element). Anything else that tries to queue a sound outside of this human function is denied the ability to play.
Also...
Is it even possible to have events that fire to move a real iOS application to the next track? It seems as if the application is only allowed to finish its current audio stream and then it goes into an idle state. Just trying to figure out all the angles here!
This is quite an old question, so I'm not sure if you've found an answer already or not.
One thing I know is that an audio clip cannot be played via JavaScript on mobile Safari.
Autoplay audio files on an iPad with HTML5
The only way to make audio play, is through a click event. This wasn't the case on 3.x, but on 4.x it is. This is because Apple doesn't want the webapp to download audio on a 3g connection programmatically, so they force the user to initiate it.
I would think that if all of the tracks were started downloading (cached), then it may be possible. I would try forcing the user to start one track, and at the same time call .load() on all of the other tracks (in the same click handler). This will force the iOS device to start downloading the audio tracks, and you may be able to play the next track (not sure though).