Add an action to flush current playlist

app/actions/webplayer.js

@@ -47,14 +47,14 @@ export const STOP_PLAYBACK = "STOP_PLAYBACK";
  */
 export function stopPlayback() {
     return (dispatch, getState) => {
-        // Handle reference counting
-        dispatch(decrementRefCount({
-            song: getState().webplayer.get("playlist").toArray(),
-        }));
         // Stop playback
         dispatch ({
             type: STOP_PLAYBACK,
         });
+        // Handle reference counting
+        dispatch(decrementRefCount({
+            song: getState().webplayer.get("playlist").toArray(),
+        }));
     };
 }
 

app/components/Playlist.jsx

@@ -1,3 +1,4 @@
+// TODO: Styling
 // NPM import
 import React, { Component, PropTypes } from "react";
 import Immutable from "immutable";
@@ -36,6 +37,12 @@ class PlaylistIntl extends Component {
             };
             playlistText = (
                 <div>
+                    <p className="text-center">
+                        <button onClick={() => this.props.flushAction() }>
+                            <FormattedMessage {...playlistMessages["app.playlist.flushPlaylist"]} />
+                        </button>
+                    </p>
+
                     <h3>
                         <FormattedMessage {...playlistMessages["app.playlist.currentSongPlaying"]} />
                     </h3>
@@ -68,7 +75,8 @@ class PlaylistIntl extends Component {
 }
 PlaylistIntl.propTypes = {
     playAction: PropTypes.func.isRequired,
-    playNextAction: PropTypes.func.isRequired,
+    playNextAction: PropTypes.func,
+    flushAction: PropTypes.func.isRequired,
     songs: PropTypes.instanceOf(Immutable.List).isRequired,
     currentIndex: PropTypes.number.isRequired,
     intl: intlShape.isRequired,

app/locales/en-US/index.js

@@ -11,7 +11,7 @@ module.exports = {
     "app.common.loading": "Loading…",  // Loading indicator
     "app.common.pause": "Pause",  // Pause icon description
     "app.common.play": "Play",  // Play icon description
-    "app.common.playNext": "Play next",  // "Play next icon descripton"
+    "app.common.playNext": "Play next",  // Play next icon descripton
     "app.common.track": "{itemCount, plural, one {track} other {tracks}}",  // Track
     "app.filter.filter": "Filter…",  // Filtering input placeholder
     "app.filter.whatAreWeListeningToToday": "What are we listening to today?",  // Description for the filter bar
@@ -32,10 +32,11 @@ module.exports = {
     "app.pagination.goToPageWithoutMarkup": "Go to page {pageNumber}",  // Link title to go to page N
     "app.pagination.pageNavigation": "Page navigation",  // ARIA label for the nav block containing pagination
     "app.pagination.pageToGoTo": "Page to go to?",  // Title of the pagination modal
-    "app.playlist.currentSongPlaying": "Current song playing",  // "Current song playing"
-    "app.playlist.emptyPlaylist": "Empty playlist",  // "Empty playlist message"
-    "app.playlist.fullPlaylist": "Full playlist",  // "Full playlist"
-    "app.playlist.playlist": "Playlist",  // "Playlist translation"
+    "app.playlist.currentSongPlaying": "Current song playing",  // Current song playing
+    "app.playlist.emptyPlaylist": "Empty playlist",  // Empty playlist message
+    "app.playlist.flushPlaylist": "Empty the playlist",  // Empty the playlist link label
+    "app.playlist.fullPlaylist": "Full playlist",  // Full playlist
+    "app.playlist.playlist": "Playlist",  // Playlist translation
     "app.sidebarLayout.browse": "Browse",  // Browse
     "app.sidebarLayout.browseAlbums": "Browse albums",  // Browse albums
     "app.sidebarLayout.browseArtists": "Browse artists",  // Browse artists
@@ -56,6 +57,6 @@ module.exports = {
     "app.webplayer.previous": "Previous",  // Previous button description
     "app.webplayer.random": "Random",  // Random button description
     "app.webplayer.repeat": "Repeat",  // Repeat button description
-    "app.webplayer.unsupported": "Unsupported media type",  // "Unsupported media type",
+    "app.webplayer.unsupported":"Unsupported media type",  // Unsupported media type
     "app.webplayer.volume": "Volume",  // Volume button description
 };

app/locales/fr-FR/index.js

@@ -11,7 +11,7 @@ module.exports = {
     "app.common.loading": "Chargement…",  // Loading indicator
     "app.common.pause": "Pause",  // Pause icon description
     "app.common.play": "Jouer",  // PLay icon description
-    "app.common.playNext": "Jouer après",  // "Play next icon descripton"
+    "app.common.playNext": "Jouer après",  // Play next icon descripton
     "app.common.track": "{itemCount, plural, one {piste} other {pistes}}",  // Track
     "app.filter.filter": "Filtrer…",  // Filtering input placeholder
     "app.filter.whatAreWeListeningToToday": "Que voulez-vous écouter aujourd'hui\u00a0?",  // Description for the filter bar
@@ -32,10 +32,11 @@ module.exports = {
     "app.pagination.goToPageWithoutMarkup": "Aller à la page {pageNumber}",  // Link title to go to page N
     "app.pagination.pageNavigation": "Navigation entre les pages",  // ARIA label for the nav block containing pagination
     "app.pagination.pageToGoTo": "Page à laquelle aller\u00a0?",  // Title of the pagination modal
-    "app.playlist.currentSongPlaying": "Piste en cours de lecture",  // "Current song playing",
-    "app.playlist.emptyPlaylist": "Liste de lecture vide",  // "Empty playlist message"
-    "app.playlist.fullPlaylist": "Playlist complète",  // "Full playlist",
-    "app.playlist.playlist": "Liste de lecture",  // "Playlist translation"
+    "app.playlist.currentSongPlaying": "Piste en cours de lecture",  // Current song playing
+    "app.playlist.emptyPlaylist": "Liste de lecture vide",  // Empty playlist message
+    "app.playlist.flushPlaylist": "Vider la playlist",  // Empty the playlist link label
+    "app.playlist.fullPlaylist": "Playlist complète",  // Full playlist
+    "app.playlist.playlist": "Liste de lecture",  // Playlist translation
     "app.sidebarLayout.browse": "Explorer",  // Browse
     "app.sidebarLayout.browseAlbums": "Parcourir les albums",  // Browse albums
     "app.sidebarLayout.browseArtists": "Parcourir les artistes",  // Browse artists
@@ -56,6 +57,6 @@ module.exports = {
     "app.webplayer.previous": "Précédent",  // Previous button description
     "app.webplayer.random": "Aléatoire",  // Random button description
     "app.webplayer.repeat": "Répéter",  // Repeat button description
-    "app.webplayer.unsupported": "Format non supporté",  // "Unsupported media type",
+    "app.webplayer.unsupported": "Format non supporté",  // Unsupported media type
     "app.webplayer.volume": "Volume",  // Volume button description
 };

app/locales/messagesDescriptors/Playlist.js

@@ -19,6 +19,11 @@ const messages = [
         "defaultMessage": "Empty playlist",
         "description": "Empty playlist message",
     },
+    {
+        "id": "app.playlist.flushPlaylist",
+        "defaultMessage": "Empty the playlist",
+        "description": "Empty the playlist link label",
+    },
 ];
 
 export default messages;

app/views/PlaylistPage.jsx

@@ -17,7 +17,7 @@ import Playlist from "../components/Playlist";
 class PlaylistPage extends Component {
     render() {
         return (
-            <Playlist playAction={this.props.actions.jumpToSong} playNextAction={null} songs={this.props.songsList} currentIndex={this.props.currentIndex} />
+            <Playlist playAction={this.props.actions.jumpToSong} playNextAction={null} flushAction={this.props.actions.stopPlayback} songs={this.props.songsList} currentIndex={this.props.currentIndex} />
         );
     }
 }