Using MediaPlugin to stream music, how can I keep music playing when switching out of app or locking phone?

Do

ionic plugin add https://github.com/shi11/RemoteControls

For Android I used the MusicControls plugin

Cool, that worked.

How did you go about implementing it with TypeScript?

You don’t need to do anything special besides for using ‘let’ and changing it to

window['remoteControls'].updateMetas((success)=>{
}, (fail)=>{
}, params);
1 Like

Okay, got it to work sort of… is there a hook for the pause/play button?

My constructor looks like this:

platform.ready().then(() => {

	this.radio = new MediaPlugin("http://relay.publicdomainproject.org/classical.aac.m3u");

	this.radio.init.then(() => {
		  console.log('Playback Finished');
		}, (err) => {
		  console.log('somthing went wrong! error code: ' + err.code + ' message: ' + err.message);
		});

		let artist = "Daft Punk";
		let title = "One More Time";
		let album = "Discovery";
		let image = "path_within_documents_storage OR url_starting_with_http_or_https";
		let duration = 1;
		let elapsedTime = 1;

		let params = [artist, title, album, image, duration, elapsedTime];
		window['remoteControls'].updateMetas((success)=>{
		}, (fail)=>{
		}, params);
});

But still not able to see the artist/title on the lock screen, it just shows up blank.

Got the hooks to work by adding the following to the constructor. Needed to declare event:any as TypeScript wouldn’t compile otherwise.

document.addEventListener('remote-event', (event:any) => {

    switch(event.remoteEvent.subtype) {
    	case "play":
    		console.log("PLAY");
    		this.radioPlay();
    		break;
    	case "pause":
    		console.log("PAUSE");
    		this.radioPause();
    		break;
    }
});

Still can’t get

window['remoteControls'].updateMetas((success)=>{
}, (fail)=>{
}, params);

to work though, did you place it in the constructor? On the play event?

I also noticed that the lock screen controls go away after you press pause, is there anyway to keep them up during a pause?

Try with an image from a url. I couldn’t get the local file image to work.

Ah, that was it. For reference, is there anyway to not show an image or does that value always have to be filled? I tried setting it as a null or “” and it ended up giving me the same issue

Curious, were you able to get AAC files to work in Android? Mp3s work, but AACs are giving me an issue.

For Android, I only use OGG files because I think they give the best quality for the size. If they worked on Apple I would use them there also but they don’t.

What did you end up using for your iOS streams?

I used AAC though none of my audio is streamed. This is my app for reference https://play.google.com/store/apps/details?id=net.sleeporbit

I got the Android controls working in Android 6.0 and 7.1 but they don’t show up in 5.0?

P.S. Great app! Love how you broke the mold of a traditional looking app.

Thanks for the comment
I haven’t seen any issues on android 5 that I know of.

What was your solution for setting the volume? Using the Media Plugin I’m trying to use the setVolume method but it doesn’t seem to be working.

I use the Web Audio API

1 Like

Hello,

I have added https://github.com/shi11/RemoteControls plugin, everything works great BUT not the progress bar, it’s not stop when is in Pause state. How can I make it stops when music paused?

Plus, if we click pause/play audio in app, the notification area buttons don’t update. It always is in Play mode.

Can you kindly give a help?

I’m using Ionic 2 + Cordova MediaPlugin.

Thanks in advance.

To get the button to change you need to stop the audio instead of just pausing. Seems to be the only way to get it to work properly.

1 Like

Hi Kopertone,

Thanks for your response. Just wanna pause or play the audio. I just tried stop the audio but notification area buttons still not work.

Is there any way to call to event.remoteEvent.subtype and set it to play or pause from in app? And any idea about progress bar on notification area?

Thanks.

Hey Kopertone,

Which parameters of the Web Audio API did you use to control the volume?

Followed all your suggestions. It seems to be working on Android but, when I load the app through the TestFlight on my iPhone 6 that is running iOS 10.3.2 (14F89) the music plays without any problems even on the locked screen but instead of showing my App on the locked screen, it shows the latest music app I was running before, with a “Play” button. If click on this “Play” button, it starts playing music from the previously used music App on top of the music that is being played by my App… I feel like my phone doesn’t see my App at all… Can you please let us know what is that that we are doing wrong? We are soo frustrated… Please help…