var artistTab = new Vue({ el: '#artist_tab', data: { currentTab: '', sortKey: 'release_date', sortOrder: 'desc', title: "", image: "", type: "", link: "", head: null, body: null }, methods: { addToQueue: function(e){e.stopPropagation(); sendAddToQueue(e.currentTarget.dataset.link)}, openQualityModal: function(e){e.preventDefault(); openQualityModal(e.currentTarget.dataset.link)}, moreInfo: function(url, e){ if (e) e.preventDefault(); showTrackListSelective(url, true) }, sortBy: function(key) { if (key == this.sortKey) { this.sortOrder = (this.sortOrder == 'asc') ? 'desc' : 'asc'; } else { this.sortKey = key; this.sortOrder = 'asc'; } }, changeTab: function(tab){ this.currentTab = tab }, checkNewRelease: function(date){ var g1 = new Date(); var g2 = new Date(date); g2.setDate(g2.getDate()+3) g1.setHours(0,0,0,0) if (g1.getTime() <= g2.getTime()){ return true; }else { return false; } } }, computed: { showTable() { if (this.body) return _.orderBy(this.body[this.currentTab], this.sortKey, this.sortOrder) else return [] } } }) var 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){ tracklistTab.body.forEach((item) => { if (item.type == 'track'){ item.selected = e.currentTarget.checked } }); } } }) function artistView(ev){ console.log("ARTIST") let id = ev.currentTarget.dataset.id artistTab.title = "Loading..." artistTab.image = "" artistTab.type = "" artistTab.currentTab = '' artistTab.sortKey = 'release_date' artistTab.sortOrder = 'desc' artistTab.link = 'https://deezer.com/artist/'+id artistTab.head = [] artistTab.body = null socket.emit('getTracklist', {type: 'artist', id: id}) showTab('artist', id) } function albumView(ev){ console.log("ALBUM") tracklistTab.title = "Loading..." tracklistTab.image = "" tracklistTab.metadata = "" tracklistTab.label = "" tracklistTab.release_date = "" tracklistTab.explicit = false tracklistTab.type = "" tracklistTab.head = [] tracklistTab.body = [] let id = ev.currentTarget.dataset.id socket.emit('getTracklist', {type: 'album', id: id}) showTab('album', id) } function playlistView(ev){ console.log("PLAYLIST") tracklistTab.title = "Loading..." tracklistTab.image = "" tracklistTab.metadata = "" tracklistTab.label = "" tracklistTab.release_date = "" tracklistTab.explicit = false tracklistTab.type = "" tracklistTab.head = [] tracklistTab.body = [] let id = ev.currentTarget.dataset.id socket.emit('getTracklist', {type: 'playlist', id: id}) showTab('playlist', id) } socket.on('show_artist', function(data){ artistTab.title = data.name artistTab.image = data.picture_xl artistTab.type = "Artist" artistTab.link = `https://www.deezer.com/artist/${data.id}` artistTab.currentTab = Object.keys(data.releases)[0] artistTab.sortKey = 'release_date' artistTab.sortOrder = 'desc' artistTab.head = [ {title: 'Title', sortKey: "title"}, {title: 'Release Date', sortKey: "release_date"}, {title: '', width: "56px"} ] if (_.isEmpty(data.releases)){ artistTab.body = null }else{ artistTab.body = data.releases } }) socket.on('show_album', function(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 console.log(data.tracks) tracklistTab.head = [ {title: 'music_note', width: "24px"}, {title: '#'}, {title: 'Song'}, {title: 'Artist'}, {title: 'timer', width: "40px"}, {title: '', width: "24px"} ] if (_.isEmpty(data.tracks)){ tracklistTab.body = null }else{ tracklistTab.body = data.tracks } })