diff --git a/site/radiostasis.js b/site/radiostasis.js index ff87e38..e6efbc5 100644 --- a/site/radiostasis.js +++ b/site/radiostasis.js @@ -63,6 +63,7 @@ var Player = /** @class */ (function () { this.playButton.addEventListener('click', function () { return _this.playPause(); }); this.rewButton.addEventListener('click', function () { return _this.rewind(); }); this.ffwButton.addEventListener('click', function () { return _this.fastForward(); }); + this.skipButton.addEventListener('click', function () { return _this.nextEpisode(); }); this.volumeSlider.addEventListener('change', function () { return _this.setVolume(); }); // wire up mediaSession events if ('mediaSession' in navigator) { @@ -77,6 +78,9 @@ var Player = /** @class */ (function () { navigator.mediaSession.setActionHandler('seekbackward', function () { return _this.rewind(); }); + navigator.mediaSession.setActionHandler('nexttrack', function () { + return _this.nextEpisode(); + }); // don't support previous track yet, queue removes them once finished // wire this up to rewind instead navigator.mediaSession.setActionHandler('previoustrack', function () { @@ -134,7 +138,7 @@ var Player = /** @class */ (function () { _this.setPlayButtonUI(); _this.stopTicker(); }, - onend: function () { return _this.stopPlaybackAndResetUi(); }, + onend: function () { return _this.nextEpisode(); }, onloaderror: function () { return _this.setErrorUI('Playback error'); }, }); return [2 /*return*/]; @@ -175,6 +179,17 @@ var Player = /** @class */ (function () { this.updateTimeUI(); } }; + Player.prototype.nextEpisode = function () { + var next = this.playlist.nextEpisode(); + if (next) + this.playEpisode(next); + else { + this.stopPlaybackAndResetUi(); + // manually trigger playlist changed + // so that currently playing media gets wiped + this.playlist.triggerPlaylistChanged(); + } + }; Player.prototype.setPlayButtonUI = function () { this.playButtonPath.setAttribute('d', 'M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM6.79 5.093A.5.5 0 0 0 6 5.5v5a.5.5 0 0 0 .79.407l3.5-2.5a.5.5 0 0 0 0-.814l-3.5-2.5z'); }; @@ -209,13 +224,14 @@ var Player = /** @class */ (function () { this.playButton.disabled = true; this.rewButton.disabled = true; this.ffwButton.disabled = true; + this.skipButton.disabled = true; } else { this.playButton.disabled = false; this.rewButton.disabled = false; this.ffwButton.disabled = false; + this.skipButton.disabled = !this.playlist.hasNextEpisode(); } - this.skipButton.disabled = !this.playlist.hasNextEpisode(); }; Player.prototype.sendMediaSessionMetadata = function () { if ('mediaSession' in navigator) { @@ -360,6 +376,9 @@ var Playlist = /** @class */ (function () { Playlist.prototype.isQueued = function (episode) { return this.episodeHash.has(episode.id); }; + Playlist.prototype.triggerPlaylistChanged = function () { + this.playlistChanged(); + }; Playlist.prototype.playlistChanged = function () { for (var _i = 0, _a = this.changedHandlers; _i < _a.length; _i++) { var handler = _a[_i]; diff --git a/src/Player.ts b/src/Player.ts index 9cb6120..49fc898 100644 --- a/src/Player.ts +++ b/src/Player.ts @@ -71,6 +71,7 @@ class Player { this.playButton.addEventListener('click', () => this.playPause()); this.rewButton.addEventListener('click', () => this.rewind()); this.ffwButton.addEventListener('click', () => this.fastForward()); + this.skipButton.addEventListener('click', () => this.nextEpisode()); this.volumeSlider.addEventListener('change', () => this.setVolume()); // wire up mediaSession events @@ -86,6 +87,9 @@ class Player { navigator.mediaSession.setActionHandler('seekbackward', () => this.rewind() ); + navigator.mediaSession.setActionHandler('nexttrack', () => + this.nextEpisode() + ); // don't support previous track yet, queue removes them once finished // wire this up to rewind instead navigator.mediaSession.setActionHandler('previoustrack', () => @@ -137,7 +141,7 @@ class Player { this.setPlayButtonUI(); this.stopTicker(); }, - onend: () => this.stopPlaybackAndResetUi(), + onend: () => this.nextEpisode(), onloaderror: () => this.setErrorUI('Playback error'), }); }) @@ -176,6 +180,17 @@ class Player { } } + private nextEpisode(): void { + const next = this.playlist.nextEpisode(); + if (next) this.playEpisode(next); + else { + this.stopPlaybackAndResetUi(); + // manually trigger playlist changed + // so that currently playing media gets wiped + this.playlist.triggerPlaylistChanged(); + } + } + private setPlayButtonUI(): void { this.playButtonPath.setAttribute( 'd', @@ -218,13 +233,13 @@ class Player { this.playButton.disabled = true; this.rewButton.disabled = true; this.ffwButton.disabled = true; + this.skipButton.disabled = true; } else { this.playButton.disabled = false; this.rewButton.disabled = false; this.ffwButton.disabled = false; + this.skipButton.disabled = !this.playlist.hasNextEpisode(); } - - this.skipButton.disabled = !this.playlist.hasNextEpisode(); } private sendMediaSessionMetadata(): void { diff --git a/src/Playlist.ts b/src/Playlist.ts index 34d7355..9409683 100644 --- a/src/Playlist.ts +++ b/src/Playlist.ts @@ -91,6 +91,10 @@ class Playlist { return this.episodeHash.has(episode.id); } + public triggerPlaylistChanged(): void { + this.playlistChanged(); + } + private playlistChanged(): void { for (const handler of this.changedHandlers) { handler();