From 376a93f7fc88a0e0e256e733b9abd1f9405deea8 Mon Sep 17 00:00:00 2001 From: James Barnsley Date: Wed, 18 Oct 2017 17:03:59 +1300 Subject: [PATCH] TlTrack borked --- src/js/components/Track.js | 3 +- src/js/helpers.js | 74 ++++++++++++++++++++++++------ src/js/services/core/reducer.js | 50 ++++++++++++-------- src/js/services/spotify/actions.js | 5 +- src/js/views/Track.js | 23 ++++++---- src/scss/global/_forms.scss | 4 ++ 6 files changed, 110 insertions(+), 49 deletions(-) diff --git a/src/js/components/Track.js b/src/js/components/Track.js index b9c298e9..1d238495 100755 --- a/src/js/components/Track.js +++ b/src/js/components/Track.js @@ -178,8 +178,7 @@ export default class Track extends React.Component{ ) track_columns.push( - {track.duration_ms ? : null} - {track.length ? : null} + {track.duration ? : null} ) diff --git a/src/js/helpers.js b/src/js/helpers.js index 72aa8448..6e4b0f8d 100755 --- a/src/js/helpers.js +++ b/src/js/helpers.js @@ -166,24 +166,68 @@ export let getTrackIcon = function(current_track = false, core = false){ /** - * Get a track's icon - * @param track object - * @return string + * Format tracks into our universal format + * + * @param tracks = array + * @return array **/ -export let flattenTracks = function(tracks){ - var flattened = [] - for(var i = 0; i < tracks.length; i++){ - flattened.push(Object.assign( - {}, - tracks[i].track, - { - added_by: tracks[i].added_by, - added_at: tracks[i].added_at - } - )) +export let formatTracks = function(tracks){ + + // Handle single recoreds + var singular = false; + if (tracks.constructor !== Array){ + tracks = [tracks]; + singular = true; + } + + var formatted = []; + for (var i = 0; i < tracks.length; i++){ + + // Nested track object (eg in spotify playlist) + if (tracks[i].track){ + var track = Object.assign({}, tracks[i].track); + + // Copy supporting values + if (tracks[i].added_by){ + track.added_by = tracks[i].added_by; + } + if (tracks[i].added_at){ + track.added_at = tracks[i].added_at; + } + if (tracks[i].tlid){ + track.tlid = tracks[i].tlid; + } + + } else { + var track = Object.assign({}, tracks[i]); + } + + if (track.duration_ms){ + track.duration = track.duration_ms; + } else if (track.length){ + track.duration = track.length; + } + + if (track.track_no){ + track.track_number = track.track_no; + } + + if (track.disc_no){ + track.disc_number = track.disc_no; + } + + if (track.release_date){ + track.date = track.release_date; + } + + formatted.push(track); } - return flattened + if (singular){ + return formatted[0]; + } else { + return formatted; + } } diff --git a/src/js/services/core/reducer.js b/src/js/services/core/reducer.js index 6a51fd7f..68e34366 100755 --- a/src/js/services/core/reducer.js +++ b/src/js/services/core/reducer.js @@ -15,9 +15,9 @@ export default function reducer(core = {}, action){ if (!action.data ) return core var tracklist = [] - for(var i = 0; i < action.data.length; i++){ + for (var i = 0; i < action.data.length; i++){ - var tltrack = action.data[i] + var tltrack = helpers.formatTracks(action.data[i]); // load our metadata (if we have any for that tlid) if (core.queue_metadata !== undefined && core.queue_metadata['tlid_'+tltrack.tlid] !== undefined){ @@ -34,9 +34,11 @@ export default function reducer(core = {}, action){ tlid: tltrack.tlid, playing: (core.current_track && tltrack.tlid == core.current_track.tlid ) }) - tracklist.push(track ) + tracklist.push(track) } + tracklist = helpers.formatTracks(tracklist); + return Object.assign({}, core, { current_tracklist: tracklist }); case 'MOPIDY_CURRENTTLTRACK': @@ -70,18 +72,18 @@ export default function reducer(core = {}, action){ var tracks = Object.assign({}, core.tracks) if (tracks[action.key]){ - var track = Object.assign({}, tracks[action.key], action.track) + var track = Object.assign( + {}, + tracks[action.key], + helpers.formatTracks(action.track) + ); } else { - var track = Object.assign({}, action.track) + var track = Object.assign( + {}, + helpers.formatTracks(action.track) + ); } - // Standardise components - if (!track.track_number && track.track_no) track.track_number = track.track_no; - if (!track.disc_number && track.disc_no) track.disc_number = track.disc_no; - if (!track.duration && track.duration_ms) track.duration = track.duration_ms; - if (!track.duration && track.length) track.duration = track.length; - if (!track.date && track.release_date) track.date = track.release_date; - tracks[action.key] = track return Object.assign({}, core, { tracks: tracks }); @@ -90,10 +92,14 @@ export default function reducer(core = {}, action){ for (var i = 0; i < action.tracks.length; i++){ var track = action.tracks[i] - if (typeof(tracks[track.uri]) !== 'undefined'){ - track = Object.assign({}, tracks[track.uri], track) + if (tracks[track.uri] !== undefined){ + track = Object.assign( + {}, + tracks[track.uri], + track + ); } - tracks[track.uri] = track + tracks[track.uri] = helpers.formatTracks(track); } return Object.assign({}, core, { tracks: tracks }); @@ -191,7 +197,9 @@ export default function reducer(core = {}, action){ var album = Object.assign({}, action.album) } + album.tracks = helpers.formatTracks(album.tracks); albums[action.key] = album + return Object.assign({}, core, { albums: albums }); case 'ALBUMS_LOADED': @@ -202,6 +210,8 @@ export default function reducer(core = {}, action){ if (albums[album.uri]){ album = Object.assign({}, albums[album.uri], album) } + + album.tracks = helpers.formatTracks(album.tracks); albums[album.uri] = album } @@ -344,7 +354,7 @@ export default function reducer(core = {}, action){ existing_playlist, action.playlist, { - tracks: tracks + tracks: helpers.formatTracks(tracks) } ) } else { @@ -393,7 +403,7 @@ export default function reducer(core = {}, action){ existing_playlist, loaded_playlist, { - tracks: tracks + tracks: helpers.formatTracks(tracks) } ) @@ -412,7 +422,7 @@ export default function reducer(core = {}, action){ {}, playlists[action.key], { - tracks: [...playlists[action.key].tracks, ...helpers.flattenTracks(action.data.items)], + tracks: [...playlists[action.key].tracks, ...helpers.formatTracks(action.data.items)], tracks_more: action.data.next, tracks_total: action.data.total } @@ -437,7 +447,7 @@ export default function reducer(core = {}, action){ case 'PLAYLIST_TRACKS': var playlists = Object.assign([], core.playlists) - var playlist = Object.assign({}, playlists[action.key], { tracks: action.tracks }) + var playlist = Object.assign({}, playlists[action.key], { tracks: helpers.formatTracks(action.tracks) }) playlists[action.key] = playlist return Object.assign({}, core, { playlists: playlists }); @@ -552,7 +562,7 @@ export default function reducer(core = {}, action){ } else { var tracks = [] } - if (action.tracks) tracks = [...tracks, ...action.tracks] + if (action.tracks) tracks = [...tracks, ...helpers.formatTracks(action.tracks)] // more tracks if (typeof(action.tracks_more) !== 'undefined') var tracks_more = action.tracks_more diff --git a/src/js/services/spotify/actions.js b/src/js/services/spotify/actions.js index d52baadb..6cd12d55 100755 --- a/src/js/services/spotify/actions.js +++ b/src/js/services/spotify/actions.js @@ -302,6 +302,7 @@ export function getTrack(uri){ images: response.album.images } ) + dispatch({ type: 'TRACK_LOADED', key: uri, @@ -395,7 +396,7 @@ export function getFeaturedPlaylists(){ }, error => { dispatch(coreActions.handleException( - 'Could not load featured tracks', + 'Could not load featured playlists', error )); } @@ -1470,7 +1471,7 @@ export function getPlaylist(uri){ response, { can_edit: (getState().spotify.me && response.owner.id == getState().spotify.me.id), - tracks: helpers.flattenTracks(response.tracks.items), + tracks: response.tracks.items, tracks_more: response.tracks.next, tracks_total: response.tracks.total, description: description diff --git a/src/js/views/Track.js b/src/js/views/Track.js index 31eb1997..de128724 100755 --- a/src/js/views/Track.js +++ b/src/js/views/Track.js @@ -100,7 +100,16 @@ class Track extends React.Component{ renderLyricsSelector(){ if (!this.props.track.lyrics_results){ - return null; + return ( +
+
+ +
+ Switch to another lyrics seach result +
+
+
+ ); } return ( @@ -139,15 +148,7 @@ class Track extends React.Component{ ); - } else if (!this.props.track.lyrics){ - return ( -
-
- No lyrics available -
-
- ) - } else { + } else if (this.props.track.lyrics){ return (
@@ -156,6 +157,8 @@ class Track extends React.Component{
) + } else { + return null; } } diff --git a/src/scss/global/_forms.scss b/src/scss/global/_forms.scss index a2aa3edc..26d69c5f 100755 --- a/src/scss/global/_forms.scss +++ b/src/scss/global/_forms.scss @@ -26,6 +26,10 @@ select { &:active { background: rgba(255,255,255,0.2); } + + &:disabled { + opacity: 0.5; + } } select {