summaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/app/common/views/components/autocomplete.vue18
-rw-r--r--src/client/app/common/views/components/emoji.vue70
-rw-r--r--src/client/app/common/views/components/misskey-flavored-markdown.ts4
-rw-r--r--src/client/app/common/views/directives/autocomplete.ts1
-rw-r--r--src/client/app/desktop/views/components/settings.vue6
-rw-r--r--src/client/app/mobile/views/pages/settings.vue6
-rw-r--r--src/client/app/store.ts3
-rw-r--r--src/mfm/parse/elements/emoji.ts11
-rw-r--r--src/remote/activitypub/misc/get-emoji-names.ts2
-rw-r--r--src/remote/activitypub/renderer/note.ts5
-rw-r--r--src/services/note/create.ts4
11 files changed, 83 insertions, 47 deletions
diff --git a/src/client/app/common/views/components/autocomplete.vue b/src/client/app/common/views/components/autocomplete.vue
index dff0bfd8d3..4cf44a23ae 100644
--- a/src/client/app/common/views/components/autocomplete.vue
+++ b/src/client/app/common/views/components/autocomplete.vue
@@ -14,7 +14,8 @@
</ol>
<ol class="emojis" ref="suggests" v-if="emojis.length > 0">
<li v-for="emoji in emojis" @click="complete(type, emoji.emoji)" @keydown="onKeydown" tabindex="-1">
- <span class="emoji" v-if="emoji.url"><img :src="emoji.url" :alt="emoji.emoji"/></span>
+ <span class="emoji" v-if="emoji.isCustomEmoji"><img :src="emoji.url" :alt="emoji.emoji"/></span>
+ <span class="emoji" v-else-if="!useOsDefaultEmojis"><img :src="emoji.url" :alt="emoji.emoji"/></span>
<span class="emoji" v-else>{{ emoji.emoji }}</span>
<span class="name" v-html="emoji.name.replace(q, `<b>${q}</b>`)"></span>
<span class="alias" v-if="emoji.aliasOf">({{ emoji.aliasOf }})</span>
@@ -33,6 +34,7 @@ type EmojiDef = {
name: string;
aliasOf?: string;
url?: string;
+ isCustomEmoji?: boolean;
};
const lib = Object.entries(emojilib.lib).filter((x: any) => {
@@ -40,7 +42,7 @@ const lib = Object.entries(emojilib.lib).filter((x: any) => {
});
const emjdb: EmojiDef[] = lib.map((x: any) => ({
- emoji: `:${x[0]}:`,
+ emoji: x[1].char,
name: x[0],
aliasOf: null,
url: `https://twemoji.maxcdn.com/2/svg/${x[1].char.codePointAt(0).toString(16)}.svg`
@@ -50,7 +52,7 @@ lib.forEach((x: any) => {
if (x[1].keywords) {
x[1].keywords.forEach(k => {
emjdb.push({
- emoji: `:${x[0]}:`,
+ emoji: x[1].char,
name: k,
aliasOf: x[0],
url: `https://twemoji.maxcdn.com/2/svg/${x[1].char.codePointAt(0).toString(16)}.svg`
@@ -79,6 +81,10 @@ export default Vue.extend({
computed: {
items(): HTMLCollection {
return (this.$refs.suggests as Element).children;
+ },
+
+ useOsDefaultEmojis(): boolean {
+ return this.$store.state.device.useOsDefaultEmojis;
}
},
@@ -109,7 +115,8 @@ export default Vue.extend({
emojiDefinitions.push({
name: x.name,
emoji: `:${x.name}:`,
- url: x.url
+ url: x.url,
+ isCustomEmoji: true
});
if (x.aliases) {
@@ -118,7 +125,8 @@ export default Vue.extend({
name: alias,
aliasOf: x.name,
emoji: `:${x.name}:`,
- url: x.url
+ url: x.url,
+ isCustomEmoji: true
});
});
}
diff --git a/src/client/app/common/views/components/emoji.vue b/src/client/app/common/views/components/emoji.vue
index 7429aaaa5b..a02d7b3f26 100644
--- a/src/client/app/common/views/components/emoji.vue
+++ b/src/client/app/common/views/components/emoji.vue
@@ -1,59 +1,77 @@
<template>
-<img class="mk-emoji" :src="url" :alt="alt || name" :title="name">
+<img v-if="customEmoji" class="fvgwvorwhxigeolkkrcderjzcawqrscl custom" :src="url" :alt="alt" :title="alt"/>
+<img v-else-if="char && !useOsDefaultEmojis" class="fvgwvorwhxigeolkkrcderjzcawqrscl" :src="url" :alt="alt" :title="alt"/>
+<span v-else-if="char && useOsDefaultEmojis">{{ char }}</span>
+<span v-else>:{{ name }}:</span>
</template>
<script lang="ts">
import Vue from 'vue';
import { lib } from 'emojilib';
-const findCustomEmoji = (x, emoji) =>
- x.name === emoji ||
- x.aliases && x.aliases.includes(emoji);
-
export default Vue.extend({
props: {
- emoji: {
+ name: {
type: String,
required: false
},
- raw: {
+ emoji: {
type: String,
required: false
},
customEmojis: {
- required: false
+ required: false,
+ default: []
}
},
+
data() {
return {
url: null,
- alt: null,
- name: null
+ char: null,
+ customEmoji: null
}
},
- mounted() {
- this.$nextTick(() => this.exec());
+
+ computed: {
+ alt(): string {
+ return this.customEmoji ? this.customEmoji.name : this.char;
+ },
+
+ useOsDefaultEmojis(): boolean {
+ return this.$store.state.device.useOsDefaultEmojis;
+ }
},
- methods: {
- exec() {
- const { emoji, raw, customEmojis } = this;
- this.name = emoji ? `:${emoji}:` : raw;
- if (!raw && customEmojis && customEmojis.length) {
- this.url = customEmojis.find(x => findCustomEmoji(x, emoji)).url;
- } else { // *MEM: `customEmojis` always has a emoji named `emoji`
- const char = raw || lib[emoji] && lib[emoji].char;
- if (char) {
- this.url = `https://twemoji.maxcdn.com/2/svg/${char.codePointAt(0).toString(16)}.svg`;
- this.alt = char;
+
+ created() {
+ if (this.name) {
+ const customEmoji = this.customEmojis.find(x => x.name == this.name);
+ if (customEmoji) {
+ this.customEmoji = customEmoji;
+ this.url = customEmoji.url;
+ } else {
+ const emoji = lib[this.name];
+ if (emoji) {
+ this.char = emoji.char;
}
}
+ } else {
+ this.char = this.emoji;
+ }
+
+ if (this.char) {
+ this.url = `https://twemoji.maxcdn.com/2/svg/${this.char.codePointAt(0).toString(16)}.svg`;
}
}
});
</script>
<style lang="stylus" scoped>
-.mk-emoji
- height 2.5em
- vertical-align middle
+.fvgwvorwhxigeolkkrcderjzcawqrscl
+ height 1em
+
+ &.custom
+ height 2.5em
+ vertical-align middle
+
</style>
diff --git a/src/client/app/common/views/components/misskey-flavored-markdown.ts b/src/client/app/common/views/components/misskey-flavored-markdown.ts
index b4b141ea2b..dd111aba05 100644
--- a/src/client/app/common/views/components/misskey-flavored-markdown.ts
+++ b/src/client/app/common/views/components/misskey-flavored-markdown.ts
@@ -187,10 +187,10 @@ export default Vue.component('misskey-flavored-markdown', {
}
case 'emoji': {
- const { emoji, raw } = token;
+ const { emoji, name } = token;
const { customEmojis } = this;
return [createElement('mk-emoji', {
- attrs: { emoji, raw },
+ attrs: { emoji, name },
props: { customEmojis }
})];
}
diff --git a/src/client/app/common/views/directives/autocomplete.ts b/src/client/app/common/views/directives/autocomplete.ts
index 1a5c5daedc..b91e70f900 100644
--- a/src/client/app/common/views/directives/autocomplete.ts
+++ b/src/client/app/common/views/directives/autocomplete.ts
@@ -145,6 +145,7 @@ class Autocomplete {
} else {
// サジェスト要素作成
this.suggestion = new MkAutocomplete({
+ parent: this.vm,
propsData: {
textarea: this.textarea,
complete: this.complete,
diff --git a/src/client/app/desktop/views/components/settings.vue b/src/client/app/desktop/views/components/settings.vue
index 93bef0e618..97743b0bf8 100644
--- a/src/client/app/desktop/views/components/settings.vue
+++ b/src/client/app/desktop/views/components/settings.vue
@@ -115,6 +115,7 @@
<ui-switch v-model="reduceMotion">%i18n:common.reduce-motion%</ui-switch>
<ui-switch v-model="contrastedAcct">%i18n:@contrasted-acct%</ui-switch>
<ui-switch v-model="showFullAcct">%i18n:common.show-full-acct%</ui-switch>
+ <ui-switch v-model="useOsDefaultEmojis">%i18n:common.use-os-default-emojis%</ui-switch>
<ui-switch v-model="iLikeSushi">%i18n:common.i-like-sushi%</ui-switch>
</section>
<section>
@@ -324,6 +325,11 @@ export default Vue.extend({
};
},
computed: {
+ useOsDefaultEmojis: {
+ get() { return this.$store.state.device.useOsDefaultEmojis; },
+ set(value) { this.$store.commit('device/set', { key: 'useOsDefaultEmojis', value }); }
+ },
+
reduceMotion: {
get() { return this.$store.state.device.reduceMotion; },
set(value) { this.$store.commit('device/set', { key: 'reduceMotion', value }); }
diff --git a/src/client/app/mobile/views/pages/settings.vue b/src/client/app/mobile/views/pages/settings.vue
index 10d13423a1..0463d9b3f4 100644
--- a/src/client/app/mobile/views/pages/settings.vue
+++ b/src/client/app/mobile/views/pages/settings.vue
@@ -23,6 +23,7 @@
<ui-switch v-model="reduceMotion">%i18n:common.reduce-motion% (%i18n:common.this-setting-is-this-device-only%)</ui-switch>
<ui-switch v-model="contrastedAcct">%i18n:@contrasted-acct%</ui-switch>
<ui-switch v-model="showFullAcct">%i18n:common.show-full-acct%</ui-switch>
+ <ui-switch v-model="useOsDefaultEmojis">%i18n:common.use-os-default-emojis%</ui-switch>
<ui-switch v-model="iLikeSushi">%i18n:common.i-like-sushi%</ui-switch>
<ui-switch v-model="disableAnimatedMfm">%i18n:common.disable-animated-mfm%</ui-switch>
<ui-switch v-model="alwaysShowNsfw">%i18n:common.always-show-nsfw% (%i18n:common.this-setting-is-this-device-only%)</ui-switch>
@@ -199,6 +200,11 @@ export default Vue.extend({
set(value) { this.$store.commit('device/set', { key: 'darkmode', value }); }
},
+ useOsDefaultEmojis: {
+ get() { return this.$store.state.device.useOsDefaultEmojis; },
+ set(value) { this.$store.commit('device/set', { key: 'useOsDefaultEmojis', value }); }
+ },
+
reduceMotion: {
get() { return this.$store.state.device.reduceMotion; },
set(value) { this.$store.commit('device/set', { key: 'reduceMotion', value }); }
diff --git a/src/client/app/store.ts b/src/client/app/store.ts
index 7c3a403c87..1108a1c3da 100644
--- a/src/client/app/store.ts
+++ b/src/client/app/store.ts
@@ -62,7 +62,8 @@ const defaultDeviceSettings = {
deckColumnAlign: 'center',
mobileNotificationPosition: 'bottom',
deckTemporaryColumn: null,
- deckDefault: false
+ deckDefault: false,
+ useOsDefaultEmojis: false
};
export default (os: MiOS) => new Vuex.Store({
diff --git a/src/mfm/parse/elements/emoji.ts b/src/mfm/parse/elements/emoji.ts
index 12e0a64b6f..a213b2dacf 100644
--- a/src/mfm/parse/elements/emoji.ts
+++ b/src/mfm/parse/elements/emoji.ts
@@ -8,26 +8,25 @@ export type TextElementEmoji = {
type: 'emoji';
content: string;
emoji?: string;
- raw?: string;
+ name?: string;
};
export default function(text: string) {
const name = text.match(/^:([a-zA-Z0-9+_-]+):/);
if (name) {
- const [content, emoji] = name;
return {
type: 'emoji',
- content,
- emoji
+ content: name[0],
+ name: name[1]
} as TextElementEmoji;
}
const unicode = text.match(emojiRegex);
if (unicode) {
- const [content, raw] = unicode;
+ const [content, emoji] = unicode;
return {
type: 'emoji',
content,
- raw
+ emoji
} as TextElementEmoji;
}
return null;
diff --git a/src/remote/activitypub/misc/get-emoji-names.ts b/src/remote/activitypub/misc/get-emoji-names.ts
index f744d02fed..7dd634a65e 100644
--- a/src/remote/activitypub/misc/get-emoji-names.ts
+++ b/src/remote/activitypub/misc/get-emoji-names.ts
@@ -2,5 +2,5 @@ import parse from '../../../mfm/parse';
export default function(text: string) {
if (!text) return [];
- return parse(text).filter(t => t.type === 'emoji').map(t => (t as any).emoji);
+ return parse(text).filter(t => t.type === 'emoji' && t.name).map(t => (t as any).name);
}
diff --git a/src/remote/activitypub/renderer/note.ts b/src/remote/activitypub/renderer/note.ts
index a2c591de2e..b38d47130a 100644
--- a/src/remote/activitypub/renderer/note.ts
+++ b/src/remote/activitypub/renderer/note.ts
@@ -8,9 +8,7 @@ import Note, { INote } from '../../../models/note';
import User from '../../../models/user';
import toHtml from '../misc/get-note-html';
import parseMfm from '../../../mfm/parse';
-import getEmojiNames from '../misc/get-emoji-names';
import Emoji, { IEmoji } from '../../../models/emoji';
-import { unique } from '../../../prelude/array';
export default async function renderNote(note: INote, dive = true): Promise<any> {
const promisedFiles: Promise<IDriveFile[]> = note.fileIds
@@ -110,8 +108,7 @@ export default async function renderNote(note: INote, dive = true): Promise<any>
const content = toHtml(Object.assign({}, note, { text }));
- const emojiNames = unique(getEmojiNames(content));
- const emojis = await getEmojis(emojiNames);
+ const emojis = await getEmojis(note.emojis);
const apemojis = emojis.map(emoji => renderEmoji(emoji));
const tag = [
diff --git a/src/services/note/create.ts b/src/services/note/create.ts
index ac8bcf034d..b3a3e83d4c 100644
--- a/src/services/note/create.ts
+++ b/src/services/note/create.ts
@@ -456,8 +456,8 @@ function extractHashtags(tokens: ReturnType<typeof parse>): string[] {
function extractEmojis(tokens: ReturnType<typeof parse>): string[] {
// Extract emojis
const emojis = tokens
- .filter(t => t.type == 'emoji')
- .map(t => (t as TextElementEmoji).emoji)
+ .filter(t => t.type == 'emoji' && t.name)
+ .map(t => (t as TextElementEmoji).name)
.filter(emoji => emoji.length <= 100);
return unique(emojis);
generated by cgit v1.2.3-freya (git 2.53.0.84.g453e7b744a) at 2026-04-22 13:05:52 +0000