adds friend badges to mediaitem square, working on adding to playlists/albums

This commit is contained in:
booploops 2021-12-30 06:05:19 -08:00
parent a662192b2d
commit 4390493a9f
4 changed files with 138 additions and 10 deletions

View file

@ -16,6 +16,13 @@
@click="contextMenu"><%- include("../svg/more.svg") %></button>
<button class="play-btn" v-if="!noplay.includes(item.type)"
@click="app.playMediaItem(item)"><%- include("../svg/play.svg") %></button>
<div class="badge-container" v-if="itemBadges.length != 0">
<div class="socialBadge" v-for="badge in itemBadges.limit(1)">
<mediaitem-artwork
:url="badge.attributes.artwork.url"
:size="32"></mediaitem-artwork>
</div>
</div>
</div>
<div class="title item-navigate text-overflow-elipsis" @click.self='app.routeView(item)'>
{{ item.attributes.name }}
@ -54,10 +61,28 @@
guid: this.uuidv4(),
noplay: ["apple-curators"],
nomenu: ["artists", "stations", "apple-curators"],
app: this.$root
app: this.$root,
badges: this.$root.socialBadges.badgeMap,
itemBadges: []
}
},
async mounted() {
await this.getBadges()
},
methods: {
async getBadges() {
let self = this
if(this.badges[this.item.attributes.playParams.id ?? this.item.id]) {
let friends = this.badges[this.item.attributes.playParams.id ?? this.item.id]
if(friends) {
friends.forEach(function (friend) {
self.app.mk.api.socialProfile(friend).then(data => {
self.itemBadges.push(data)
})
})
}
}
},
revisedRandId() {
return Math.random().toString(36).replace(/[^a-z]+/g, '').substr(2, 10);
},

View file

@ -83,6 +83,17 @@
</div>
</div>
<div class="friends-info" v-if="itemBadges.length != 0">
<div class="well">
<div class="badge-container">
<div class="socialBadge" :title="`${badge.attributes.name} - @${badge.attributes.handle}`" v-for="badge in itemBadges">
<mediaitem-artwork
:url="badge.attributes.artwork.url"
:size="60"></mediaitem-artwork>
</div>
</div>
</div>
</div>
<div class="playlist-time">
{{getFormattedDate(data.attributes.releaseDate)}}
</div>
@ -106,7 +117,9 @@
drag: false,
nameEditing: false,
inLibrary: null,
app: this.$root
app: this.$root,
itemBadges: [],
badgesRequested: false
}
},
mounted: function () {
@ -117,9 +130,35 @@
watch: {
data: function () {
this.isInLibrary()
this.getBadges()
}
},
methods: {
getBadges() {
return
if(this.badgesRequested) {
return
}
this.badgesRequested = true
this.itemBadges = []
let self = this
var id = 0
try {
id = this.data.attributes.playParams.id
} catch (e) {
id = this.data.id
}
this.$root.getSocialBadges((badges) => {
let friends = badges[id]
if(friends) {
friends.forEach(function (friend) {
self.app.mk.api.socialProfile(friend).then(data => {
self.itemBadges.push(data)
})
})
}
})
},
async isInLibrary() {
if (this.data.type && !this.data.type.includes("library")) {
// please keep using vars here
@ -228,14 +267,16 @@
},
getFormattedDate: function (date) {
if (date == null || date === "") return "";
try{
var releaseDate = new Date(date);
month = new Intl.DateTimeFormat('en-US', { month: 'long'}).format(releaseDate);
date = releaseDate.getDate();
year = releaseDate.getFullYear();
try {
var releaseDate = new Date(date);
month = new Intl.DateTimeFormat('en-US', {month: 'long'}).format(releaseDate);
date = releaseDate.getDate();
year = releaseDate.getFullYear();
return date + " " + month + " " + year;
} catch (e){ return ""}
return date + " " + month + " " + year;
} catch (e) {
return ""
}
}
}
})