Emoji support in profile (#3514)

* Emoji in profile

* Add emojis to fields
This commit is contained in:
MeiMei 2018-12-06 10:02:04 +09:00 committed by syuilo
parent fe891da886
commit 4522568749
41 changed files with 261 additions and 70 deletions

View file

@ -2,7 +2,9 @@
<div class="mk-note-card">
<a :href="note | notePage">
<header>
<img :src="note.user.avatarUrl" alt="avatar"/><h3>{{ note.user | userName }}</h3>
<img :src="note.user.avatarUrl" alt="avatar"/><h3>
<misskey-flavored-markdown :text="note.user.name || note.user.username" :shouldBreak="false" :plainText="true" :custom-emojis="note.user.emojis"/>
</h3>
</header>
<div>
{{ text }}

View file

@ -20,7 +20,9 @@
<header>
<mk-avatar class="avatar" :user="appearNote.user"/>
<div>
<router-link class="name" :to="appearNote.user | userPage">{{ appearNote.user | userName }}</router-link>
<router-link class="name" :to="appearNote.user | userPage">
<misskey-flavored-markdown :text="appearNote.user.name || appearNote.user.username" :shouldBreak="false" :plainText="true" :custom-emojis="appearNote.user.emojis"/>
</router-link>
<span class="username"><mk-acct :user="appearNote.user"/></span>
</div>
</header>

View file

@ -3,7 +3,7 @@
<template v-if="notification.type == 'reaction'">
<mk-avatar class="avatar" :user="notification.user"/>
<div class="text">
<p><mk-reaction-icon :reaction="notification.reaction"/>{{ notification.user | userName }}</p>
<p><mk-reaction-icon :reaction="notification.reaction"/><misskey-flavored-markdown :text="notification.user.name || notification.user.username" :shouldBreak="false" :plainText="true" :custom-emojis="notification.user.emojis"/></p>
<p class="note-ref"><fa icon="quote-left"/>{{ getNoteSummary(notification.note) }}<fa icon="quote-right"/></p>
</div>
</template>
@ -11,7 +11,7 @@
<template v-if="notification.type == 'renote'">
<mk-avatar class="avatar" :user="notification.note.user"/>
<div class="text">
<p><fa icon="retweet"/>{{ notification.note.user | userName }}</p>
<p><fa icon="retweet"/><misskey-flavored-markdown :text="notification.note.user.name || notification.note.user.username" :shouldBreak="false" :plainText="true" :custom-emojis="notification.note.user.emojis"/></p>
<p class="note-ref"><fa icon="quote-left"/>{{ getNoteSummary(notification.note.renote) }}<fa icon="quote-right"/></p>
</div>
</template>
@ -19,7 +19,7 @@
<template v-if="notification.type == 'quote'">
<mk-avatar class="avatar" :user="notification.note.user"/>
<div class="text">
<p><fa icon="quote-left"/>{{ notification.note.user | userName }}</p>
<p><fa icon="quote-left"/><misskey-flavored-markdown :text="notification.note.user.name || notification.note.user.username" :shouldBreak="false" :plainText="true" :custom-emojis="notification.note.user.emojis"/></p>
<p class="note-preview">{{ getNoteSummary(notification.note) }}</p>
</div>
</template>
@ -27,21 +27,21 @@
<template v-if="notification.type == 'follow'">
<mk-avatar class="avatar" :user="notification.user"/>
<div class="text">
<p><fa icon="user-plus"/>{{ notification.user | userName }}</p>
<p><fa icon="user-plus"/><misskey-flavored-markdown :text="notification.user.name || notification.user.username" :shouldBreak="false" :plainText="true" :custom-emojis="notification.user.emojis"/></p>
</div>
</template>
<template v-if="notification.type == 'receiveFollowRequest'">
<mk-avatar class="avatar" :user="notification.user"/>
<div class="text">
<p><fa icon="user-clock"/>{{ notification.user | userName }}</p>
<p><fa icon="user-clock"/><misskey-flavored-markdown :text="notification.user.name || notification.user.username" :shouldBreak="false" :plainText="true" :custom-emojis="notification.user.emojis"/></p>
</div>
</template>
<template v-if="notification.type == 'reply'">
<mk-avatar class="avatar" :user="notification.note.user"/>
<div class="text">
<p><fa icon="reply"/>{{ notification.note.user | userName }}</p>
<p><fa icon="reply"/><misskey-flavored-markdown :text="notification.note.user.name || notification.note.user.username" :shouldBreak="false" :plainText="true" :custom-emojis="notification.note.user.emojis"/></p>
<p class="note-preview">{{ getNoteSummary(notification.note) }}</p>
</div>
</template>
@ -49,7 +49,7 @@
<template v-if="notification.type == 'mention'">
<mk-avatar class="avatar" :user="notification.note.user"/>
<div class="text">
<p><fa icon="at"/>{{ notification.note.user | userName }}</p>
<p><fa icon="at"/><misskey-flavored-markdown :text="notification.note.user.name || notification.note.user.username" :shouldBreak="false" :plainText="true" :custom-emojis="notification.note.user.emojis"/></p>
<p class="note-preview">{{ getNoteSummary(notification.note) }}</p>
</div>
</template>
@ -57,7 +57,7 @@
<template v-if="notification.type == 'poll_vote'">
<mk-avatar class="avatar" :user="notification.user"/>
<div class="text">
<p><fa icon="chart-pie"/>{{ notification.user | userName }}</p>
<p><fa icon="chart-pie"/><misskey-flavored-markdown :text="notification.user.name || notification.user.username" :shouldBreak="false" :plainText="true" :custom-emojis="notification.user.emojis"/></p>
<p class="note-ref"><fa icon="quote-left"/>{{ getNoteSummary(notification.note) }}<fa icon="quote-right"/></p>
</div>
</template>

View file

@ -5,7 +5,7 @@
<div>
<header>
<mk-reaction-icon :reaction="notification.reaction"/>
<router-link :to="notification.user | userPage">{{ notification.user | userName }}</router-link>
<router-link :to="notification.user | userPage"><misskey-flavored-markdown :text="notification.user.name || notification.user.username" :shouldBreak="false" :plainText="true" :custom-emojis="notification.user.emojis"/></router-link>
<mk-time :time="notification.createdAt"/>
</header>
<router-link class="note-ref" :to="notification.note | notePage" :title="getNoteSummary(notification.note)">
@ -20,7 +20,7 @@
<div>
<header>
<fa icon="retweet"/>
<router-link :to="notification.user | userPage">{{ notification.user | userName }}</router-link>
<router-link :to="notification.user | userPage"><misskey-flavored-markdown :text="notification.user.name || notification.user.username" :shouldBreak="false" :plainText="true" :custom-emojis="notification.user.emojis"/></router-link>
<mk-time :time="notification.createdAt"/>
</header>
<router-link class="note-ref" :to="notification.note | notePage" :title="getNoteSummary(notification.note.renote)">
@ -34,7 +34,7 @@
<div>
<header>
<fa icon="user-plus"/>
<router-link :to="notification.user | userPage">{{ notification.user | userName }}</router-link>
<router-link :to="notification.user | userPage"><misskey-flavored-markdown :text="notification.user.name || notification.user.username" :shouldBreak="false" :plainText="true" :custom-emojis="notification.user.emojis"/></router-link>
<mk-time :time="notification.createdAt"/>
</header>
</div>
@ -45,7 +45,7 @@
<div>
<header>
<fa icon="user-clock"/>
<router-link :to="notification.user | userPage">{{ notification.user | userName }}</router-link>
<router-link :to="notification.user | userPage"><misskey-flavored-markdown :text="notification.user.name || notification.user.username" :shouldBreak="false" :plainText="true" :custom-emojis="notification.user.emojis"/></router-link>
<mk-time :time="notification.createdAt"/>
</header>
</div>
@ -56,7 +56,7 @@
<div>
<header>
<fa icon="chart-pie"/>
<router-link :to="notification.user | userPage">{{ notification.user | userName }}</router-link>
<router-link :to="notification.user | userPage"><misskey-flavored-markdown :text="notification.user.name || notification.user.username" :shouldBreak="false" :plainText="true" :custom-emojis="notification.user.emojis"/></router-link>
<mk-time :time="notification.createdAt"/>
</header>
<router-link class="note-ref" :to="notification.note | notePage" :title="getNoteSummary(notification.note)">

View file

@ -13,7 +13,10 @@
<mk-note-preview class="preview" v-if="reply" :note="reply"/>
<mk-note-preview class="preview" v-if="renote" :note="renote"/>
<div v-if="visibility == 'specified'" class="visibleUsers">
<span v-for="u in visibleUsers">{{ u | userName }}<a @click="removeVisibleUser(u)">[x]</a></span>
<span v-for="u in visibleUsers">
<misskey-flavored-markdown :text="u.name || u.username" :shouldBreak="false" :plainText="true" :custom-emojis="u.emojis"/>
<a @click="removeVisibleUser(u)">[x]</a>
</span>
<a @click="addVisibleUser">+{{ $t('add-visible-user') }}</a>
</div>
<input v-show="useCw" ref="cw" v-model="cw" :placeholder="$t('annotations')" v-autocomplete="'cw'">

View file

@ -11,7 +11,9 @@
<div class="body" v-if="isOpen">
<router-link class="me" v-if="$store.getters.isSignedIn" :to="`/@${$store.state.i.username}`">
<img class="avatar" :src="$store.state.i.avatarUrl" alt="avatar"/>
<p class="name">{{ $store.state.i | userName }}</p>
<p class="name">
<misskey-flavored-markdown :text="$store.state.i.name || $store.state.i.username" :shouldBreak="false" :plainText="true" :custom-emojis="$store.state.i.emojis"/>
</p>
</router-link>
<div class="links">
<ul>

View file

@ -3,7 +3,9 @@
<header :style="user.bannerUrl ? `background-image: url(${user.bannerUrl})` : ''">
<mk-avatar class="avatar" :user="user"/>
</header>
<a class="name" :href="user | userPage" target="_blank">{{ user | userName }}</a>
<a class="name" :href="user | userPage" target="_blank">
<misskey-flavored-markdown :text="user.name || user.username" :shouldBreak="false" :plainText="true" :custom-emojis="user.emojis"/>
</a>
<p class="username"><mk-acct :user="user"/></p>
<mk-follow-button class="follow-button" :user="user"/>
</div>

View file

@ -3,11 +3,15 @@
<mk-avatar class="avatar" :user="user"/>
<div class="main">
<header>
<router-link class="name" :to="user | userPage">{{ user | userName }}</router-link>
<router-link class="name" :to="user | userPage">
<misskey-flavored-markdown :text="user.name || user.username" :shouldBreak="false" :plainText="true" :custom-emojis="user.emojis"/>
</router-link>
<span class="username"><mk-acct :user="user"/></span>
</header>
<div class="body">
<div class="description">{{ user.description }}</div>
<div class="description">
<misskey-flavored-markdown v-if="u.description" :text="u.description" :author="u" :i="$store.state.i" :custom-emojis="u.emojis"/>
</div>
</div>
</div>
</div>