Xefir/nextcloud-app-radio
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

implementing categories

Browse Source
This commit is contained in:
Jonas Heinrich 2020-11-21 23:06:42 +01:00
parent 290d3581dc
commit d5038611e2
3 changed files with 91 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

110
src/components/Main.vue
View File

@ -63,6 +63,7 @@ export default {
favorites: [],
showSidebar: false,
sidebarStation: {},
queryParams: {},
}),
computed: {
player() {
@ -223,7 +224,6 @@ export default {
html5: true,
volume: vm.player.volume,
onplay() {
console.log('onplay')
vm.$store.dispatch('isPlaying', true)
vm.$store.dispatch('isBuffering', false)
},
@ -284,36 +284,63 @@ export default {
let sortBy = 'clickcount'
if (vm.$route.name === 'CATEGORIES') {
vm.tableData = [
{
name: t('radio', 'Countries'),
type: 'folder',
path: '#/categories/countries',
},
{
name: t('radio', 'States'),
type: 'folder',
path: '#/categories/states',
},
{
name: t('radio', 'Languages'),
type: 'folder',
path: '#/categories/languages',
},
{
name: t('radio', 'Tags'),
type: 'folder',
path: '#/categories/tags',
},
]
vm.pageLoading = false
return true
if (vm.$route.path === '/categories') {
vm.tableData = [
{
name: t('radio', 'Countries'),
type: 'folder',
path: '/categories/countries',
},
{
name: t('radio', 'States'),
type: 'folder',
path: '/categories/states',
},
{
name: t('radio', 'Languages'),
type: 'folder',
path: '/categories/languages',
},
{
name: t('radio', 'Tags'),
type: 'folder',
path: '/categories/tags',
},
]
vm.pageLoading = false
return true
} else if (vm.$route.params.category === 'tags') {
if (vm.$route.params.query) {
queryURI = this.$apiUrl + '/json/stations/search?tag=' + vm.$route.params.query + '&tagExact=true'
} else {
queryURI = this.$apiUrl + '/json/tags'
}
} else if (vm.$route.params.category === 'countries') {
if (vm.$route.params.query) {
queryURI = this.$apiUrl + '/json/stations/search?country=' + vm.$route.params.query + '&countryExact=true'
} else {
queryURI = this.$apiUrl + '/json/countries'
}
} else if (vm.$route.params.category === 'states') {
if (vm.$route.params.query) {
queryURI = this.$apiUrl + '/json/stations/search?state=' + vm.$route.params.query + '&stateExact=true'
} else {
queryURI = this.$apiUrl + '/json/states'
}
} else if (vm.$route.params.category === 'languages') {
if (vm.$route.params.query) {
queryURI = this.$apiUrl + '/json/stations/search?language=' + vm.$route.params.query + '&languageExact=true'
} else {
queryURI = this.$apiUrl + '/json/languages'
}
}
}
// Skip loading more stations on certain sites
if (vm.tableData.length > 0
&& (vm.$route.name === 'FAVORITES'
|| vm.$route.name === 'RECENT')) {
|| vm.$route.name === 'RECENT'
|| vm.$route.name === 'CATEGORIES')) {
return true
}
@ -330,23 +357,34 @@ export default {
queryURI = generateUrl('/apps/radio/api/recent')
}
if (menuState !== 'CATEGORIES') {
vm.queryParams = {
limit: 20,
order: sortBy,
reverse: true,
offset: vm.tableData.length,
}
} else {
vm.queryParams = {}
}
try {
await axios.get(queryURI, {
params: {
limit: 20,
order: sortBy,
reverse: true,
offset: vm.tableData.length,
},
params: vm.queryParams,
})
.then(function(response) {
for (let i = 0; i < response.data.length; i++) {
const obj = response.data[i]
let blurHash = vm.blurHashes[obj.stationuuid]
if (!blurHash) {
blurHash = 'L1TSUA?bj[?b~qfQfQj[ayfQfQfQ'
if (obj.stationuuid) {
let blurHash = vm.blurHashes[obj.stationuuid]
if (!blurHash) {
blurHash = 'L1TSUA?bj[?b~qfQfQj[ayfQfQfQ'
}
response.data[i].blurHash = blurHash
} else {
response.data[i].type = 'folder'
response.data[i].path = vm.$route.path + '/' + obj.name
}
response.data[i].blurHash = blurHash
}
vm.tableData = vm.tableData.concat(response.data)
vm.pageLoading = false

19
src/components/Table.vue
View File

@ -10,7 +10,7 @@
</tr>
</thead>
<tbody>
<template v-if="stationData[0].type!=='folder'">
<template v-if="!isFolder">
<tr
v-for="(station, idx) in stationData"
:key="idx"
@ -55,11 +55,11 @@
</td>
</tr>
</template>
<template v-if="stationData[0].type==='folder'">
<template v-if="isFolder">
<tr
v-for="(station, idx) in stationData"
:key="idx"
@click="doPlay(idx, station)">
@click="changeRoute(station.path)">
<td>
<span class="icon-folder" />
</td>
@ -98,6 +98,16 @@ export default {
data: () => ({
activeItem: null,
}),
computed: {
isFolder() {
if (this.stationData[0]) {
if (this.stationData[0].type === 'folder') {
return true
}
}
return false
},
},
methods: {
doPlay(idx, station) {
this.activeItem = idx
@ -109,6 +119,9 @@ export default {
toggleSidebar(station) {
this.$emit('toggleSidebar', station)
},
changeRoute(path) {
this.$router.push({ path })
},
},
}
</script>

2
src/router.js
View File

@ -33,7 +33,7 @@ const router = new Router({
name: 'FAVORITES',
},
{
path: '/categories',
path: '/categories/:category?/:query?',
component: Main,
name: 'CATEGORIES',
},