diff --git a/public/index.html b/public/index.html index b2237c3..e05cb82 100644 --- a/public/index.html +++ b/public/index.html @@ -33,136 +33,8 @@
- -
-
- - - - - -
-
- - - - - - - - - - -
-
+ +

Home

@@ -464,7 +336,7 @@ - + diff --git a/public/js/app/components/TheSearchTab.vue b/public/js/app/components/TheSearchTab.vue index 09f74dc..24e006c 100644 --- a/public/js/app/components/TheSearchTab.vue +++ b/public/js/app/components/TheSearchTab.vue @@ -1,44 +1,56 @@ diff --git a/public/js/app/components/search-tab/TheAlbumSearch.vue b/public/js/app/components/search-tab/TheAlbumSearch.vue new file mode 100644 index 0000000..fbaf76c --- /dev/null +++ b/public/js/app/components/search-tab/TheAlbumSearch.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/public/js/app/components/search-tab/TheArtistSearch.vue b/public/js/app/components/search-tab/TheArtistSearch.vue new file mode 100644 index 0000000..182ca60 --- /dev/null +++ b/public/js/app/components/search-tab/TheArtistSearch.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/public/js/app/components/search-tab/TheMainSearch.vue b/public/js/app/components/search-tab/TheMainSearch.vue index 099d80e..751c7c1 100644 --- a/public/js/app/components/search-tab/TheMainSearch.vue +++ b/public/js/app/components/search-tab/TheMainSearch.vue @@ -1,44 +1,38 @@ @@ -113,7 +110,13 @@ module.exports = { TOP_RESULT: [], PLAYLIST: {} }, - topResultURL: '' + topResult: { + imgURL: '', + buttonURL: '', + primaryText: '', + secondaryText: '', + tag: '' + } }), methods: { changeSearchTab(section) { @@ -129,7 +132,7 @@ module.exports = { handleMainSearch(result) { this.results = result }, - formatNames(name) { + toTitleCase(name) { if ('string' !== typeof name) { return } @@ -151,50 +154,119 @@ module.exports = { return name }, - getTopResultURL(result) { - if (result.TOP_RESULT.length === 0) { - this.topResultURL = '' + getTopResultImgURL(results) { + if (results.TOP_RESULT.length === 0) { + this.topResult.imgURL = '' return } - let topResultType = result.TOP_RESULT[0].__TYPE__ + const topResult = results.TOP_RESULT[0] + const topResultType = topResult.__TYPE__ switch (topResultType) { case 'artist': - this.topResultURL = 'https://e-cdns-images.dzcdn.net/images/artist/' + result.TOP_RESULT[0].ART_PICTURE + this.topResult.imgURL = 'https://e-cdns-images.dzcdn.net/images/artist/' + topResult.ART_PICTURE break case 'album': - this.topResultURL = 'https://e-cdns-images.dzcdn.net/images/cover/' + result.TOP_RESULT[0].ALB_PICTURE + this.topResult.imgURL = 'https://e-cdns-images.dzcdn.net/images/cover/' + topResult.ALB_PICTURE break case 'playlist': - this.topResultURL = - 'https://e-cdns-images.dzcdn.net/images/' + - result.TOP_RESULT[0].PICTURE_TYPE + - '/' + - result.TOP_RESULT[0].PLAYLIST_PICTURE + this.topResult.imgURL = + 'https://e-cdns-images.dzcdn.net/images/' + topResult.PICTURE_TYPE + '/' + topResult.PLAYLIST_PICTURE break default: - this.topResultURL = 'https://e-cdns-images.dzcdn.net/images/cover/' + this.topResult.imgURL = 'https://e-cdns-images.dzcdn.net/images/cover/' break } - this.topResultURL += '/156x156-000000-80-0-0.jpg' + this.topResult.imgURL += '/156x156-000000-80-0-0.jpg' + }, + getTopResultImgURL2(topRes) { + if (topRes.length === 0) { + return '' + } - // Testing purposes - let idem = - (result.TOP_RESULT[0].__TYPE__ == 'artist' - ? 'https://e-cdns-images.dzcdn.net/images/artist/' + result.TOP_RESULT[0].ART_PICTURE - : result.TOP_RESULT[0].__TYPE__ == 'album' - ? 'https://e-cdns-images.dzcdn.net/images/cover/' + result.TOP_RESULT[0].ALB_PICTURE - : result.TOP_RESULT[0].__TYPE__ == 'playlist' - ? 'https://e-cdns-images.dzcdn.net/images/' + - result.TOP_RESULT[0].PICTURE_TYPE + - '/' + - result.TOP_RESULT[0].PLAYLIST_PICTURE - : 'https://e-cdns-images.dzcdn.net/images/cover/') + '/156x156-000000-80-0-0.jpg' + const topResult = topRes[0] + const topResultType = topResult.__TYPE__ + let imgURL = '' - console.log(this.topResultURL) - console.log(idem) + switch (topResultType) { + case 'artist': + imgURL = 'https://e-cdns-images.dzcdn.net/images/artist/' + topResult.ART_PICTURE + break + case 'album': + imgURL = 'https://e-cdns-images.dzcdn.net/images/cover/' + topResult.ALB_PICTURE + break + case 'playlist': + imgURL = + 'https://e-cdns-images.dzcdn.net/images/' + topResult.PICTURE_TYPE + '/' + topResult.PLAYLIST_PICTURE + break + default: + imgURL = 'https://e-cdns-images.dzcdn.net/images/cover/' + break + } + + imgURL += '/156x156-000000-80-0-0.jpg' + + return imgURL + }, + getTopResultButtonURL(results) { + if (results.TOP_RESULT.length === 0) { + this.topResult.buttonURL = '' + return + } + + const topResult = results.TOP_RESULT[0] + const topResultType = topResult.__TYPE__ + + this.topResult.buttonURL = 'https://deezer.com/' + topResultType + '/' + + switch (topResultType) { + case 'artist': + this.topResult.buttonURL += topResult.ART_ID + break + case 'album': + this.topResult.buttonURL += topResult.ALB_ID + break + case 'playlist': + this.topResult.buttonURL += topResult.PLAYLIST_ID + break + default: + this.topResult.buttonURL += '' + break + } + }, + getTopResultText(results) { + if (results.TOP_RESULT.length === 0) { + this.topResult.primaryText = '' + this.topResult.secondaryText = '' + this.topResult.tag = '' + return + } + + const topResult = results.TOP_RESULT[0] + const topResultType = topResult.__TYPE__ + + this.topResult.tag = this.toTitleCase(topResultType) + + switch (topResultType) { + case 'artist': + this.topResult.primaryText = topResult.ART_NAME + this.topResult.secondaryText = numberWithDots(topResult.NB_FAN) + ' fans' + break + case 'album': + this.topResult.primaryText = topResult.ALB_TITLE + this.topResult.secondaryText = 'by ' + topResult.ART_NAME + ' - ' + topResult.NUMBER_TRACK + ' tracks' + break + case 'playlist': + this.topResult.primaryText = topResult.TITLE + this.topResult.secondaryText = 'by ' + topResult.PARENT_USERNAME + ' - ' + topResult.NB_SONG + ' tracks' + break + default: + this.topResult.primaryText = '' + this.topResult.secondaryText = '' + break + } } }, watch: { @@ -202,7 +274,9 @@ module.exports = { console.log('new', newRes) console.log('old', oldRes) - this.getTopResultURL(newRes) + this.getTopResultImgURL(newRes) + this.getTopResultButtonURL(newRes) + this.getTopResultText(newRes) } }, mounted() { @@ -212,4 +286,7 @@ module.exports = { \ No newline at end of file diff --git a/public/js/app/components/search-tab/ThePlaylistSearch.vue b/public/js/app/components/search-tab/ThePlaylistSearch.vue new file mode 100644 index 0000000..d722eba --- /dev/null +++ b/public/js/app/components/search-tab/ThePlaylistSearch.vue @@ -0,0 +1,64 @@ + + + + + \ No newline at end of file diff --git a/public/js/app/components/search-tab/TheTrackSearch.vue b/public/js/app/components/search-tab/TheTrackSearch.vue new file mode 100644 index 0000000..9f57e43 --- /dev/null +++ b/public/js/app/components/search-tab/TheTrackSearch.vue @@ -0,0 +1,79 @@ + + + + + \ No newline at end of file diff --git a/public/js/app/tabs.js b/public/js/app/tabs.js index af1e453..f5504a8 100644 --- a/public/js/app/tabs.js +++ b/public/js/app/tabs.js @@ -19,6 +19,8 @@ function changeTab(evt, section, tabName) { if (tabName == 'settings_tab' && main_selected != 'settings_tab') { settingsTab.settings = { ...lastSettings } } + console.log( {tabName} ); + document.getElementById(tabName).style.display = 'block' window[section + '_selected'] = tabName evt.currentTarget.className += ' active'