Use Twemoji

This commit is contained in:
Acid Chicken (硫酸鶏) 2018-11-05 11:19:40 +09:00
parent 4e7fbd8967
commit 0963e6d6e1
6 changed files with 98 additions and 25 deletions

View file

@ -40,18 +40,20 @@ const lib = Object.entries(emojilib.lib).filter((x: any) => {
});
const emjdb: EmojiDef[] = lib.map((x: any) => ({
emoji: x[1].char,
emoji: `:${x[0]}:`,
name: x[0],
aliasOf: null
aliasOf: null,
url: `https://twemoji.maxcdn.com/2/svg/${x[1].char.codePointAt(0).toString(16)}.svg`
}));
lib.forEach((x: any) => {
if (x[1].keywords) {
x[1].keywords.forEach(k => {
emjdb.push({
emoji: x[1].char,
emoji: `:${x[0]}:`,
name: k,
aliasOf: x[0]
aliasOf: x[0],
url: `https://twemoji.maxcdn.com/2/svg/${x[1].char.codePointAt(0).toString(16)}.svg`
});
});
}

View file

@ -0,0 +1,42 @@
<template>
<img class="mk-emoji" :src="url" :alt="alt || name" :title="name">
</template>
<script lang="ts">
import Vue from 'vue';
import { lib } from 'emojilib';
export default Vue.extend({
props: ['emoji'],
data() {
return {
url: null,
alt: null,
name: null
}
},
mounted() {
this.$nextTick(() => this.exec());
},
methods: {
exec() {
const { emoji } = this;
this.name = emoji;
(this as any).api('meta').then(meta =>
this.url = meta && meta.emojis ? meta.emojis.find(e => e.name === emoji || e.aliases && e.aliases.includes(emoji)).url : null);
if (!this.url) {
const { char } = lib[emoji] || { char: null };
if (char) {
this.url = `https://twemoji.maxcdn.com/2/svg/${char.codePointAt(0).toString(16)}.svg`;
this.alt = char;
}
}
}
}
});
</script>
<style lang="stylus" scoped>
.mk-emoji
height 2.5em
vertical-align middle
</style>

View file

@ -39,6 +39,7 @@ import urlPreview from './url-preview.vue';
import twitterSetting from './twitter-setting.vue';
import githubSetting from './github-setting.vue';
import fileTypeIcon from './file-type-icon.vue';
import emoji from './emoji.vue';
import Reversi from './games/reversi/reversi.vue';
import welcomeTimeline from './welcome-timeline.vue';
import uiInput from './ui/input.vue';
@ -93,6 +94,7 @@ Vue.component('mk-url-preview', urlPreview);
Vue.component('mk-twitter-setting', twitterSetting);
Vue.component('mk-github-setting', githubSetting);
Vue.component('mk-file-type-icon', fileTypeIcon);
Vue.component('mk-emoji', emoji);
Vue.component('mk-reversi', Reversi);
Vue.component('mk-welcome-timeline', welcomeTimeline);
Vue.component('ui-input', uiInput);

View file

@ -188,25 +188,11 @@ export default Vue.component('misskey-flavored-markdown', {
}
case 'emoji': {
//#region カスタム絵文字
if (this.customEmojis != null) {
const customEmoji = this.customEmojis.find(e => e.name == token.emoji || (e.aliases || []).includes(token.emoji));
if (customEmoji) {
return [createElement('img', {
attrs: {
src: customEmoji.url,
alt: token.emoji,
title: token.emoji,
style: 'height: 2.5em; vertical-align: middle;'
}
const { emoji } = token;
return [createElement('mk-emoji', {
attrs: { emoji }
})];
}
}
//#endregion
const emoji = emojilib.lib[token.emoji];
return [createElement('span', emoji ? emoji.char : token.content)];
}
case 'search': {
return [createElement(MkGoogle, {

View file

@ -0,0 +1,35 @@
export type IMastodonEmoji = {
shortcode: string,
url: string,
static_url: string,
visible_in_picker: boolean
};
export async function toMastodonEmojis(emoji: any): Promise<IMastodonEmoji[]> {
return [{
shortcode: emoji.name,
url: emoji.url,
static_url: emoji.url, // TODO: Implement ensuring static emoji
visible_in_picker: true
}, ...(emoji.aliases as string[] || []).map(x => ({
shortcode: x,
url: emoji.url,
static_url: emoji.url,
visible_in_picker: true
}))];
}
export function toMisskeyEmojiSync(emoji: IMastodonEmoji) {
return {
name: emoji.shortcode,
url: emoji.url
};
}
export function toMisskeyEmojiWithAliasesSync(emoji: IMastodonEmoji, ...aliases: string[]) {
return {
name: emoji.shortcode,
aliases,
url: emoji.url
};
}

View file

@ -5,17 +5,18 @@ import config from '../../config';
import Meta from '../../models/meta';
import { ObjectID } from 'bson';
import Emoji from '../../models/emoji';
import { toMastodonEmojis } from '../../models/mastodon/emoji';
const pkg = require('../../../package.json');
// Init router
const router = new Router();
router.get('/v1/custom_emojis', async ctx => ctx.body =
await Emoji.find({ host: null }, {
(await Emoji.find({ host: null }, {
fields: {
_id: false
}
}));
})).map(toMastodonEmojis));
router.get('/v1/instance', async ctx => { // TODO: This is a temporary implementation. Consider creating helper methods!
const meta = await Meta.findOne() || {};
@ -40,6 +41,11 @@ router.get('/v1/instance', async ctx => { // TODO: This is a temporary implement
notesCount: 0
};
const acct = maintainer.host ? `${maintainer.username}@${maintainer.host}` : maintainer.username;
const emojis = (await Emoji.find({ host: null }, {
fields: {
_id: false
}
})).map(toMastodonEmojis);
ctx.body = {
uri: config.hostname,
@ -79,7 +85,7 @@ router.get('/v1/instance', async ctx => { // TODO: This is a temporary implement
followers_count: maintainer.followersCount,
following_count: maintainer.followingCount,
statuses_count: maintainer.notesCount,
emojis: [],
emojis: emojis,
moved: null,
fields: null
}