112 lines
2.8 KiB
JavaScript
112 lines
2.8 KiB
JavaScript
|
import { socket } from './socket.js'
|
||
|
|
|
||
|
|
export const TracklistTab = new Vue({
|
||
|
|
el: '#tracklist_tab',
|
||
|
|
data: {
|
||
|
|
title: '',
|
||
|
|
metadata: '',
|
||
|
|
release_date: '',
|
||
|
|
label: '',
|
||
|
|
explicit: false,
|
||
|
|
image: '',
|
||
|
|
type: '',
|
||
|
|
link: '',
|
||
|
|
head: null,
|
||
|
|
body: []
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
addToQueue: function (e) {
|
||
|
|
e.stopPropagation()
|
||
|
|
sendAddToQueue(e.currentTarget.dataset.link)
|
||
|
|
},
|
||
|
|
openQualityModal: function (e) {
|
||
|
|
e.preventDefault()
|
||
|
|
openQualityModal(e.currentTarget.dataset.link)
|
||
|
|
},
|
||
|
|
toggleAll: function (e) {
|
||
|
|
this.body.forEach(item => {
|
||
|
|
if (item.type == 'track') {
|
||
|
|
item.selected = e.currentTarget.checked
|
||
|
|
}
|
||
|
|
})
|
||
|
|
},
|
||
|
|
selectedLinks: function () {
|
||
|
|
var selected = []
|
||
|
|
if (this.body) {
|
||
|
|
this.body.forEach(item => {
|
||
|
|
if (item.type == 'track' && item.selected) selected.push(item.link)
|
||
|
|
})
|
||
|
|
}
|
||
|
|
return selected.join(';')
|
||
|
|
},
|
||
|
|
convertDuration(duration) {
|
||
|
|
//convert from seconds only to mm:ss format
|
||
|
|
let mm, ss
|
||
|
|
mm = Math.floor(duration / 60)
|
||
|
|
ss = duration - mm * 60
|
||
|
|
//add leading zero if ss < 0
|
||
|
|
if (ss < 10) {
|
||
|
|
ss = '0' + ss
|
||
|
|
}
|
||
|
|
return mm + ':' + ss
|
||
|
|
}
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
export function resetTracklistTab() {
|
||
|
|
TracklistTab.title = 'Loading...'
|
||
|
|
TracklistTab.image = ''
|
||
|
|
TracklistTab.metadata = ''
|
||
|
|
TracklistTab.label = ''
|
||
|
|
TracklistTab.release_date = ''
|
||
|
|
TracklistTab.explicit = false
|
||
|
|
TracklistTab.type = ''
|
||
|
|
TracklistTab.head = []
|
||
|
|
TracklistTab.body = []
|
||
|
|
}
|
||
|
|
|
||
|
|
socket.on('show_album', data => {
|
||
|
|
TracklistTab.type = 'Album'
|
||
|
|
TracklistTab.link = `https://www.deezer.com/album/${data.id}`
|
||
|
|
TracklistTab.title = data.title
|
||
|
|
TracklistTab.explicit = data.explicit_lyrics
|
||
|
|
TracklistTab.label = data.label
|
||
|
|
TracklistTab.metadata = `${data.artist.name} • ${data.tracks.length} songs`
|
||
|
|
TracklistTab.release_date = data.release_date.substring(0, 10)
|
||
|
|
TracklistTab.image = data.cover_xl
|
||
|
|
TracklistTab.head = [
|
||
|
|
{ title: '<i class="material-icons">music_note</i>', width: '24px' },
|
||
|
|
{ title: '#' },
|
||
|
|
{ title: 'Song' },
|
||
|
|
{ title: 'Artist' },
|
||
|
|
{ title: '<i class="material-icons">timer</i>', width: '40px' }
|
||
|
|
]
|
||
|
|
if (_.isEmpty(data.tracks)) {
|
||
|
|
TracklistTab.body = null
|
||
|
|
} else {
|
||
|
|
TracklistTab.body = data.tracks
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
socket.on('show_playlist', data => {
|
||
|
|
TracklistTab.type = 'Playlist'
|
||
|
|
TracklistTab.link = `https://www.deezer.com/playlist/${data.id}`
|
||
|
|
TracklistTab.title = data.title
|
||
|
|
TracklistTab.image = data.picture_xl
|
||
|
|
TracklistTab.release_date = data.creation_date.substring(0, 10)
|
||
|
|
TracklistTab.metadata = `by ${data.creator.name} • ${data.tracks.length} songs`
|
||
|
|
TracklistTab.head = [
|
||
|
|
{ title: '<i class="material-icons">music_note</i>', width: '24px' },
|
||
|
|
{ title: '#' },
|
||
|
|
{ title: 'Song' },
|
||
|
|
{ title: 'Artist' },
|
||
|
|
{ title: 'Album' },
|
||
|
|
{ title: '<i class="material-icons">timer</i>', width: '40px' }
|
||
|
|
]
|
||
|
|
if (_.isEmpty(data.tracks)) {
|
||
|
|
TracklistTab.body = null
|
||
|
|
} else {
|
||
|
|
TracklistTab.body = data.tracks
|
||
|
|
}
|
||
|
|
})
|