Jesse McMillan Jesse McMillan - 1 month ago 9
Javascript Question

Javascript - How do I override default action when user presses play/pause from mobile notification controls?

I'm putting together a website for live-streaming audio. It uses an html audio element and some custom javascript / jquery controls to stop buffer and change buttons on pause.

On Android when playing audio from chrome a play-pause button appears in notifications. Similarly iOS devices have media controls outside the browser.

When a user presses those controls the play-pause command is sent directly to the audio element (bypassing the controls I set up.)

How do I intercept these commands and make them call my custom functions instead?
(I will post code samples in a bit so you can see what the code looks like)

Answer

Play and pause events are here for you.

audioElement.onplay = function() {
    /* trigger your customs controls */
};
audioElement.onpause = function() {
    /* trigger your customs controls */
};

From http://www.w3schools.com/tags/av_event_pause.asp