Refactoring
This commit is contained in:
parent
e5a3dcf868
commit
b4b9e76c8d
1 changed files with 45 additions and 29 deletions
|
@ -17,7 +17,7 @@
|
||||||
<span class="emoji" v-if="emoji.url"><img :src="emoji.url" :alt="emoji.emoji"/></span>
|
<span class="emoji" v-if="emoji.url"><img :src="emoji.url" :alt="emoji.emoji"/></span>
|
||||||
<span class="emoji" v-else>{{ 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="name" v-html="emoji.name.replace(q, `<b>${q}</b>`)"></span>
|
||||||
<span class="alias" v-if="emoji.alias">({{ emoji.alias }})</span>
|
<span class="alias" v-if="emoji.aliasOf">({{ emoji.aliasOf }})</span>
|
||||||
</li>
|
</li>
|
||||||
</ol>
|
</ol>
|
||||||
</div>
|
</div>
|
||||||
|
@ -28,14 +28,21 @@ import Vue from 'vue';
|
||||||
import * as emojilib from 'emojilib';
|
import * as emojilib from 'emojilib';
|
||||||
import contains from '../../../common/scripts/contains';
|
import contains from '../../../common/scripts/contains';
|
||||||
|
|
||||||
|
type EmojiDef = {
|
||||||
|
emoji: string;
|
||||||
|
name: string;
|
||||||
|
aliasOf?: string;
|
||||||
|
url?: string;
|
||||||
|
};
|
||||||
|
|
||||||
const lib = Object.entries(emojilib.lib).filter((x: any) => {
|
const lib = Object.entries(emojilib.lib).filter((x: any) => {
|
||||||
return x[1].category != 'flags';
|
return x[1].category != 'flags';
|
||||||
});
|
});
|
||||||
|
|
||||||
const emjdb = lib.map((x: any) => ({
|
const emjdb: EmojiDef[] = lib.map((x: any) => ({
|
||||||
emoji: x[1].char,
|
emoji: x[1].char,
|
||||||
name: x[0],
|
name: x[0],
|
||||||
alias: null
|
aliasOf: null
|
||||||
}));
|
}));
|
||||||
|
|
||||||
lib.forEach((x: any) => {
|
lib.forEach((x: any) => {
|
||||||
|
@ -44,7 +51,7 @@ lib.forEach((x: any) => {
|
||||||
emjdb.push({
|
emjdb.push({
|
||||||
emoji: x[1].char,
|
emoji: x[1].char,
|
||||||
name: k,
|
name: k,
|
||||||
alias: x[0]
|
aliasOf: x[0]
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -62,7 +69,8 @@ export default Vue.extend({
|
||||||
hashtags: [],
|
hashtags: [],
|
||||||
emojis: [],
|
emojis: [],
|
||||||
select: -1,
|
select: -1,
|
||||||
emojilib
|
emojilib,
|
||||||
|
emojiDb: [] as EmojiDef[]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -91,6 +99,34 @@ export default Vue.extend({
|
||||||
},
|
},
|
||||||
|
|
||||||
mounted() {
|
mounted() {
|
||||||
|
//#region Construct Emoji DB
|
||||||
|
const customEmojis = (this.os.getMetaSync() || { emojis: [] }).emojis || [];
|
||||||
|
const emojiDefinitions: EmojiDef[] = [];
|
||||||
|
|
||||||
|
customEmojis.forEach(x => {
|
||||||
|
emojiDefinitions.push({
|
||||||
|
name: x.name,
|
||||||
|
emoji: `:${x.name}:`,
|
||||||
|
url: x.url
|
||||||
|
});
|
||||||
|
|
||||||
|
if (x.aliases) {
|
||||||
|
x.aliases.forEach(alias => {
|
||||||
|
emojiDefinitions.push({
|
||||||
|
name: alias,
|
||||||
|
aliasOf: x.name,
|
||||||
|
emoji: `:${x.name}:`,
|
||||||
|
url: x.url
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
emojiDefinitions.sort((a, b) => a.name.length - b.name.length);
|
||||||
|
|
||||||
|
this.emojiDb = emojiDefinitions.concat(emjdb);
|
||||||
|
//#endregion
|
||||||
|
|
||||||
this.textarea.addEventListener('keydown', this.onKeydown);
|
this.textarea.addEventListener('keydown', this.onKeydown);
|
||||||
|
|
||||||
Array.from(document.querySelectorAll('body *')).forEach(el => {
|
Array.from(document.querySelectorAll('body *')).forEach(el => {
|
||||||
|
@ -172,38 +208,18 @@ export default Vue.extend({
|
||||||
const matched = [];
|
const matched = [];
|
||||||
const max = 30;
|
const max = 30;
|
||||||
|
|
||||||
const customEmojis = (this.os.getMetaSync() || { emojis: [] }).emojis || [];
|
this.emojiDb.some(x => {
|
||||||
customEmojis.some(x => {
|
if (x.name.startsWith(this.q) && !x.aliasOf && !matched.some(y => y.emoji == x.emoji)) matched.push(x);
|
||||||
if (x.name.startsWith(this.q)) matched.push({
|
|
||||||
name: x.name,
|
|
||||||
emoji: `:${x.name}:`,
|
|
||||||
url: x.url
|
|
||||||
});
|
|
||||||
return matched.length == max;
|
|
||||||
});
|
|
||||||
customEmojis.some(x => {
|
|
||||||
const alias = (x.aliases || []).find(a => a.startsWith(this.q));
|
|
||||||
if (alias) matched.push({
|
|
||||||
alias: x.name,
|
|
||||||
name: alias,
|
|
||||||
emoji: `:${x.name}:`,
|
|
||||||
url: x.url
|
|
||||||
});
|
|
||||||
return matched.length == max;
|
|
||||||
});
|
|
||||||
|
|
||||||
emjdb.some(x => {
|
|
||||||
if (x.name.startsWith(this.q) && !x.alias && !matched.some(y => y.emoji == x.emoji)) matched.push(x);
|
|
||||||
return matched.length == max;
|
return matched.length == max;
|
||||||
});
|
});
|
||||||
if (matched.length < max) {
|
if (matched.length < max) {
|
||||||
emjdb.some(x => {
|
this.emojiDb.some(x => {
|
||||||
if (x.name.startsWith(this.q) && !matched.some(y => y.emoji == x.emoji)) matched.push(x);
|
if (x.name.startsWith(this.q) && !matched.some(y => y.emoji == x.emoji)) matched.push(x);
|
||||||
return matched.length == max;
|
return matched.length == max;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
if (matched.length < max) {
|
if (matched.length < max) {
|
||||||
emjdb.some(x => {
|
this.emojiDb.some(x => {
|
||||||
if (x.name.includes(this.q) && !matched.some(y => y.emoji == x.emoji)) matched.push(x);
|
if (x.name.includes(this.q) && !matched.some(y => y.emoji == x.emoji)) matched.push(x);
|
||||||
return matched.length == max;
|
return matched.length == max;
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue