From 36dc4e23dab8567e7a8c2eabb117c3d0d468419c Mon Sep 17 00:00:00 2001
From: Jonas Heinrich <onny@project-insanity.org>
Date: Sun, 20 Dec 2020 16:19:35 +0100
Subject: [PATCH] fix loading episodes till the end
---
src/components/Main.vue | 20 +---
src/components/Sidebar.vue | 183 -------------------------------------
src/views/Show.vue | 15 +--
3 files changed, 10 insertions(+), 208 deletions(-)
delete mode 100644 src/components/Sidebar.vue
diff --git a/src/components/Main.vue b/src/components/Main.vue
index 50da5e9..52f78c8 100644
--- a/src/components/Main.vue
+++ b/src/components/Main.vue
@@ -31,8 +31,7 @@
:station-data="tableData"
:favorites="favorites"
@doPlay="doPlay"
- @doFavor="doFavor"
- @toggleSidebar="toggleSidebar" />
+ @doFavor="doFavor" />
<EmptyContent
v-if="pageLoading"
icon="icon-loading" />
@@ -45,10 +44,6 @@
</template>
</EmptyContent>
</AppContent>
- <Sidebar
- :show-sidebar="showSidebar"
- :sidebar-station="sidebarStation"
- @toggleSidebar="toggleSidebar" />
</Content>
</template>
@@ -58,7 +53,6 @@ import AppContent from '@nextcloud/vue/dist/Components/AppContent'
import EmptyContent from '@nextcloud/vue/dist/Components/EmptyContent'
import Navigation from './Navigation'
import Table from './Table'
-import Sidebar from './Sidebar'
import { Howl, Howler } from 'howler'
import { generateUrl } from '@nextcloud/router'
@@ -76,14 +70,11 @@ export default {
AppContent,
Table,
EmptyContent,
- Sidebar,
},
data: () => ({
tableData: [],
pageLoading: false,
favorites: [],
- showSidebar: false,
- sidebarStation: {},
queryParams: {},
}),
computed: {
@@ -455,15 +446,6 @@ export default {
showError(t('podcast', 'Unable to load favorites'))
}
},
-
- toggleSidebar(station = null) {
- if (station) {
- this.showSidebar = true
- this.sidebarStation = station
- } else {
- this.showSidebar = false
- }
- },
},
}
</script>
diff --git a/src/components/Sidebar.vue b/src/components/Sidebar.vue
deleted file mode 100644
index 428e05e..0000000
--- a/src/components/Sidebar.vue
+++ /dev/null
@@ -1,183 +0,0 @@
-<!--
- - @copyright Copyright (c) 2020 Jonas Heinrich
- -
- - @author Jonas Heinrich <onny@project-insanity.org>
- -
- - @license GNU AGPL version 3 or any later version
- -
- - This program is free software: you can redistribute it and/or modify
- - it under the terms of the GNU Affero General Public License as
- - published by the Free Software Foundation, either version 3 of the
- - License, or (at your option) any later version.
- -
- - This program is distributed in the hope that it will be useful,
- - but WITHOUT ANY WARRANTY; without even the implied warranty of
- - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- - GNU Affero General Public License for more details.
- -
- - You should have received a copy of the GNU Affero General Public License
- - along with this program. If not, see <http://www.gnu.org/licenses/>.
- -
- -->
-
-<template>
- <AppSidebar
- v-show="showSidebar"
- :title="sidebarStation.name"
- :subtitle="stationTags"
- :background="sidebarStation.favicon"
- class="has-preview"
- @close="toggleSidebar">
- <div class="configBox">
- <span class="icon icon-link" />
- <span class="title">
- {{ t('radio', 'Stream URL') }}
- </span>
- <div class="content">
- <input type="text" :value="urlResolved" disabled="disabled">
- <Actions>
- <ActionButton icon="icon-clippy" @click="copyLink">
- {{ t('radio', 'Copy link to clipboard') }}
- </ActionButton>
- </Actions>
- </div>
- </div>
- <div class="configBox">
- <span class="icon icon-external" />
- <span class="title">
- {{ t('radio', 'Homepage') }}
- </span>
- <div class="content">
- <span>
- <a
- :href="sidebarStation.homepage"
- target="new">
- {{ sidebarStation.homepage }}
- </a>
- </span>
- </div>
- </div>
- <div class="configBox">
- <span class="icon icon-details" />
- <span class="title">
- {{ t('radio', 'Country & Language') }}
- </span>
- <div class="content">
- <span>
- {{ sidebarStation.country }}, {{ sidebarStation.language }}
- </span>
- </div>
- </div>
- <div class="configBox">
- <span class="icon icon-details" />
- <span class="title">
- {{ t('radio', 'Codec & Bitrate') }}
- </span>
- <div class="content">
- <span>
- {{ sidebarStation.codec }}, {{ sidebarStation.bitrate }}
- </span>
- </div>
- </div>
- </AppSidebar>
-</template>
-
-<script>
-import AppSidebar from '@nextcloud/vue/dist/Components/AppSidebar'
-import Actions from '@nextcloud/vue/dist/Components/Actions'
-import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
-import { showError, showSuccess } from '@nextcloud/dialogs'
-
-export default {
- name: 'Sidebar',
- components: {
- AppSidebar,
- Actions,
- ActionButton,
- },
- props: {
- showSidebar: {
- type: Boolean,
- default() { return false },
- },
- sidebarStation: {
- type: Object,
- default() {
- return {}
- },
- },
- },
- computed: {
- urlResolved() {
- if (this.sidebarStation.url_resolved) {
- return this.sidebarStation.url_resolved
- } else {
- return this.sidebarStation.urlresolved
- }
- },
- stationTags() {
- if (this.sidebarStation.tags) {
- return this.sidebarStation.tags.replaceAll(',', ', ')
- }
- return ''
- },
- },
- methods: {
- toggleSidebar(station) {
- this.$emit('toggleSidebar')
- },
- copyLink() {
- this.$copyText(this.urlResolved).then(
- function() {
- showSuccess(t('radio', 'Link copied to clipboard'))
- },
- function() {
- showError(t('radio', 'Error while copying link to clipboard'))
- }
- )
- },
- },
-}
-</script>
-
-<style lang="scss" scoped>
-
-.app-sidebar {
- &.has-preview::v-deep {
- .app-sidebar-header__figure {
- background-size: cover;
- height: 200px;
- }
- }
-}
-
-.configBox {
- padding: 0 15px;
- margin-bottom: 20px;
-}
-
-.configBox .title {
- font-size: 1.2em;
- display: block;
- margin-bottom: 15px;
-}
-
-.configBox .icon {
- float: left;
- margin: 4px 7px 0px 0px;
-}
-
-.configBox .content {
- display: flex;
- margin-left: 25px;
-}
-
-.configBox .content input {
- flex-grow: 1;
-}
-
-.configBox .content button {
- margin-top: -3px;
-}
-
-</style>
diff --git a/src/views/Show.vue b/src/views/Show.vue
index 3e365a7..9e8980e 100644
--- a/src/views/Show.vue
+++ b/src/views/Show.vue
@@ -36,7 +36,7 @@
:episodes="podcast.episodes"
@doPlay="doPlay" />
<EmptyContent
- v-show="nextPage"
+ v-show="!episodesLoaded"
icon="icon-loading" />
</div>
</transition>
@@ -68,6 +68,7 @@ export default {
episodes: [],
},
pageLoading: false,
+ episodesLoaded: false,
nextPage: null,
}),
computed: {
@@ -101,7 +102,6 @@ export default {
onResize({ width, height }) {
const contentHeight = document.getElementById('app-content-vue').scrollHeight
const tableHeight = height
- console.log(tableHeight, contentHeight)
if (tableHeight < contentHeight) {
this.preFill()
}
@@ -146,10 +146,13 @@ export default {
},
processPodcast(podcast) {
- if (this.nextPage > 1) {
- this.podcast.episodes = this.podcast.episodes.concat(podcast.data.episodes)
- } else {
+ if (podcast.meta.paging.page === 0) {
this.podcast = podcast.data
+ } else {
+ if (podcast.meta.paging.page === podcast.meta.paging.last_page) {
+ this.episodesLoaded = true
+ }
+ this.podcast.episodes = this.podcast.episodes.concat(podcast.data.episodes)
}
this.pageLoading = false
},
@@ -160,7 +163,7 @@ export default {
scroll() {
window.onscroll = () => {
if ((window.innerHeight + window.scrollY) >= document.body.scrollHeight) {
- if (this.nextPage) {
+ if (!this.episodesLoaded) {
const podcastId = this.$route.params.id
this.queryPodcast(podcastId)
}
--
GitLab