Started implementing track preview
This commit is contained in:
RemixDev
@@ -5,43 +5,43 @@ $('#content').on('scroll', function () {
|
||||
main_selected == 'search_tab' &&
|
||||
['track_search', 'album_search', 'artist_search', 'playlist_search'].indexOf(search_selected) != -1
|
||||
) {
|
||||
scrolledSearch(window[search_selected.split('_')[0] + 'Search'])
|
||||
scrolledSearch(search_selected.split('_')[0])
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
function scrolledSearch(vueTab) {
|
||||
query = vueTab.query
|
||||
if (vueTab.results.next < vueTab.results.total) {
|
||||
function search(type) {
|
||||
query = MainSearch.results.query
|
||||
socket.emit('search', {
|
||||
term: query,
|
||||
type: type,
|
||||
start: MainSearch.results[type+"Tab"].next,
|
||||
nb: 30
|
||||
})
|
||||
}
|
||||
|
||||
function scrolledSearch(type) {
|
||||
query = MainSearch.results.query
|
||||
if (MainSearch.results[type+"Tab"].next < MainSearch.results[type+"Tab"].total) {
|
||||
socket.emit('search', {
|
||||
term: vueTab.query,
|
||||
type: vueTab.type,
|
||||
start: vueTab.results.next,
|
||||
nb: vueTab.nb
|
||||
term: query,
|
||||
type: type,
|
||||
start: MainSearch.results[type+"Tab"].next,
|
||||
nb: 30
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
function searchUpadate(result) {
|
||||
vueTab = null
|
||||
switch (result.type) {
|
||||
case 'TRACK':
|
||||
vueTab = trackSearch
|
||||
break
|
||||
case 'ALBUM':
|
||||
vueTab = albumSearch
|
||||
break
|
||||
case 'ARTIST':
|
||||
vueTab = artistSearch
|
||||
break
|
||||
case 'PLAYLIST':
|
||||
vueTab = playlistSearch
|
||||
break
|
||||
}
|
||||
if (vueTab && vueTab.results.next != result.next) {
|
||||
vueTab.results.next = result.next
|
||||
vueTab.results.data = vueTab.results.data.concat(result.data)
|
||||
let next = 0
|
||||
if (result.next) next = parseInt(result.next.match(/index=(\d*)/)[1])
|
||||
else next = result.total
|
||||
if (MainSearch.results[result.type+"Tab"].total != result.total) MainSearch.results[result.type+"Tab"].total = result.total
|
||||
if (MainSearch.results[result.type+"Tab"].next != next) {
|
||||
MainSearch.results[result.type+"Tab"].next = next
|
||||
MainSearch.results[result.type+"Tab"].data = MainSearch.results[result.type+"Tab"].data.concat(result.data)
|
||||
}
|
||||
MainSearch.results[result.type+"Tab"].loaded = true
|
||||
}
|
||||
socket.on('search', function (result) {
|
||||
searchUpadate(result)
|
||||
@@ -63,24 +63,48 @@ function sendAddToQueue(url, bitrate = null) {
|
||||
}
|
||||
|
||||
let MainSearch = new Vue({
|
||||
el: '#main_search',
|
||||
data() {
|
||||
return {
|
||||
names: {
|
||||
TOP_RESULT: 'Top Result',
|
||||
TRACK: 'Tracks',
|
||||
ARTIST: 'Artists',
|
||||
ALBUM: 'Albums',
|
||||
PLAYLIST: 'Playlists'
|
||||
},
|
||||
results: {
|
||||
QUERY: '',
|
||||
el: '#search_tab',
|
||||
data: {
|
||||
names: {
|
||||
TOP_RESULT: 'Top Result',
|
||||
TRACK: 'Tracks',
|
||||
ARTIST: 'Artists',
|
||||
ALBUM: 'Albums',
|
||||
PLAYLIST: 'Playlists'
|
||||
},
|
||||
results: {
|
||||
query: '',
|
||||
allTab: {
|
||||
ORDER: [],
|
||||
TOP_RESULT: [],
|
||||
ALBUM: {},
|
||||
ARTIST: {},
|
||||
TRACK: {},
|
||||
TOP_RESULT: [],
|
||||
PLAYLIST: {}
|
||||
},
|
||||
trackTab: {
|
||||
data: [],
|
||||
next: 0,
|
||||
total: 0,
|
||||
loaded: false
|
||||
},
|
||||
albumTab: {
|
||||
data: [],
|
||||
next: 0,
|
||||
total: 0,
|
||||
loaded: false
|
||||
},
|
||||
artistTab: {
|
||||
data: [],
|
||||
next: 0,
|
||||
total: 0,
|
||||
loaded: false
|
||||
},
|
||||
playlistTab: {
|
||||
data: [],
|
||||
next: 0,
|
||||
total: 0,
|
||||
loaded: false
|
||||
}
|
||||
}
|
||||
},
|
||||
@@ -93,84 +117,10 @@ let MainSearch = new Vue({
|
||||
}
|
||||
})
|
||||
|
||||
var trackSearch = new Vue({
|
||||
el: '#track_search',
|
||||
data: {
|
||||
type: 'TRACK',
|
||||
nb: 40,
|
||||
query: '',
|
||||
results: {
|
||||
data: [],
|
||||
next: 0,
|
||||
total: 0
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
addToQueue: function(e){e.stopPropagation(); sendAddToQueue(e.currentTarget.dataset.link)},
|
||||
openQualityModal: function(e){e.preventDefault(); openQualityModal(e.currentTarget.dataset.link)}
|
||||
}
|
||||
})
|
||||
|
||||
var albumSearch = new Vue({
|
||||
el: '#album_search',
|
||||
data: {
|
||||
type: 'ALBUM',
|
||||
nb: 20,
|
||||
query: '',
|
||||
results: {
|
||||
data: [],
|
||||
next: 0,
|
||||
total: 0
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
addToQueue: function(e){e.stopPropagation(); sendAddToQueue(e.currentTarget.dataset.link)},
|
||||
openQualityModal: function(e){e.preventDefault(); openQualityModal(e.currentTarget.dataset.link)}
|
||||
}
|
||||
})
|
||||
|
||||
var artistSearch = new Vue({
|
||||
el: '#artist_search',
|
||||
data: {
|
||||
type: 'ARTIST',
|
||||
nb: 20,
|
||||
query: '',
|
||||
results: {
|
||||
data: [],
|
||||
next: 0,
|
||||
total: 0
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
addToQueue: function(e){e.stopPropagation(); sendAddToQueue(e.currentTarget.dataset.link)},
|
||||
openQualityModal: function(e){e.preventDefault(); openQualityModal(e.currentTarget.dataset.link)}
|
||||
}
|
||||
})
|
||||
|
||||
var playlistSearch = new Vue({
|
||||
el: '#playlist_search',
|
||||
data: {
|
||||
type: 'PLAYLIST',
|
||||
nb: 20,
|
||||
query: '',
|
||||
results: {
|
||||
data: [],
|
||||
next: 0,
|
||||
total: 0
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
addToQueue: function(e){e.stopPropagation(); sendAddToQueue(e.currentTarget.dataset.link)},
|
||||
openQualityModal: function(e){e.preventDefault(); openQualityModal(e.currentTarget.dataset.link)}
|
||||
}
|
||||
})
|
||||
|
||||
let term = null
|
||||
|
||||
// Search section
|
||||
$("#searchbar").keyup(function(e){
|
||||
if(e.keyCode == 13){
|
||||
term = this.value
|
||||
let term = this.value
|
||||
if (isValidURL(term)){
|
||||
if (e.ctrlKey){
|
||||
openQualityModal(term);
|
||||
@@ -178,7 +128,7 @@ $("#searchbar").keyup(function(e){
|
||||
sendAddToQueue(term);
|
||||
}
|
||||
}else{
|
||||
if (term != MainSearch.results.QUERY || main_selected == 'search_tab'){
|
||||
if (term != MainSearch.query || main_selected == 'search_tab'){
|
||||
document.getElementById("search_tab_content").style.display = "none";
|
||||
socket.emit("mainSearch", {term: term});
|
||||
}else{
|
||||
@@ -191,15 +141,13 @@ $("#searchbar").keyup(function(e){
|
||||
})
|
||||
|
||||
function mainSearchHandler(result) {
|
||||
MainSearch.results = result
|
||||
trackSearch.results = result.TRACK
|
||||
albumSearch.results = result.ALBUM
|
||||
artistSearch.results = result.ARTIST
|
||||
playlistSearch.results = result.PLAYLIST
|
||||
trackSearch.query = result.QUERY
|
||||
albumSearch.query = result.QUERY
|
||||
artistSearch.query = result.QUERY
|
||||
playlistSearch.query = result.QUERY
|
||||
let resetObj = {data: [], next: 0, total: 0, loaded: false}
|
||||
MainSearch.results.allTab = result
|
||||
MainSearch.results.query = result.QUERY
|
||||
MainSearch.results.trackTab = {...resetObj}
|
||||
MainSearch.results.albumTab = {...resetObj}
|
||||
MainSearch.results.artistTab = {...resetObj}
|
||||
MainSearch.results.playlistTab = {...resetObj}
|
||||
document.getElementById('search_all_tab').click()
|
||||
document.getElementById('search_tab_content').style.display = 'block'
|
||||
document.getElementById('main_search_tablink').click()
|
||||
|
||||
@@ -28,11 +28,11 @@ function changeTab(evt, section, tabName) {
|
||||
|
||||
// Check if you need to load more content in the search tab
|
||||
if (
|
||||
document.getElementById('content').offsetHeight >= document.getElementById('content').scrollHeight &&
|
||||
main_selected == 'search_tab' &&
|
||||
['track_search', 'album_search', 'artist_search', 'playlist_search'].indexOf(search_selected) != -1
|
||||
['track_search', 'album_search', 'artist_search', 'playlist_search'].indexOf(search_selected) != -1 &&
|
||||
MainSearch.results[search_selected.split('_')[0]+"Tab"].data.length == 0
|
||||
) {
|
||||
scrolledSearch(window[search_selected.split('_')[0] + 'Search'])
|
||||
search(search_selected.split('_')[0])
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user