Background Audio in Windows 8 App

Question

I'm trying to get audio to work outside the app (I'm using the HTML5, Javascript approach) in Windows 8, so when you close the app the sound continues to work, from what I have researched on here and on other sites and I believe this is called in Windows 8 'background audio, I've followed all the tutorials on Microsoft Developer site, and have declared background audio in the app manifest as so:

<Extension Category="windows.backgroundTasks" StartPage="default.html">
      <BackgroundTasks>
        <Task Type="audio" />
        <Task Type="controlChannel" />
      </BackgroundTasks>
    </Extension>

and where I have added the msAudioCategory="BackgroundCapableMedia" controls="controls" to my HTML5 audio tag as so:

<audio id="playback" msAudioCategory="BackgroundCapableMedia" controls="controls"> 
    </audio>

and I've also added this to my default.js file which was apprently needed, although I'm not sure what this does

// Declare a variable that you will use as an instance of an object
var mediaControls;

// Assign the button object to mediaControls
mediaControls = Windows.Media.MediaControl;

// Add an event listener for the Play, Pause Play/Pause toggle button
mediaControls.addEventListener("playpausetogglepressed", playpausetoggle, false);
mediaControls.addEventListener("playpressed", playbutton, false);
mediaControls.addEventListener("pausepressed", pausebutton, false);

// The event handler for the play/pause button
function playpausetoggle() {
    if (mediaControls.isPlaying === true) {
        document.getElementById("playback").pause();
    } else {
        document.getElementById("playback").play();
    }
}

// The event handler for the pause button
function pausebutton() {
    document.getElementById("playback").pause();
}

// The event handler for the play button
function playbutton() {
    document.getElementById("playback").play();
}

I have also tried changing the ID in the last part to have a hash tag as well but still when I press the start button to go back home the audio stops, am I doing something wrong?

Thanks

Answer 1

I believe you also need to handle the "stoppressed" event:

mediaControls.addEventListener("stoppressed", stop, false);

function stop() {
    // Handle the stop event.
    document.getElementById("playback").pause();
    document.getElementById("playback").currentTime = 0;
}

The three steps for playing background audio in Windows 8 JavaScript apps are:

1. Decalare an audio background task in package.appxmanifest. Also list a StartPage. You did this correctly.
2. Set msAudioCategory="BackgroundCapableMedia". You did this.
3. Implement support for media controls. Media controls are buttons on remote controls or on certain keyboards that play, pause, or stop audio. See the Configure keys for media sample on MSDN for a working example. I was able to get the example to work when only handling "stoppressed" in addition to the 3 events you were already handling.

For more information, watch Your Metro style app, video and audio, part 2 from the 2011 Build conference. Background audio is covered beginning at around 31 minutes, 20 seconds into the video and lasts for about 10 minutes. Note that this video is from September, 2011, and covers the Developer Preview of Windows 8. The concepts still apply to the released versions of Windows 8 and Windows RT, but namespaces and attribute names are different in some places.