artists can now be followed in dev, homepage will now display latest releases from followed
This commit is contained in:
parent
f930f0fd16
commit
1ad7012e32
4 changed files with 78 additions and 11 deletions
4
index.js
4
index.js
|
@ -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
|
||||||
|
|
|
@ -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;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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: ()=>{}
|
||||||
|
|
|
@ -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) => {
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue