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

radio page overhauled

Browse source 
Signed-off-by: Core <core@coredev.uk>
This commit is contained in:
Core 2022-09-14 01:00:29 +01:00
parent d7dd447e7a
commit 1b5ae2177e
No known key found for this signature in database
GPG key ID: 2AB8327FBA02D1C0
2 changed files with 86 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

25
src/renderer/main/vueapp.js
View file

@ -45,10 +45,7 @@ const app = new Vue({
browsepage: [],
listennow: [],
madeforyou: [],
radio: {
"editorial": [],
"recent": [],
},
radio: [],
mklang: "en",
webview: {
url: "",
@ -3017,29 +3014,17 @@ const app = new Vue({
name: "radio",
"omit[resource:artists]": "relationships",
"include[albums]": "artists",
"include[music-videos]": "artists",
"include[songs]": "artists",
"include[stations]": "events",
extend: "artistUrl,editorialArtwork",
"include[music-videos]": "artists",
extend: "editorialArtwork,artistUrl",
"fields[artists]": "name,url,artwork,editorialArtwork,genreNames,editorialNotes",
"format[resources]": "map",
"art[url]": "f",
l: app.mklang
l: app.mklang,
}).then((radio) => {
app.radio.editorial = radio.data.resources
app.radio = radio.data.data[0];
console.debug(app.radio);
})
app.mk.api.v3.music(`/v1/me/recent/radio-stations`, {
"platform": "web",
"art[url]": "f",
"format[resources]": "map",
l: app.mklang
}).then((radio) => {
app.radio.recent = radio.data
console.debug(app.radio);
})
this.radio.timestamp = Date.now();
} catch (e) {
console.log(e);

88
src/renderer/views/pages/radio.ejs
View file

@ -1,16 +1,71 @@
<script type="text/x-template" id="cider-radio">
<div class="content-inner">
<h1 class="header-text">{{$root.getLz("term.radio")}}</h1>
<template v-if="data.editorial">
<template v-for="(recom,index) in data.editorial[4]">
<template v-if="data.relationships && data.relationships.tabs">
<template v-for="(recom,index) in data.relationships.tabs.data[0].relationships.children.data">
<div class="row">
<div class="col" v-if="recom.attributes.name != 'Chart Set'">
<h3>{{ recom.attributes.name ?? ""}}</h3>
</div>
<div class="col-auto cider-flex-center">
<button class="cd-btn-seeall" v-if="recom.attributes.name == 'Recently Played' && recent.length > 10"
@click="app.showCollection({ data: recent }, recom.attributes.name ?? '', 'listen_now')">
{{app.getLz('term.seeAll')}}
</button>
<template v-if="index != 0 && recom.relationships && ((recom.relationships.children && recom.relationships.children.data.length > 10) || (recom.relationships.contents && recom.relationships.contents.data.length > 10))">
<button class="cd-btn-seeall" v-if="recom.relationships.room"
@click="app.showRoom(recom.relationships.room?.data[0].href)">
{{app.getLz('term.seeAll')}}
</button>
<button class="cd-btn-seeall" v-else
@click="app.showCollection(recom.relationships.children ? recom.relationships.children : recom.relationships.contents, recom.attributes.name ?? '', 'listen_now')">
{{app.getLz('term.seeAll')}}
</button>
</template>
</div>
</div>
<div v-if="recom.attributes.name == 'Recently Played'">
<mediaitem-scroller-horizontal-mvview :imagesize="800"
:browsesp="index == 0|| (data.relationships.tabs.data[0].relationships.children.data[0].relationships == null && index === 1)"
:kind="recom.attributes.editorialElementKind"
:items="recent.limit(10)"></mediaitem-scroller-horizontal-mvview>
</div>
<template v-else-if="(recom.relationships != null && ((recom.relationships.children && recom.relationships.children.data) || (recom.relationships.contents && recom.relationships.contents.data)))">
<template v-if="index === 0|| (data.relationships.tabs.data[0].relationships.children.data[0].relationships == null && index === 1)">
<mediaitem-scroller-horizontal-mvview :imagesize="800"
:browsesp="index == 0"
:browsesp="index == 0|| (data.relationships.tabs.data[0].relationships.children.data[0].relationships == null && index === 1)"
:kind="recom.attributes.editorialElementKind"
:items="recom.relationships.children ? recom.relationships.children.data.limit(10) : recom.relationships.contents.data.limit(10)"></mediaitem-scroller-horizontal-mvview>
</div>
</template>
<template v-else-if="(['327']).includes(recom.attributes.editorialElementKind)">
<div class="mediaitem-list-item__grid">
<listitem-horizontal :items="recom.relationships.contents.data.limit(20)">
</listitem-horizontal>
</div>
</template>
<template v-else-if="(['385']).includes(recom.attributes.editorialElementKind)">
<mediaitem-scroller-horizontal-mvview :imagesize="800"
:kind="recom.attributes.editorialElementKind"
:items="recom.relationships.children ? recom.relationships.children.data.limit(10) : recom.relationships.contents.data.limit(10)"></mediaitem-scroller-horizontal-mvview>
</template>
<template v-else-if="recom.attributes.name == 'Chart Set'">
<!-- ignored -->
</template>
<template v-else>
<mediaitem-scroller-horizontal-large
:items="recom.relationships.children ? recom.relationships.children.data.limit(10) : recom.relationships.contents.data.limit(10)"></mediaitem-scroller-horizontal-large>
</template>
</template>
<template v-else>
<template v-if="recom.attributes.links && recom.attributes.editorialElementKind.includes('391')">
<div class="grouping-container">
<button class="grouping-btn" @click="$root.goToGrouping(link.url)"
v-for="link in recom.attributes.links">{{ link.label }}
</button>
</div>
</template>
</template>
</template>
</template>
</div>
@ -23,11 +78,30 @@
data: function() {
return {
app: this.$root,
recent: []
};
},
mounted() {
this.$root.getRadioPage();
debugger
this.getRecentlyPlayed();
debugger
},
methods: {}
methods: {
getRecentlyPlayed: async function (next = null) {
const recent = await app.mk.api.v3.music(`${next ?? "/v1/me/recent/radio-stations"}`, {
"platform": "web",
"art[url]": "f",
l: app.mklang
})
console.debug(recent.data.data)
this.recent = this.recent.concat(recent.data.data);
if (recent.data.next) {
this.getRecentlyPlayed(recent.data.next);
}
}
}
});
</script>