diff --git a/paper-audio-player.html b/paper-audio-player.html index ee7fcc6..70ca213 100755 --- a/paper-audio-player.html +++ b/paper-audio-player.html @@ -309,6 +309,10 @@ type: Boolean, value: false }, + isPlaying: { + type: Boolean, + value: false + }, preload: { type: String, value: 'auto' @@ -377,20 +381,50 @@ }, - // Play/Pause controls + _startPlaying: function() { + var player = this; + + player.$.audio.play().then(function() { + if ('mediaSession' in navigator) { + navigator.mediaSession.metadata = new MediaMetadata({ + title: player.title, + }); + + navigator.mediaSession.setActionHandler('play', function() { + player.playPause() + }); + navigator.mediaSession.setActionHandler('pause', function() { + player.pause() + }); + navigator.mediaSession.setActionHandler('seekbackward', function() { + player._skipReverseByInterval(new CustomEvent('skip', { 'detail': {'key': 'left'} })); + }); + navigator.mediaSession.setActionHandler('seekforward', function() { + player._skipReverseByInterval(new CustomEvent('skip', { 'detail': {'key': 'right'} })); + }); + navigator.mediaSession.setActionHandler('previoustrack', function() { + player._skipReverseByInterval(new CustomEvent('skip', { 'detail': {'key': 'down'} })); + }); + navigator.mediaSession.setActionHandler('nexttrack', function() { + player._skipReverseByInterval(new CustomEvent('skip', { 'detail': {'key': 'up'} })); + }); + } + }); + }, + // Play/Pause controls playPause: function(e){ if (!!e) e.preventDefault(); var player = this; if ( player.canBePlayed ) { - return player.isPlaying ? player.$.audio.pause() : player.$.audio.play(); + return player.isPlaying ? player.$.audio.pause() : player._startPlaying(); } else if (player.preload === 'none') { // If player can't be played, because audio wasn't pre-loaded // due to the preload="none" property set, // load the audio file at this point and start playing it immediately player.$.audio.load(); - player.$.audio.play(); + player._startPlaying(); } }, @@ -401,7 +435,7 @@ if (!!e) e.preventDefault(); var player = this; player.$.audio.currentTime = 0; - if ( !player.isPlaying ) player.$.audio.play(); + if ( !player.isPlaying ) player._startPlaying(); }, @@ -422,7 +456,7 @@ // If player has auto-play attribute set, // it ignores preload="none" property and starts playing on load. // This behavior corresponds to the native audio element behavior. - if (player.autoPlay) player.$.audio.play(); + if (player.autoPlay) player._startPlaying(); }, @@ -460,7 +494,7 @@ } player._updatePlayPosition(newTime); - if (!player.isPlaying) player.$.audio.play(); + if (!player.isPlaying) player._startPlaying(); }, @@ -493,6 +527,10 @@ player.isPlaying = false; }, + pause: function() { + var player = this; + if ( player.isPlaying ) player.$.audio.pause(); + }, // when Player ended playing an audio file @@ -535,7 +573,7 @@ if (player.canBePlayed) { player._updateProgressBar(e); - if (!player.isPlaying) player.$.audio.play(); + if (!player.isPlaying) player._startPlaying(); // When preload="none" is being used, // player should first try to load the audio, @@ -544,7 +582,7 @@ player.$.audio.load(); player.$.audio.addEventListener('loadedmetadata', function() { player._updateProgressBar(e); - if (!player.isPlaying) player.$.audio.play(); + if (!player.isPlaying) player._startPlaying(); }, false); } }, @@ -596,7 +634,7 @@ if (player.isPlaying) { player.$.audio.pause(); - player.$.audio.play(); + player._startPlaying(); } }, @@ -622,4 +660,4 @@ } }); - \ No newline at end of file + diff --git a/test/basic-test.html b/test/basic-test.html index 5da66e2..a7adc1d 100755 --- a/test/basic-test.html +++ b/test/basic-test.html @@ -33,6 +33,14 @@ assert.equal(basicPlayer.$.audio.src, 'http://nadikun.com/audio/suit-and-tie-oscar-wylde-remix.mp3'); }); + test('defines the "src" property', function() { + assert.notOk(basicPlayer.isPlaying); + basicPlayer.playPause(); + assert.ok(basicPlayer.isPlaying); + basicPlayer.pause(); + assert.notOk(basicPlayer.isPlaying); + }); + test('defines the "color" property', function() { assert.equal(basicPlayer.color, '#F05C38'); assert.equal(basicPlayer.querySelector('#progress').style.backgroundColor, 'rgb(240, 92, 56)'); @@ -56,4 +64,4 @@ - + \ No newline at end of file