listen now page (kinda)

This commit is contained in:
vapormusic 2021-12-04 11:12:30 +07:00
parent 17ed47774a
commit 862ea60ded
2 changed files with 36 additions and 12 deletions

View file

@ -192,16 +192,6 @@
</div> </div>
<br> <br>
<br> <br>
<button class="md-btn" @click="drawertest = !drawertest">Toggle Drawer</button>
<button class="md-btn">Button</button>
<button class="md-btn md-btn-primary">Button</button>
</div>
</template>
</transition>
<!-- Listen Now -->
<transition name="wpfade">
<template v-if="page == 'listen_now'">
<div class="content-inner">
<h1 class="header-text">Listen Now</h1> <h1 class="header-text">Listen Now</h1>
<div class="winbox"> <div class="winbox">
<div class="fancy">990kbps</div> <div class="fancy">990kbps</div>
@ -209,9 +199,18 @@
<button class="md-btn md-btn-primary">Audio Quality Settings</button> <button class="md-btn md-btn-primary">Audio Quality Settings</button>
</div> </div>
</div> </div>
<button class="md-btn" @click="drawertest = !drawertest">Toggle Drawer</button>
<button class="md-btn">Button</button>
<button class="md-btn md-btn-primary">Button</button>
</div> </div>
</template> </template>
</transition> </transition>
<!-- Listen Now -->
<transition v-on:enter="getListenNow()" name="wpfade">
<template v-if="page == 'listen_now'" @created="console.log('listennow')">
<cider-listen-now :data="listennow"></cider-listen-now>
</template>
</transition>
<!-- Radio --> <!-- Radio -->
<transition v-on:enter="getRadioStations()" name="wpfade"> <transition v-on:enter="getRadioStations()" name="wpfade">
<template v-if="page == 'radio'" @created="console.log('radio')"> <template v-if="page == 'radio'" @created="console.log('radio')">
@ -264,6 +263,23 @@
</div> </div>
<script type="text/x-template" id="cider-listen-now">
<div class="content-inner">
<template v-for="recom in data.data">
<div class="row">
<div class="col">
<h3>{{ recom.attributes.title ? recom.attributes.title.stringForDisplay : ""}}</h3>
</div>
<div class="col-auto flex-center" v-if="recom.relationships.contents.data.length >= 10">
<button class="cd-btn-seeall">See All</button>
</div>
</div>
<mediaitem-scroller-horizontal :items="recom.relationships.contents.data.limit(10)"></mediaitem-scroller-horizontal>
</template>
</div>
</script>
<script type="text/x-template" id="cider-search"> <script type="text/x-template" id="cider-search">
<div class="content-inner"> <div class="content-inner">
<div class="row"> <div class="row">
@ -417,6 +433,7 @@
</template> </template>
</script> </script>
<script src="https://js-cdn.music.apple.com/musickit/v2/amp/musickit.js"></script> <script src="https://js-cdn.music.apple.com/musickit/v2/amp/musickit.js"></script>
<script src="index.js?v=1"></script> <script src="index.js?v=1"></script>
</body> </body>

View file

@ -42,6 +42,11 @@ Vue.component('cider-search', {
} }
}) })
Vue.component('cider-listen-now', {
template: "#cider-listen-now",
props: ["data"]
})
const MusicKitTools = { const MusicKitTools = {
getHeader() { getHeader() {
return new Headers({ return new Headers({
@ -72,6 +77,7 @@ const app = new Vue({
playerLCD: { playerLCD: {
playbackDuration: 0 playbackDuration: 0
}, },
listennow: [],
radio: { radio: {
personal: [] personal: []
}, },
@ -143,7 +149,7 @@ const app = new Vue({
return return
} }
try { try {
await this.mk.api.personalRecommendations("", this.listennow = await this.mk.api.personalRecommendations("",
{ {
name: "listen-now", name: "listen-now",
with: "friendsMix,library,social", with: "friendsMix,library,social",
@ -171,9 +177,10 @@ const app = new Vue({
includeResponseMeta: !0, includeResponseMeta: !0,
reload: !0 reload: !0
}); });
console.log(this.listennow)
} catch (e) { } catch (e) {
console.log(e) console.log(e)
await this.getListenNow(attempt + 1) this.getListenNow(attempt + 1)
} }
}, },
async getRadioStations(attempt = 0) { async getRadioStations(attempt = 0) {