diff --git a/web-src/src/components/ListAlbums.vue b/web-src/src/components/ListAlbums.vue index 18cacd30..7245820c 100644 --- a/web-src/src/components/ListAlbums.vue +++ b/web-src/src/components/ListAlbums.vue @@ -34,7 +34,6 @@ export default { props: { items: { required: true, type: Object }, load: { default: null, type: Function }, - loaded: { default: true, type: Boolean }, mediaKind: { default: '', type: String } }, emits: ['play-count-changed', 'podcast-deleted'], diff --git a/web-src/src/components/ListAlbumsSpotify.vue b/web-src/src/components/ListAlbumsSpotify.vue index 663e5f81..edb6ab84 100644 --- a/web-src/src/components/ListAlbumsSpotify.vue +++ b/web-src/src/components/ListAlbumsSpotify.vue @@ -13,7 +13,7 @@ @open="open(item)" @open-details="openDetails(item)" /> - + - + - + ) - + - + @@ -96,9 +95,6 @@ export default { } } return {} - }, - loaded() { - return !(this.offset < this.total) } }, methods: { diff --git a/web-src/src/pages/PageSearchLibrary.vue b/web-src/src/pages/PageSearchLibrary.vue index d9130097..e72547f9 100644 --- a/web-src/src/pages/PageSearchLibrary.vue +++ b/web-src/src/pages/PageSearchLibrary.vue @@ -44,16 +44,16 @@ import ListTracks from '@/components/ListTracks.vue' import library from '@/api/library' import { useSearchStore } from '@/stores/search' -const PAGE_SIZE = 3, - SEARCH_TYPES = [ - 'track', - 'artist', - 'album', - 'composer', - 'playlist', - 'audiobook', - 'podcast' - ] +const PAGE_SIZE = 3 +const SEARCH_TYPES = [ + 'track', + 'artist', + 'album', + 'composer', + 'playlist', + 'audiobook', + 'podcast' +] export default { name: 'PageSearchLibrary', @@ -72,7 +72,7 @@ export default { }, data() { return { - limit: {}, + limit: PAGE_SIZE, results: new Map(), types: SEARCH_TYPES } @@ -86,23 +86,17 @@ export default { } }, mounted() { - this.searchStore.source = this.$route.name - this.limit = PAGE_SIZE this.search() }, methods: { expand(type) { - this.types = [type] - this.limit = -1 - this.search() + this.search([type], -1) }, getItems(items) { return items }, openSearch(query) { this.searchStore.query = query - this.types = SEARCH_TYPES - this.limit = PAGE_SIZE this.search() }, reset() { @@ -111,12 +105,10 @@ export default { this.results.set(type, new GroupedList()) }) }, - search(event) { + search(types = SEARCH_TYPES, limit = PAGE_SIZE) { if (this.searchStore.query) { - if (event) { - this.types = SEARCH_TYPES - this.limit = PAGE_SIZE - } + this.types = types + this.limit = limit this.searchStore.query = this.searchStore.query.trim() this.reset() this.types.forEach((type) => { diff --git a/web-src/src/pages/PageSearchSpotify.vue b/web-src/src/pages/PageSearchSpotify.vue index a5a0a950..1f9fe615 100644 --- a/web-src/src/pages/PageSearchSpotify.vue +++ b/web-src/src/pages/PageSearchSpotify.vue @@ -4,6 +4,7 @@ :expanded="expanded" :get-items="getItems" :history="history" + :load="(expanded && searchNext) || null" :results="results" @search="search" @search-library="searchLibrary" @@ -23,9 +24,9 @@ import SpotifyWebApi from 'spotify-web-api-js' import services from '@/api/services' import { useSearchStore } from '@/stores/search' -const PAGE_SIZE = 3, - PAGE_SIZE_EXPANDED = 50, - SEARCH_TYPES = ['track', 'artist', 'album', 'playlist'] +const PAGE_SIZE = 3 +const PAGE_SIZE_EXPANDED = 50 +const SEARCH_TYPES = ['track', 'artist', 'album', 'playlist'] export default { name: 'PageSearchSpotify', @@ -43,8 +44,8 @@ export default { }, data() { return { - results: new Map(), parameters: {}, + results: new Map(), types: SEARCH_TYPES } }, @@ -59,25 +60,17 @@ export default { } }, mounted() { - this.searchStore.source = this.$route.name - this.parameters.limit = PAGE_SIZE this.search() }, methods: { expand(type) { - this.types = [type] - this.parameters.limit = PAGE_SIZE_EXPANDED - this.parameters.offset = 0 - this.search() + this.search([type], PAGE_SIZE_EXPANDED) }, getItems(items) { return items.items }, openSearch(query) { this.searchStore.query = query - this.types = SEARCH_TYPES - this.parameters.limit = PAGE_SIZE - this.parameters.offset = 0 this.search() }, reset() { @@ -86,12 +79,11 @@ export default { this.results.set(type, { items: [], total: 0 }) }) }, - search(event) { + search(types = SEARCH_TYPES, limit = PAGE_SIZE, offset = 0) { if (this.searchStore.query) { - if (event) { - this.types = SEARCH_TYPES - this.parameters.limit = PAGE_SIZE - } + this.types = types + this.parameters.limit = limit + this.parameters.offset = offset this.searchStore.query = this.searchStore.query.trim() this.reset() this.searchItems().then((data) => { @@ -123,9 +115,8 @@ export default { this.searchItems().then((data) => { const [next] = Object.values(data) items.items.push(...next.items) - items.total = next.total - this.parameters.offset = (this.parameters.offset || 0) + next.limit - loaded(next.items.length, PAGE_SIZE_EXPANDED) + this.parameters.offset += next.items.length + loaded(Number(next.next && next.limit), PAGE_SIZE_EXPANDED) }) } } diff --git a/web-src/src/templates/ContentWithSearch.vue b/web-src/src/templates/ContentWithSearch.vue index 35c20984..4156ac1a 100644 --- a/web-src/src/templates/ContentWithSearch.vue +++ b/web-src/src/templates/ContentWithSearch.vue @@ -43,16 +43,11 @@ @@ -98,11 +93,6 @@ export default { return { searchStore: useSearchStore() } - }, - methods: { - showAllButton(items) { - return items.total > items.items.length - } } }