Editing and adding to playlists, then we'll reload it

This commit is contained in:
James Barnsley
2017-02-03 09:04:47 +13:00
parent 808ce2d18c
commit 058d2607e9
8 changed files with 45 additions and 22 deletions

View File

@ -77,14 +77,23 @@ class List extends React.Component{
{
this.props.rows.map( (row, row_index) => {
var className = 'list-item'
if( row.type ) className += ' '+row.type
var class_name = 'list-item'
if( row.type ) class_name += ' '+row.type
var source_icon = null
if (this.props.show_source_icon){
if (row.source){
source_icon = <FontAwesome className="source" name={helpers.sourceIcon(false,row.source)} />
}else{
source_icon = <FontAwesome className="source" name={helpers.sourceIcon(row.uri)} />
}
}
return (
<div
onClick={e => this.handleClick(e, row.uri)}
onContextMenu={e => this.handleContextMenu(e,row)}
className={className}
className={class_name}
key={row_index}>
{
this.props.columns.map( (col, col_index) => {
@ -95,7 +104,7 @@ class List extends React.Component{
)
})
}
{ this.props.show_source_icon ? <FontAwesome className="source" name={helpers.sourceIcon(row.uri)} /> : null }
{source_icon}
</div>
)
})

View File

@ -26,7 +26,7 @@ export default class EditPlaylistModal extends React.Component{
savePlaylist(e){
e.preventDefault();
this.props.uiActions.savePlaylist( this.props.data.uri, this.state.name, this.state.is_public )
this.props.uiActions.savePlaylist(this.props.data.uri, this.state.name, this.state.is_public)
this.props.uiActions.closeModal()
return false;
}

View File

@ -129,13 +129,13 @@ export let flattenTracks = function( tracks ){
* Figure out a URI's source namespace
* @param uri = string
**/
export let uriSource = function( uri ){
export let uriSource = function(uri){
var exploded = uri.split(':');
return exploded[0]
}
export let sourceIcon = function( uri ){
var source = uriSource(uri)
export let sourceIcon = function(uri,source = null){
if (uri) source = uriSource(uri)
switch( source ){
case 'local':
case 'm3u':
@ -153,7 +153,7 @@ export let sourceIcon = function( uri ){
* @param element = string, the element we wish to extract
* @param uri = string
**/
export let getFromUri = function( element, uri ){
export let getFromUri = function(element,uri){
var exploded = uri.split(':');
if( element == 'mbid'){

View File

@ -327,6 +327,7 @@ const MopidyMiddleware = (function(){
type: 'playlist',
name: response.name,
uri: response.uri,
source: 'local',
last_modified: response.last_modified,
can_edit: (response.uri.startsWith('m3u:')),
tracks_total: ( response.tracks ? response.tracks.length : 0 )
@ -344,7 +345,6 @@ const MopidyMiddleware = (function(){
break;
case 'MOPIDY_GET_PLAYLIST':
store.dispatch({ type: 'MOPIDY_PLAYLIST_LOADED', data: false });
instruct( socket, store, 'playlists.lookup', action.data )
.then( response => {
var playlist = Object.assign(
@ -352,8 +352,8 @@ const MopidyMiddleware = (function(){
response,
{
type: 'playlist',
tracks: ( response.tracks ? response.tracks : null ),
tracks_total: ( response.tracks ? response.tracks.length : null )
tracks: ( response.tracks ? response.tracks : [] ),
tracks_total: ( response.tracks ? response.tracks.length : [] )
}
)

View File

@ -236,6 +236,7 @@ const SpotifyMiddleware = (function(){
{},
action.playlists[i],
{
source: 'spotify',
can_edit: (store.getState().spotify.authorized && store.getState().spotify.me && action.playlists[i].owner.id == store.getState().spotify.me.id),
tracks_total: action.playlists[i].tracks.total
}

View File

@ -2,6 +2,7 @@
import ReactGA from 'react-ga'
var uiActions = require('./actions.js')
var mopidyActions = require('../mopidy/actions.js')
var spotifyActions = require('../spotify/actions.js')
var helpers = require('../../helpers.js')
@ -185,9 +186,15 @@ const UIMiddleware = (function(){
break
case 'PLAYLIST_TRACKS_ADDED':
store.dispatch(uiActions.createNotification('Added '+action.tracks_uris.length+' tracks to playlist'))
store.dispatch(uiActions.createNotification('Added '+action.tracks_uris.length+' tracks to playlist'))
switch(helpers.uriSource(action.key)){
case 'spotify':
store.dispatch(spotifyActions.getPlaylist(action.key))
break
case 'm3u':
if( store.getState().mopidy.connected ) store.dispatch(mopidyActions.getPlaylist(action.key))
break
}
next(action)
break

View File

@ -174,8 +174,10 @@ class Playlist extends React.Component{
**/
const mapStateToProps = (state, ownProps) => {
var uri = ownProps.params.uri
uri = uri.replace(' ','%20')
return {
playlist: (state.ui.playlists && typeof(state.ui.playlists[ownProps.params.uri]) !== 'undefined' ? state.ui.playlists[ownProps.params.uri] : false ),
playlist: (state.ui.playlists && typeof(state.ui.playlists[uri]) !== 'undefined' ? state.ui.playlists[uri] : false ),
mopidy_connected: state.mopidy.connected,
spotify_authorized: state.spotify.authorized,
spotify_userid: state.spotify.me.id

View File

@ -60,24 +60,24 @@ class LibraryPlaylists extends React.Component{
if( this.props.view == 'list' ){
var columns = [
{
width: 30,
width: 50,
label: 'Name',
name: 'name'
},
{
width: 30,
width: 20,
label: 'Owner',
name: 'owner'
},
{
width: 10,
label: 'Can edit',
name: 'can_edit'
label: 'Tracks',
name: 'tracks_total'
},
{
width: 10,
label: 'Tracks',
name: 'tracks_total'
label: 'Can edit',
name: 'can_edit'
}
]
return (
@ -130,6 +130,10 @@ class LibraryPlaylists extends React.Component{
{
value: 'tracks.total',
label: 'Tracks'
},
{
value: 'source',
label: 'Source'
}
]