parent
edf36d28ca
commit
cbf883ab1e
3 changed files with 31 additions and 16 deletions
|
@ -27,7 +27,11 @@ const EmojiReactions = {
|
|||
},
|
||||
accountsForEmoji () {
|
||||
return this.status.emoji_reactions.reduce((acc, reaction) => {
|
||||
acc[reaction.name] = reaction.accounts || []
|
||||
if (reaction.url) {
|
||||
acc[reaction.url] = reaction.accounts || []
|
||||
} else {
|
||||
acc[reaction.name] = reaction.accounts || []
|
||||
}
|
||||
return acc
|
||||
}, {})
|
||||
},
|
||||
|
@ -42,6 +46,14 @@ const EmojiReactions = {
|
|||
reactedWith (emoji) {
|
||||
return this.status.emoji_reactions.find(r => r.name === emoji).me
|
||||
},
|
||||
isLocalReaction (emojiUrl) {
|
||||
if (!emojiUrl) return true
|
||||
const reacted = this.accountsForEmoji[emojiUrl]
|
||||
if (reacted.length === 0) {
|
||||
return true
|
||||
}
|
||||
return reacted[0].is_local
|
||||
},
|
||||
fetchEmojiReactionsByIfMissing () {
|
||||
const hasNoAccounts = this.status.emoji_reactions.find(r => !r.accounts)
|
||||
if (hasNoAccounts) {
|
||||
|
|
|
@ -2,12 +2,13 @@
|
|||
<div class="emoji-reactions">
|
||||
<UserListPopover
|
||||
v-for="(reaction) in emojiReactions"
|
||||
:key="reaction.name"
|
||||
:users="accountsForEmoji[reaction.name]"
|
||||
:key="reaction.url || reaction.name"
|
||||
:users="accountsForEmoji[reaction.url || reaction.name]"
|
||||
>
|
||||
<button
|
||||
class="emoji-reaction btn button-default"
|
||||
:class="{ 'picked-reaction': reactedWith(reaction.name), 'not-clickable': !loggedIn }"
|
||||
:disabled="!isLocalReaction(reaction.url)"
|
||||
@click="emojiOnClick(reaction.name, $event)"
|
||||
@mouseenter="fetchEmojiReactionsByIfMissing()"
|
||||
>
|
||||
|
|
|
@ -148,20 +148,22 @@ export default {
|
|||
mfmHtml.innerHTML = marked.parse(content)
|
||||
|
||||
// Add options with set values to CSS
|
||||
Array.from(mfmHtml.content.firstChild.getElementsByClassName('mfm')).map((el) => {
|
||||
if (el.dataset.speed) {
|
||||
el.style.animationDuration = el.dataset.speed
|
||||
}
|
||||
if (el.dataset.deg) {
|
||||
el.style.transform = `rotate(${el.dataset.deg}deg)`
|
||||
}
|
||||
if (Array.from(el.classList).includes('_mfm_font_')) {
|
||||
const font = Object.keys(el.dataset)[0]
|
||||
if (['serif', 'monospace', 'cursive', 'fantasy', 'emoji', 'math'].includes(font)) {
|
||||
el.style.fontFamily = font
|
||||
if (mfmHtml.content.firstChild) {
|
||||
Array.from(mfmHtml.content.firstChild.getElementsByClassName('mfm')).map((el) => {
|
||||
if (el.dataset.speed) {
|
||||
el.style.animationDuration = el.dataset.speed
|
||||
}
|
||||
}
|
||||
})
|
||||
if (el.dataset.deg) {
|
||||
el.style.transform = `rotate(${el.dataset.deg}deg)`
|
||||
}
|
||||
if (Array.from(el.classList).includes('_mfm_font_')) {
|
||||
const font = Object.keys(el.dataset)[0]
|
||||
if (['serif', 'monospace', 'cursive', 'fantasy', 'emoji', 'math'].includes(font)) {
|
||||
el.style.fontFamily = font
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
return mfmHtml.innerHTML
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue