finished using destructuring synthax when useful

This commit is contained in:
Roberto Tonino 2020-06-02 16:40:12 +02:00
parent 791e218154
commit e59ff93b1d
8 changed files with 141 additions and 100 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -3,8 +3,8 @@ import { socket } from '../socket.js'
import { showView } from '../tabs.js'
import Downloads from '../downloads.js'
import QualityModal from '../quality-modal.js'
import TrackPreview from '../track-preview.js'
import Utils from '../utils.js'
// import TrackPreview from '../track-preview.js'
// import Utils from '../utils.js'
const HomeTab = new Vue({
data() {
@ -21,15 +21,19 @@ const HomeTab = new Vue({
document.getElementById('main_settings_tablink').click()
},
addToQueue(e) {
e.stopPropagation()
Downloads.sendAddToQueue(e.currentTarget.dataset.link)
},
openQualityModal(e) {
QualityModal.open(e.currentTarget.dataset.link)
},
initHome(data) {
this.playlists = data.playlists.data
this.albums = data.albums.data
const {
playlists: { data: playlistData },
albums: { data: albumData }
} = data
this.playlists = playlistData
this.albums = albumData
}
},
mounted() {

View File

@ -29,26 +29,36 @@ const LinkAnalyzerTab = new Vue({
this.countries = []
},
showTrack(data) {
this.title =
data.title +
(data.title_version && data.title.indexOf(data.title_version) == -1 ? ' ' + data.title_version : '')
this.image = data.album.cover_xl
const {
title,
title_version,
album: { cover_xl },
link,
available_countries
} = data
this.title = title + (title_version && title.indexOf(title_version) == -1 ? ' ' + title_version : '')
this.image = cover_xl
this.type = 'track'
this.link = data.link
data.available_countries.forEach(cc => {
this.link = link
available_countries.forEach(cc => {
let temp = []
let chars = [...cc].map(c => c.charCodeAt() + 127397)
temp.push(String.fromCodePoint(...chars))
temp.push(Utils.COUNTRIES[cc])
this.countries.push(temp)
})
this.data = data
},
showAlbum(data) {
this.title = data.title
this.image = data.cover_xl
const { title, cover_xl, link } = data
this.title = title
this.image = cover_xl
this.type = 'album'
this.link = data.link
this.link = link
this.data = data
}
},

View File

@ -77,9 +77,30 @@ const MainSearch = new Vue({
}
},
changeSearchTab(section) {
if (section != 'TOP_RESULT') {
document.getElementById(`search_${section.toLowerCase()}_tab`).click()
if (section === 'TOP_RESULT') return
let tabID
// Using the switch beacuse it's tricky to find refernces of the belo IDs
switch (section) {
case 'TRACK':
tabID = 'search_track_tab'
break
case 'ALBUM':
tabID = 'search_album_tab'
break
case 'ARTIST':
tabID = 'search_artist_tab'
break
case 'PLAYLIST':
tabID = 'search_playlist_tab'
break
default:
break
}
document.getElementById(tabID).click()
},
addToQueue(e) {
Downloads.sendAddToQueue(e.currentTarget.dataset.link)
@ -98,45 +119,54 @@ const MainSearch = new Vue({
})
},
scrolledSearch(type) {
if (this.results[type + 'Tab'].next < this.results[type + 'Tab'].total) {
let currentTab = type + 'Tab'
if (this.results[currentTab].next < this.results[currentTab].total) {
socket.emit('search', {
term: this.results.query,
type: type,
start: this.results[type + 'Tab'].next,
start: this.results[currentTab].next,
nb: 30
})
}
},
handleMainSearch(result) {
let resetObj = { data: [], next: 0, total: 0, loaded: false }
this.results.allTab = result
this.results.trackTab = { ...resetObj }
this.results.albumTab = { ...resetObj }
this.results.artistTab = { ...resetObj }
this.results.playlistTab = { ...resetObj }
if (this.results.query == '') document.getElementById('search_all_tab').click()
this.results.query = result.QUERY
document.getElementById('search_tab_content').style.display = 'block'
document.getElementById('main_search_tablink').click()
},
handleSearch(result) {
const { next: nextResult, total, type, data } = result
let currentTab = type + 'Tab'
let next = 0
if (result.next) {
next = parseInt(result.next.match(/index=(\d*)/)[1])
if (nextResult) {
next = parseInt(nextResult.match(/index=(\d*)/)[1])
} else {
next = result.total
next = total
}
if (this.results[result.type + 'Tab'].total != result.total) {
this.results[result.type + 'Tab'].total = result.total
if (this.results[currentTab].total != total) {
this.results[currentTab].total = total
}
if (this.results[result.type + 'Tab'].next != next) {
this.results[result.type + 'Tab'].next = next
this.results[result.type + 'Tab'].data = this.results[result.type + 'Tab'].data.concat(result.data)
if (this.results[currentTab].next != next) {
this.results[currentTab].next = next
this.results[currentTab].data = this.results[currentTab].data.concat(data)
}
this.results[result.type + 'Tab'].loaded = true
this.results[currentTab].loaded = true
}
},
mounted() {

View File

@ -40,7 +40,7 @@ const SettingsTab = new Vue({
toast('ARL copied to clipboard', 'assignment')
},
updateMaxVolume(){
updateMaxVolume() {
localStorage.setItem('previewVolume', this.previewVolume.preview_max_volume)
},
saveSettings() {
@ -72,17 +72,17 @@ const SettingsTab = new Vue({
socket.emit('login', arl, true, this.accountNum)
}
},
changeAccount(){
changeAccount() {
socket.emit('changeAccount', this.accountNum)
},
accountChanged(user, accountNum){
accountChanged(user, accountNum) {
this.$refs.username.innerText = user.name
this.$refs.userpicture.src = `https://e-cdns-images.dzcdn.net/images/user/${user.picture}/125x125-000000-80-0-0.jpg`
this.accountNum = accountNum
localStorage.setItem('accountNum', this.accountNum)
},
initAccounts(accounts){
this.accounts = accounts;
initAccounts(accounts) {
this.accounts = accounts
},
logout() {
socket.emit('logout')
@ -120,13 +120,12 @@ const SettingsTab = new Vue({
this.changeSlimDownloads = 'true' === localStorage.getItem('slimDownloads')
let volume = parseInt(localStorage.getItem('previewVolume'))
if (isNaN(volume)){
if (isNaN(volume)) {
volume = 80
localStorage.setItem('previewVolume', volume)
}
window.vol.preview_max_volume = volume
socket.on('init_settings', this.initSettings)
socket.on('updateSettings', this.updateSettings)
socket.on('accountChanged', this.accountChanged)

View File

@ -5,6 +5,7 @@ import { showView } from '../tabs.js'
import Downloads from '../downloads.js'
import QualityModal from '../quality-modal.js'
import TrackPreview from '../track-preview.js'
import Utils from '../utils.js'
const TracklistTab = new Vue({
data: () => ({
@ -16,7 +17,6 @@ const TracklistTab = new Vue({
image: '',
type: '',
link: '',
head: null,
body: []
}),
methods: {
@ -31,11 +31,9 @@ const TracklistTab = new Vue({
this.release_date = ''
this.explicit = false
this.type = ''
this.head = []
this.body = []
},
addToQueue(e) {
e.stopPropagation()
Downloads.sendAddToQueue(e.currentTarget.dataset.link)
},
openQualityModal(e) {
@ -58,83 +56,83 @@ const TracklistTab = new Vue({
}
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
},
convertDuration: Utils.convertDuration,
showAlbum(data) {
this.type = 'Album'
this.link = `https://www.deezer.com/album/${data.id}`
this.title = data.title
this.explicit = data.explicit_lyrics
this.label = data.label
this.metadata = `${data.artist.name}${data.tracks.length} songs`
this.release_date = data.release_date.substring(0, 10)
this.image = data.cover_xl
this.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' }
]
const {
id: albumID,
title: albumTitle,
explicit_lyrics,
label: albumLabel,
artist: { name: artistName },
tracks: albumTracks,
tracks: { length: numberOfTracks },
release_date,
cover_xl
} = data
if (_.isEmpty(data.tracks)) {
this.type = 'Album'
this.link = `https://www.deezer.com/album/${albumID}`
this.title = albumTitle
this.explicit = explicit_lyrics
this.label = albumLabel
this.metadata = `${artistName}${numberOfTracks} songs`
this.release_date = release_date.substring(0, 10)
this.image = cover_xl
if (_.isEmpty(albumTracks)) {
this.body = null
} else {
this.body = data.tracks
this.body = albumTracks
}
},
showPlaylist(data) {
this.type = 'Playlist'
this.link = `https://www.deezer.com/playlist/${data.id}`
this.title = data.title
this.image = data.picture_xl
this.release_date = data.creation_date.substring(0, 10)
this.metadata = `by ${data.creator.name}${data.tracks.length} songs`
this.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' }
]
const {
id: playlistID,
title: playlistTitle,
picture_xl: playlistCover,
creation_date,
creator: { name: creatorName },
tracks: playlistTracks,
tracks: { length: numberOfTracks }
} = data
if (_.isEmpty(data.tracks)) {
this.type = 'Playlist'
this.link = `https://www.deezer.com/playlist/${playlistID}`
this.title = playlistTitle
this.image = playlistCover
this.release_date = creation_date.substring(0, 10)
this.metadata = `by ${creatorName}${numberOfTracks} songs`
if (_.isEmpty(playlistTracks)) {
this.body = null
} else {
this.body = data.tracks
this.body = playlistTracks
}
},
showSpotifyPlaylist(data) {
const {
uri: playlistURI,
name: playlistName,
images,
images: { length: numberOfImages },
owner: { display_name: ownerName },
tracks: playlistTracks,
tracks: { length: numberOfTracks }
} = data
this.type = 'Spotify Playlist'
this.link = data.uri
this.title = data.name
this.image = data.images.length
? data.images[0].url
this.link = playlistURI
this.title = playlistName
this.image = numberOfImages
? images[0].url
: 'https://e-cdns-images.dzcdn.net/images/cover/d41d8cd98f00b204e9800998ecf8427e/1000x1000-000000-80-0-0.jpg'
this.release_date = ''
this.metadata = `by ${data.owner.display_name}${data.tracks.length} songs`
this.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)) {
this.metadata = `by ${ownerName}${numberOfTracks} songs`
if (_.isEmpty(playlistTracks)) {
this.body = null
} else {
this.body = data.tracks
this.body = playlistTracks
}
}
},

View File

@ -12,11 +12,11 @@ function isValidURL(text) {
}
function convertDuration(duration) {
// convert from seconds only to mm:ss format
// 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
// Add leading zero if ss < 0
if (ss < 10) {
ss = '0' + ss
}