Formatting tracks, using simple objects instead of full collate mechanic

This commit is contained in:
James Barnsley
2018-09-05 21:29:46 +12:00
parent b98386d294
commit bd14cdc2b2
10 changed files with 11188 additions and 14232 deletions

View File

@ -5426,6 +5426,9 @@ main header {
.light-theme main header .options .button:hover, .light-theme
main header .options button:hover {
color: #32b5f2; }
.light-theme main header .options .button:active, .light-theme
main header .options button:active {
background: transparent; }
main header.overlay {
position: absolute;
top: 0;

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -98,7 +98,7 @@
// Release details
// These are automatically injected to built HTML
var build = "1536011758";
var build = "1536134952";
var version = "3.25.1";
// Construct the script tag

View File

@ -308,11 +308,36 @@ export let getTrackIcon = function(current_track = false, core = false){
}
/**
* Format a simple object
* This is a shell record containing only the bare essentials. Typically
* a tracks' artists/album
*
* @param data obj
* @return obj
**/
export let formatSimpleObject = function(data){
var simple_object = {}
var fields = [
'uri',
'name'
];
for (var field of fields){
if (data.hasOwnProperty(field)){
simple_object[field] = data[field];
}
}
return simple_object;
}
/**
* Format our album objects into a universal format
*
* @param data obj
* @return album obj
* @return obj
**/
export let formatAlbum = function(data){
var album = {};
@ -335,10 +360,12 @@ export let formatAlbum = function(data){
}
}
if (data.date && !album.date) album.release_date = data.date;
// Actively overwrite "type" with "album_type"
if (data.album_type) album.type = data.album_type;
if (data.date && !album.date){
album.release_date = data.date;
}
if (data.album_type){
album.type = data.album_type;
}
return album;
}
@ -348,7 +375,7 @@ export let formatAlbum = function(data){
* Format our artist objects into a universal format
*
* @param data obj
* @return artist obj
* @return obj
**/
export let formatArtist = function(data){
var artist = {}
@ -405,7 +432,7 @@ export let formatArtist = function(data){
* Format our playlist objects into a universal format
*
* @param data obj
* @return playlist obj
* @return obj
**/
export let formatPlaylist = function(data){
var playlist = {}
@ -445,7 +472,7 @@ export let formatPlaylist = function(data){
* Format a user objects into a universal format
*
* @param data obj
* @return playlist obj
* @return obj
**/
export let formatUser = function(data){
var user = {}
@ -470,9 +497,12 @@ export let formatUser = function(data){
if (data.followers && data.followers.total){
user.followers = data.followers.total;
}
if (data.display_name && !user.name) user.name = data.display_name;
if (data.id && !user.name) user.name = data.id;
if (data.display_name && !user.name){
user.name = data.display_name;
}
if (data.id && !user.name){
user.name = data.id;
}
return user;
}
@ -481,79 +511,100 @@ export let formatUser = function(data){
/**
* Format tracks into our universal format
*
* @param tracks = object or array of objects
* @return array
* @param data obj
* @return obj
**/
export let formatTrack = function(data){
var track = {}
var fields = [
'uri',
'tlid',
'provider',
'name',
'images',
'release_date',
'disc_number',
'track_number',
'duration',
'followers',
'artists', // Array of simple records
'album' // Array of simple records
];
// Nested track object (eg in spotify playlist)
if (data.track && isObject(data.track)){
// Copy wrapper's details (if applicable)
if (data.added_by){
data.track.added_by = data.added_by;
}
if (data.added_at){
data.track.added_at = data.added_at;
}
if (data.tlid){
data.track.tlid = data.tlid;
}
// And now flatten
data = data.track;
}
// Loop fields and import from data
for (var field of fields){
if (data.hasOwnProperty(field)){
track[field] = data[field];
}
}
if (data.followers && data.followers.total){
track.followers = data.followers.total;
}
if (!track.duration && data.duration_ms){
track.duration = data.duration_ms;
} else if (!track.duration && data.length){
track.duration = data.length;
}
if (!track.track_number && data.track_no){
track.track_number = data.track_no;
}
if (!track.disc_number && data.disc_no){
track.disc_number = data.disc_no;
}
if (!track.release_date && data.date){
track.release_date = data.date;
}
// Copy images from albums (if applicable)
// TOOD: Identify if we stil need this...
if (data.album && data.album.images){
if (!track.images || track.images.length > 0){
track.images = data.album.images;
}
}
return track;
}
/**
* Format multiple tracks
*
* @param tracks Array
* @return Array
**/
export let formatTracks = function(tracks){
if (!tracks || tracks === undefined){
return null;
}
// Handle single records
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 && isObject(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;
formatted.push(formatTrack(tracks[i]));
}
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;
} else if (track.track_number){
track.track_number = track.track_number;
}
if (track.disc_no){
track.disc_number = track.disc_no;
}
if (track.release_date){
track.date = track.release_date;
}
// Copy images from albums (if applicable)
if (track.album && track.album.images){
if (!track.images || track.images.length > 0){
track.images = track.album.images;
}
}
formatted.push(track);
}
if (singular){
return formatted[0];
} else {
return formatted;
}
}

View File

@ -326,30 +326,14 @@ const CoreMiddleware = (function(){
/**
* Queue and playback info
* Asset Load commands
*
* These are called from views and other middleware to load
* assets. This is where we can return already indexed records
* where appropriate
**/
case 'CURRENT_TRACK_LOADED':
store.dispatch({
type: 'TRACKS_LOADED',
tracks: [action.track]
});
next(action);
break;
case 'QUEUE_LOADED':
store.dispatch({
type: 'TRACKS_LOADED',
tracks: action.tracks
});
next(action);
break;
case 'LOAD_TRACK':
if (
!action.force_reload &&
store.getState().core.tracks[action.uri]){
@ -503,20 +487,56 @@ const CoreMiddleware = (function(){
* These modify our asset indexes, which are used globally
**/
case 'CURRENT_TRACK_LOADED':
store.dispatch(coreActions.trackLoaded(action.track));
next(action);
break;
/*
case 'QUEUE_LOADED':
store.dispatch(coreActions.tracksLoaded(action.tracks));
next(action);
break;*/
case 'QUEUE_LOADED':
case 'TRACKS_LOADED':
var tracks_index = Object.assign({}, core.tracks);
var artists_index = core.artists;
var albums_index = core.albums;
var tracks_loaded = [];
var artists_loaded = [];
var albums_loaded = [];
action.tracks.forEach(track => {
track = helpers.formatTracks(track);
action.tracks.forEach(raw_track => {
var track = helpers.formatTrack(raw_track);
if (tracks_index[track.uri] !== undefined){
track = Object.assign({}, tracks_index[track.uri], track);
}
if (track.album && track.album.images && track.album.images.length > 0){
track.album.images = helpers.digestMopidyImages(store.getState().mopidy, track.album.images);
track.images = track.album.images;
if (raw_track.album){
track.album = helpers.formatSimpleObject(raw_track.album);
if (!albums_index[raw_track.album.uri]){
albums_loaded.push(raw_track.album);
}
// Copy the images to the track
if (raw_track.album.images){
track.images = helpers.digestMopidyImages(store.getState().mopidy, raw_track.album.images);
}
}
if (raw_track.artists && raw_track.artists.length > 0){
track.artists = [];
for (var artist of raw_track.artists){
track.artists.push(helpers.formatSimpleObject(artist));
// Not already in our index, so let's add it
if (!artists_index[artist.uri]){
artists_loaded.push(artist);
}
}
}
tracks_loaded.push(track);
@ -524,6 +544,13 @@ const CoreMiddleware = (function(){
action.tracks = tracks_loaded;
if (artists_loaded.length > 0){
store.dispatch(coreActions.artistsLoaded(artists_loaded));
}
if (albums_loaded.length > 0){
store.dispatch(coreActions.albumsLoaded(albums_loaded));
}
next(action);
break;
@ -559,8 +586,12 @@ const CoreMiddleware = (function(){
action.albums = albums_loaded;
if (artists_loaded.length > 0){
store.dispatch(coreActions.artistsLoaded(artists_loaded));
}
if (tracks_loaded.length > 0){
store.dispatch(coreActions.tracksLoaded(tracks_loaded));
}
next(action);
break
@ -600,7 +631,9 @@ const CoreMiddleware = (function(){
action.artists = artists_loaded;
if (tracks_loaded.length > 0){
store.dispatch(coreActions.tracksLoaded(tracks_loaded));
}
next(action);
break;
@ -646,8 +679,9 @@ const CoreMiddleware = (function(){
action.playlists = playlists_loaded;
// Load our tracks
if (tracks_loaded.length > 0){
store.dispatch(coreActions.tracksLoaded(tracks_loaded));
}
next(action);
break;

View File

@ -2041,7 +2041,7 @@ const MopidyMiddleware = (function(){
response => {
store.dispatch({
type: 'QUEUE_LOADED',
tracks: helpers.formatTracks(response)
tracks: response
});
}
);
@ -2053,7 +2053,7 @@ const MopidyMiddleware = (function(){
response => {
store.dispatch({
type: 'MOPIDY_QUEUE_HISTORY',
tracks: helpers.formatTracks(response)
tracks: response
});
}
);
@ -2071,10 +2071,10 @@ const MopidyMiddleware = (function(){
break;
case 'MOPIDY_CURRENT_TRACK_LOADED':
var track = helpers.formatTracks(action.tl_track);
var track = helpers.formatTrack(action.tl_track);
// We don't have the track already in our index
if (store.getState().core.tracks[track.uri] === undefined || store.getState().core.tracks[track.uri].images === undefined){
if (!store.getState().core.tracks[track.uri]){
// We've got Spotify running, and it's a spotify track - go straight to the source!
if (store.getState().spotify.enabled && helpers.uriSource(track.uri) == 'spotify'){

View File

@ -154,7 +154,7 @@ class Album extends React.Component{
</div>
<section className="list-wrapper">
<TrackList className="album-track-list" tracks={album.tracks} uri={this.props.params.uri} />
<TrackList className="album-track-list" tracks={album.tracks} uri={album.uri} />
<LazyLoadListener
loadKey={album.tracks_more}
showLoader={is_loading_tracks}

View File

@ -209,6 +209,8 @@ const mapStateToProps = (state, ownProps) => {
radio: state.core.radio,
radio_enabled: (state.core.radio && state.core.radio.enabled ? true : false),
tracks: state.core.tracks,
artists: state.core.artists,
albums: state.core.albums,
queue: state.core.queue,
queue_tlids: state.core.queue_tlids,
queue_metadata: state.core.queue_metadata,

View File

@ -55,6 +55,10 @@ main {
&:hover {
color: $blue;
}
&:active {
background: transparent;
}
}
}
}