upd: add tossface emojis as an option

This commit is contained in:
Marie 2024-01-04 20:42:25 +01:00
parent c8a7e27e70
commit 3c3c5e190a
No known key found for this signature in database
GPG key ID: 56569BBE47D2C828
10 changed files with 39 additions and 4 deletions

View file

@ -42,7 +42,7 @@ SPDX-License-Identifier: AGPL-3.0-only
import { markRaw, ref, shallowRef, computed, onUpdated, onMounted, onBeforeUnmount, nextTick, watch } from 'vue';
import sanitizeHtml from 'sanitize-html';
import contains from '@/scripts/contains.js';
import { char2twemojiFilePath, char2fluentEmojiFilePath } from '@/scripts/emoji-base.js';
import { char2twemojiFilePath, char2fluentEmojiFilePath, char2tossfaceFilePath } from '@/scripts/emoji-base.js';
import { acct } from '@/filters/user.js';
import * as os from '@/os.js';
import { defaultStore } from '@/store.js';
@ -68,7 +68,7 @@ const lib = emojilist.filter(x => x.category !== 'flags');
const emojiDb = computed(() => {
//#region Unicode Emoji
const char2path = defaultStore.reactiveState.emojiStyle.value === 'twemoji' ? char2twemojiFilePath : char2fluentEmojiFilePath;
const char2path = defaultStore.reactiveState.emojiStyle.value === 'twemoji' ? char2twemojiFilePath : defaultStore.reactiveState.emojiStyle.value === 'tossface' ? char2tossfaceFilePath : char2fluentEmojiFilePath;
const unicodeEmojiDB: EmojiDef[] = lib.map(x => ({
emoji: x.char,

View file

@ -11,7 +11,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<script lang="ts" setup>
import { computed, inject } from 'vue';
import { char2twemojiFilePath, char2fluentEmojiFilePath } from '@/scripts/emoji-base.js';
import { char2twemojiFilePath, char2fluentEmojiFilePath, char2tossfaceFilePath } from '@/scripts/emoji-base.js';
import { defaultStore } from '@/store.js';
import { getEmojiName } from '@/scripts/emojilist.js';
import * as os from '@/os.js';
@ -27,7 +27,7 @@ const props = defineProps<{
const react = inject<((name: string) => void) | null>('react', null);
const char2path = defaultStore.state.emojiStyle === 'twemoji' ? char2twemojiFilePath : char2fluentEmojiFilePath;
const char2path = defaultStore.state.emojiStyle === 'twemoji' ? char2twemojiFilePath : defaultStore.reactiveState.emojiStyle.value === 'tossface' ? char2tossfaceFilePath : char2fluentEmojiFilePath;
const useOsNativeEmojis = computed(() => defaultStore.state.emojiStyle === 'native');
const url = computed(() => {

View file

@ -146,6 +146,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<option value="native">{{ i18n.ts.native }}</option>
<option value="fluentEmoji">Fluent Emoji</option>
<option value="twemoji">Twemoji</option>
<option value="tossface">Tossface</option>
</MkRadios>
<div style="margin: 8px 0 0 0; font-size: 1.5em;"><Mfm :key="emojiStyle" text="🍮🍦🍭🍩🍰🍫🍬🥞🍪"/></div>
</div>

View file

@ -5,6 +5,7 @@
const twemojiSvgBase = '/twemoji';
const fluentEmojiPngBase = '/fluent-emoji';
const tossfaceSvgBase = '/tossface';
export function char2twemojiFilePath(char: string): string {
let codes = Array.from(char, x => x.codePointAt(0)?.toString(16));
@ -23,3 +24,14 @@ export function char2fluentEmojiFilePath(char: string): string {
const fileName = codes.map(x => x!.padStart(4, '0')).join('-');
return `${fluentEmojiPngBase}/${fileName}.png`;
}
export function char2tossfaceFilePath(char: string): string {
let codes = Array.from(char, x => x.codePointAt(0)?.toString(16));
// Twemoji is the only emoji font which still supports the shibuya 50 emoji to this day
if (codes[0]?.startsWith('e50a')) return char2twemojiFilePath(char);
// Tossface does not use the fe0f modifier
codes = codes.filter(x => x !== 'fe0f');
codes = codes.filter(x => x && x.length);
const fileName = codes.join('-');
return `${tossfaceSvgBase}/${fileName}.svg`;
}

View file

@ -27,6 +27,7 @@ const devConfig = {
'/files': 'http://localhost:3000/',
'/twemoji': 'http://localhost:3000/',
'/fluent-emoji': 'http://localhost:3000/',
'/tossface': 'http://localhost:3000/',
'/sw.js': 'http://localhost:3000/',
'/streaming': {
target: 'ws://localhost:3000/',

View file

@ -71,6 +71,7 @@ export function getConfig(): UserConfig {
'/client-assets/': __dirname + '/assets/',
'/static-assets/': __dirname + '/../backend/assets/',
'/fluent-emojis/': __dirname + '/../../fluent-emojis/dist/',
'/tossface/': __dirname + '/../../tossface-emojis/dist/',
'/fluent-emoji/': __dirname + '/../../fluent-emojis/dist/',
},
},