okseby/orchard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

podcast page will now load from library

Browse source
This commit is contained in:
booploops 2022-01-19 04:08:10 -08:00
parent 4dc4999cca
commit 062cbefb33
2 changed files with 86 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

25
src/renderer/style.less
View file

@ -2487,6 +2487,31 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
}
}
// Podcast Page
.content-inner.podcasts-page {
display: flex;
height: calc(100% - var(--navigationBarHeight));
padding: 0px;
.podcasts-list {
height: 100%;
width: 400px;
background: gray;
overflow-y: overlay;
}
.episodes-list {
height: 100%;
width: 100%;
background: black;
overflow-y: overlay;
}
}
/* Album / Playlist Page */
.playlist-page {
--bgColor: transparent;

68
src/renderer/views/pages/podcasts.ejs
View file

@ -1,12 +1,37 @@
<script type="text/x-template" id="apple-podcasts">
<div class="content-inner">
<h1>Podcasts</h1>
<mediaitem-square v-for="podcast in podcasts" :item="podcast"></mediaitem-square>
<h3>Episodes</h3>
<mediaitem-square v-for="episode in episodes" :item="episode"></mediaitem-square>
<div class="content-inner podcasts-page">
<div class="podcasts-list">
<podcast-item @click.native="getEpisodes(podcast)" v-for="podcast in podcasts" :item="podcast"></podcast-item>
</div>
<div class="episodes-list">
<div class="well">
<mediaitem-square kind="small" :item="episode" v-for="episode in episodes"></mediaitem-square>
</div>
</div>
</div>
</script>
<script type="text/x-template" id="podcast-item">
<div class="cd-mediaitem-list-item">
<div class="artwork">
<mediaitem-artwork
:url="item.attributes.artwork.url"
size="50"
:type="podcast"></mediaitem-artwork>
</div>
<div class="info-rect">
<div class="title text-overflow-elipsis">
{{ item.attributes.name }}
</div>
</div>
</div>
</script>
<script>
Vue.component('podcast-item', {
template: '#podcast-item',
props: ['item'],
methods: {}
});
Vue.component('apple-podcasts', {
template: '#apple-podcasts',
data: function () {
@ -16,12 +41,41 @@
}
},
async mounted() {
let podcastShow = await app.mk.api.v3.podcasts(`/v1/catalog/us/podcasts/1233359606?include=episodes`)
let podcastShow = await app.mk.api.v3.podcasts(`/v1/me/library/podcasts?include=episodes`)
this.podcasts = podcastShow.data.data
this.episodes = podcastShow.data.data[0].relationships.episodes.data
if(podcastShow.data.next) {
await this.getNext(podcastShow.data.next)
}
// this.episodes = podcastShow.data.data[0].relationships.episodes.data
},
methods: {
async getEpisodes(podcast) {
this.episodes = []
let eps = await app.mk.api.v3.podcasts(`/v1/catalog/${app.mk.storefrontId}/podcasts/${podcast.id}?include=episodes`)
eps.data.data[0].relationships.episodes.data.forEach(ep => {
this.episodes.push(ep)
})
if(eps.data.data[0].relationships.episodes.next) {
await this.getNextEpisodes(eps.data.data[0].relationships.episodes.next)
}
},
async getNextEpisodes(next) {
let podcastShow = await app.mk.api.v3.podcasts(next)
podcastShow.data.data.forEach(ep => {
this.episodes.push(ep)
})
if(podcastShow.data.next) {
await this.getNextEpisodes(podcastShow.data.next)
}
},
async getNext(next) {
let podcastShow = await app.mk.api.v3.podcasts(next)
this.podcasts = this.podcasts.concat(podcastShow.data.data)
if(podcastShow.data.next) {
await this.getNext(podcastShow.data.next)
}
}
}
});
</script>