artists can now be followed in dev, homepage will now display latest releases from followed

This commit is contained in:
booploops 2021-12-29 00:11:12 -08:00
parent f930f0fd16
commit 1ad7012e32
4 changed files with 78 additions and 11 deletions

View file

@ -15,6 +15,10 @@ const configSchema = {
"discordClearActivityOnPause" : 0, // 0 = disabled, 1 = enabled "discordClearActivityOnPause" : 0, // 0 = disabled, 1 = enabled
"volume": 1 "volume": 1
}, },
"home": {
"followedArtists": [],
"favoriteItems": []
},
"audio": { "audio": {
"quality": "extreme", "quality": "extreme",
"seamless_audio": true "seamless_audio": true

View file

@ -1550,18 +1550,34 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
max-width: 420px; max-width: 420px;
} }
.hint-text {
font-size: 0.9rem;
color: rgb(200 200 200 / 70%);
}
.user-icon { .user-icon {
border-radius: 100%; border-radius: 100%;
width: 128px; width: 128px;
height: 128px; height: 128px;
overflow: hidden; overflow: hidden;
box-shadow: var(--mediaItemShadow-Shadow); box-shadow: var(--mediaItemShadow-Shadow);
margin: 16px;
} }
.well.profile-well { .well.profile-well {
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
.name {
margin: 4px;
font-weight: 500;
}
.handle {
margin: 4px;
opacity: 0.7;
font-weight: 500;
}
} }
} }

View file

@ -135,6 +135,27 @@
methods: { methods: {
artistMenu (event) { artistMenu (event) {
let self = this let self = this
let followAction = "follow"
let followActions = {
follow: {
name: "Follow Artist",
action: ()=>{
self.app.cfg.home.followedArtists.push(self.data.id)
}
},
unfollow: {
name: "Unfollow Artist",
action: ()=>{
let index = self.app.cfg.home.followedArtists.indexOf(self.data.id)
if (index > -1) {
self.app.cfg.home.followedArtists.splice(index, 1)
}
}
}
}
if(this.app.cfg.home.followedArtists.includes(self.data.id)) {
followAction = "unfollow"
}
CiderContextMenu.Create(event, { CiderContextMenu.Create(event, {
items: [ items: [
{ {
@ -145,10 +166,7 @@
}) })
} }
}, },
{ followActions[followAction],
name: "Follow Artist",
action: ()=>{}
},
{ {
name: "Share", name: "Share",
action: ()=>{} action: ()=>{}

View file

@ -9,9 +9,8 @@
<div class="user-icon"> <div class="user-icon">
<mediaitem-artwork shadow="none" :url="profile.attributes.artwork.url" size="300"></mediaitem-artwork> <mediaitem-artwork shadow="none" :url="profile.attributes.artwork.url" size="300"></mediaitem-artwork>
</div> </div>
<h3>{{ profile.attributes.name }}</h3> <h3 class="name">{{ profile.attributes.name }}</h3>
<h4>@{{ profile.attributes.handle }}</h4> <h4 class="handle">@{{ profile.attributes.handle }}</h4>
<button class="md-btn">Share</button>
</div> </div>
</div> </div>
<div class="col"> <div class="col">
@ -25,7 +24,7 @@
<div class="col"> <div class="col">
<h3>Your Favorites</h3> <h3>Your Favorites</h3>
<div class="well"> <div class="well">
<div>Items you have added to your favorites will appear here.</div> <div class="hint-text">Items you have added to your favorites will appear here.</div>
<!-- <mediaitem-scroller-horizontal kind="small" :items="friendsListeningTo" :item="item"></mediaitem-scroller-horizontal> --> <!-- <mediaitem-scroller-horizontal kind="small" :items="friendsListeningTo" :item="item"></mediaitem-scroller-horizontal> -->
</div> </div>
</div> </div>
@ -40,7 +39,12 @@
<div class="col"> <div class="col">
<h3>Your Artist Feed</h3> <h3>Your Artist Feed</h3>
<div class="well"> <div class="well">
<mediaitem-list-item v-for="item in recentlyPlayed.limit(6)" :item="item"></mediaitem-list-item> <template v-if="artistFeed.length > 0">
<mediaitem-list-item v-for="item in artistFeed.limit(6)" :item="item"></mediaitem-list-item>
</template>
<template v-else>
<div class="hint-text">No new activity from followed artists</div>
</template>
</div> </div>
</div> </div>
</div> </div>
@ -62,18 +66,44 @@
data: function () { data: function () {
return { return {
app: this.$root, app: this.$root,
followedArtists: this.$root.cfg.home.followedArtists,
madeForYou: [], madeForYou: [],
recentlyPlayed: [], recentlyPlayed: [],
friendsListeningTo: [], friendsListeningTo: [],
profile: {}, profile: {},
modify: 0 modify: 0,
artistFeed: []
} }
}, },
async mounted() { async mounted() {
let self = this let self = this
this.getListenNowData() this.getListenNowData()
await this.getArtistFeed()
}, },
methods: { methods: {
async getArtistFeed() {
let artists = this.followedArtists
let self = this
console.warn("get artist feed")
this.app.mk.api.artists(artists, {
"views": "featured-release,full-albums,appears-on-albums,featured-albums,featured-on-albums,singles,compilation-albums,live-albums,latest-release,top-music-videos,similar-artists,top-songs,playlists,more-to-hear,more-to-see",
"extend": "artistBio,bornOrFormed,editorialArtwork,editorialVideo,isGroup,origin,hero",
"extend[playlists]": "trackCount",
"include[songs]": "albums",
"fields[albums]": "artistName,artistUrl,artwork,contentRating,editorialArtwork,editorialVideo,name,playParams,releaseDate,url,trackCount",
"limit[artists:top-songs]": 20,
"art[url]": "f"
}, { includeResponseMeta: !0 }).then(artistData => {
artistData.data.forEach(item => {
if(item.views["latest-release"].data.length != 0) {
self.artistFeed.push(item.views["latest-release"].data[0])
}
})
console.warn("got artist feed")
console.log(self.artistFeed)
})
},
getRecentlyPlayed() { getRecentlyPlayed() {
}, },
@ -127,7 +157,6 @@
; ;
})[0].relationships.contents.data })[0].relationships.contents.data
}catch(err){} }catch(err){}
}); });
app.mk.api.v3.music("/v1/me/social/profile/").then((response) => { app.mk.api.v3.music("/v1/me/social/profile/").then((response) => {