wip: Artist page written in composition API in order to improve it and resolve issue 18; style: changed tabs in Artist page
This commit is contained in:
35
src/data/artist.js
Normal file
35
src/data/artist.js
Normal file
@@ -0,0 +1,35 @@
|
||||
import { getPropertyWithFallback } from '@/utils/utils'
|
||||
|
||||
export function formatArtistData(artistData) {
|
||||
return {
|
||||
artistID: getPropertyWithFallback(artistData, 'id'),
|
||||
artistName: getPropertyWithFallback(artistData, 'name'),
|
||||
artistPictureXL: getPropertyWithFallback(artistData, 'picture_xl'),
|
||||
artistReleases: formatArtistReleases(getPropertyWithFallback(artistData, 'releases'))
|
||||
}
|
||||
}
|
||||
|
||||
function formatArtistReleases(artistReleases) {
|
||||
let formattedReleases = {}
|
||||
|
||||
for (const releaseType in artistReleases) {
|
||||
if (artistReleases.hasOwnProperty(releaseType)) {
|
||||
const releases = artistReleases[releaseType]
|
||||
formattedReleases[releaseType] = []
|
||||
|
||||
for (const release of releases) {
|
||||
formattedReleases[releaseType].push({
|
||||
releaseID: getPropertyWithFallback(release, 'id'),
|
||||
releaseCover: getPropertyWithFallback(release, 'cover_small'),
|
||||
releaseTitle: getPropertyWithFallback(release, 'title'),
|
||||
releaseDate: getPropertyWithFallback(release, 'release_date'),
|
||||
releaseTracksNumber: getPropertyWithFallback(release, 'nb_song'),
|
||||
releaseLink: getPropertyWithFallback(release, 'link'),
|
||||
isReleaseExplicit: getPropertyWithFallback(release, 'explicit_lyrics')
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return formattedReleases
|
||||
}
|
||||
@@ -1,7 +1,7 @@
|
||||
import { getProperty } from '@/utils/utils'
|
||||
import { getPropertyWithFallback } from '@/utils/utils'
|
||||
|
||||
/**
|
||||
* @typedef {object} ReducedSearchResult
|
||||
* @typedef {object} FormattedSearchResult
|
||||
* @property {FormattedData} data
|
||||
* @property {boolean} hasLoaded
|
||||
*/
|
||||
@@ -15,38 +15,11 @@ import { getProperty } from '@/utils/utils'
|
||||
* @returns {FormattedData} formattedData
|
||||
*/
|
||||
|
||||
/**
|
||||
* Reduces passed data to a specific format decied by the formatter passed.
|
||||
*
|
||||
* @param {object} rawObj
|
||||
* @param {Formatter} formatFunc
|
||||
* @returns {null|ReducedSearchResult}
|
||||
*/
|
||||
export function formatSearchResults(rawObj, formatFunc) {
|
||||
if (!rawObj.hasLoaded) {
|
||||
return null
|
||||
} else {
|
||||
const { data: rawData } = rawObj
|
||||
const formattedData = []
|
||||
|
||||
for (const dataElement of rawData) {
|
||||
let formatted = formatFunc(dataElement)
|
||||
|
||||
formattedData.push(formatted)
|
||||
}
|
||||
|
||||
return {
|
||||
data: formattedData,
|
||||
hasLoaded: rawObj.hasLoaded
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {FormattedData} track
|
||||
*/
|
||||
export function formatSingleTrack(track) {
|
||||
let isTrackExplicit = getProperty(track, 'explicit_lyrics', 'EXPLICIT_LYRICS')
|
||||
let isTrackExplicit = getPropertyWithFallback(track, 'explicit_lyrics', 'EXPLICIT_LYRICS')
|
||||
|
||||
if (typeof isTrackExplicit === 'string') {
|
||||
isTrackExplicit = isTrackExplicit !== '0'
|
||||
@@ -54,28 +27,32 @@ export function formatSingleTrack(track) {
|
||||
|
||||
return {
|
||||
/* Track */
|
||||
trackTitle: getProperty(track, 'title', 'SNG_TITLE'),
|
||||
trackTitleVersion: getProperty(track, 'title_version', 'VERSION'),
|
||||
trackPreview: getProperty(track, 'preview'),
|
||||
trackDuration: getProperty(track, 'duration', 'DURATION'),
|
||||
trackLink: getProperty(track, 'link') || `https://www.deezer.com/track/${track.SNG_ID}`,
|
||||
trackTitle: getPropertyWithFallback(track, 'title', 'SNG_TITLE'),
|
||||
trackTitleVersion: getPropertyWithFallback(track, 'title_version', 'VERSION'),
|
||||
trackPreview: getPropertyWithFallback(track, 'preview'),
|
||||
trackDuration: getPropertyWithFallback(track, 'duration', 'DURATION'),
|
||||
trackLink: getPropertyWithFallback(track, 'link') || `https://www.deezer.com/track/${track.SNG_ID}`,
|
||||
isTrackExplicit,
|
||||
|
||||
/* Artist */
|
||||
artistID: getProperty(track, 'artist.id', 'ART_ID'),
|
||||
artistName: getProperty(track, 'artist.name', 'ART_NAME'),
|
||||
artistID: getPropertyWithFallback(track, 'artist.id', 'ART_ID'),
|
||||
artistName: getPropertyWithFallback(track, 'artist.name', 'ART_NAME'),
|
||||
|
||||
/* Album */
|
||||
albumID: getProperty(track, 'album.id', 'ALB_ID'),
|
||||
albumTitle: getProperty(track, 'album.title', 'ALB_TITLE'),
|
||||
albumID: getPropertyWithFallback(track, 'album.id', 'ALB_ID'),
|
||||
albumTitle: getPropertyWithFallback(track, 'album.title', 'ALB_TITLE'),
|
||||
albumPicture:
|
||||
getProperty(track, 'album.cover_small') ||
|
||||
getPropertyWithFallback(track, 'album.cover_small') ||
|
||||
`https://e-cdns-images.dzcdn.net/images/cover/${track.ALB_PICTURE}/32x32-000000-80-0-0.jpg`
|
||||
}
|
||||
}
|
||||
|
||||
export function formatAlbums(album) {
|
||||
let isAlbumExplicit = getProperty(album, 'explicit_lyrics', 'EXPLICIT_ALBUM_CONTENT.EXPLICIT_LYRICS_STATUS')
|
||||
let isAlbumExplicit = getPropertyWithFallback(
|
||||
album,
|
||||
'explicit_lyrics',
|
||||
'EXPLICIT_ALBUM_CONTENT.EXPLICIT_LYRICS_STATUS'
|
||||
)
|
||||
|
||||
if ('number' === typeof isAlbumExplicit) {
|
||||
isAlbumExplicit = isAlbumExplicit === 1
|
||||
@@ -83,49 +60,49 @@ export function formatAlbums(album) {
|
||||
|
||||
return {
|
||||
/* Album */
|
||||
albumID: getProperty(album, 'id', 'ALB_ID'),
|
||||
albumTitle: getProperty(album, 'title', 'ALB_TITLE'),
|
||||
albumID: getPropertyWithFallback(album, 'id', 'ALB_ID'),
|
||||
albumTitle: getPropertyWithFallback(album, 'title', 'ALB_TITLE'),
|
||||
albumCoverMedium:
|
||||
getProperty(album, 'cover_medium') ||
|
||||
getPropertyWithFallback(album, 'cover_medium') ||
|
||||
`https://e-cdns-images.dzcdn.net/images/cover/${album.ALB_PICTURE}/156x156-000000-80-0-0.jpg`,
|
||||
albumLink: getProperty(album, 'link') || `https://deezer.com/album/${album.ALB_ID}`,
|
||||
albumTracks: getProperty(album, 'nb_tracks', 'NUMBER_TRACK'),
|
||||
albumLink: getPropertyWithFallback(album, 'link') || `https://deezer.com/album/${album.ALB_ID}`,
|
||||
albumTracks: getPropertyWithFallback(album, 'nb_tracks', 'NUMBER_TRACK'),
|
||||
isAlbumExplicit,
|
||||
|
||||
/* Artist */
|
||||
artistName: getProperty(album, 'artist.name', 'ART_NAME')
|
||||
artistName: getPropertyWithFallback(album, 'artist.name', 'ART_NAME')
|
||||
}
|
||||
}
|
||||
|
||||
export function formatArtist(artist) {
|
||||
return {
|
||||
/* Artist */
|
||||
artistID: getProperty(artist, 'id', 'ART_ID'),
|
||||
artistName: getProperty(artist, 'name', 'ART_NAME'),
|
||||
artistID: getPropertyWithFallback(artist, 'id', 'ART_ID'),
|
||||
artistName: getPropertyWithFallback(artist, 'name', 'ART_NAME'),
|
||||
artistPictureMedium:
|
||||
getProperty(artist, 'picture_medium') ||
|
||||
getPropertyWithFallback(artist, 'picture_medium') ||
|
||||
`https://e-cdns-images.dzcdn.net/images/artist/${artist.ART_PICTURE}/156x156-000000-80-0-0.jpg`,
|
||||
artistLink: getProperty(artist, 'link') || `https://deezer.com/artist/${artist.ART_ID}`,
|
||||
artistLink: getPropertyWithFallback(artist, 'link') || `https://deezer.com/artist/${artist.ART_ID}`,
|
||||
// TODO Fix
|
||||
artistAlbumsNumber: getProperty(artist, 'nb_album', 'NB_FAN')
|
||||
artistAlbumsNumber: getPropertyWithFallback(artist, 'nb_album', 'NB_FAN')
|
||||
}
|
||||
}
|
||||
|
||||
export function formatPlaylist(playlist) {
|
||||
return {
|
||||
/* Playlist */
|
||||
playlistID: getProperty(playlist, 'id', 'PLAYLIST_ID'),
|
||||
playlistTitle: getProperty(playlist, 'title', 'TITLE'),
|
||||
playlistID: getPropertyWithFallback(playlist, 'id', 'PLAYLIST_ID'),
|
||||
playlistTitle: getPropertyWithFallback(playlist, 'title', 'TITLE'),
|
||||
playlistPictureMedium:
|
||||
getProperty(playlist, 'picture_medium') ||
|
||||
getPropertyWithFallback(playlist, 'picture_medium') ||
|
||||
`https://e-cdns-images.dzcdn.net/images/${playlist.PICTURE_TYPE}/${
|
||||
playlist.PLAYLIST_PICTURE
|
||||
}/156x156-000000-80-0-0.jpg`,
|
||||
playlistLink: getProperty(playlist, 'link') || `https://deezer.com/playlist/${playlist.PLAYLIST_ID}`,
|
||||
playlistTracksNumber: getProperty(playlist, 'nb_tracks', 'NB_SONG'),
|
||||
playlistLink: getPropertyWithFallback(playlist, 'link') || `https://deezer.com/playlist/${playlist.PLAYLIST_ID}`,
|
||||
playlistTracksNumber: getPropertyWithFallback(playlist, 'nb_tracks', 'NB_SONG'),
|
||||
|
||||
/* Artist */
|
||||
artistName: getProperty(playlist, 'user.name')
|
||||
artistName: getPropertyWithFallback(playlist, 'user.name')
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
19
src/data/standardize.js
Normal file
19
src/data/standardize.js
Normal file
@@ -0,0 +1,19 @@
|
||||
export function standardizeData(rawObj, formatFunc) {
|
||||
if (!rawObj.hasLoaded) {
|
||||
return null
|
||||
} else {
|
||||
const { data: rawData } = rawObj
|
||||
const formattedData = []
|
||||
|
||||
for (const dataElement of rawData) {
|
||||
let formatted = formatFunc(dataElement)
|
||||
|
||||
formattedData.push(formatted)
|
||||
}
|
||||
|
||||
return {
|
||||
data: formattedData,
|
||||
hasLoaded: rawObj.hasLoaded
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user