2017-12-04 16:26:40 +09:00
|
|
|
import { autoPlayGif } from 'flavours/glitch/util/initial_state';
|
2017-10-06 10:42:34 +09:00
|
|
|
import unicodeMapping from './emoji_unicode_mapping_light';
|
2017-07-03 18:02:36 +09:00
|
|
|
import Trie from 'substring-trie';
|
2016-11-16 02:38:57 +09:00
|
|
|
|
2017-07-19 05:49:24 +09:00
|
|
|
const trie = new Trie(Object.keys(unicodeMapping));
|
2017-03-30 05:27:24 +09:00
|
|
|
|
2017-09-23 08:41:00 +09:00
|
|
|
const assetHost = process.env.CDN_HOST || '';
|
|
|
|
|
2017-09-19 09:42:40 +09:00
|
|
|
const emojify = (str, customEmojis = {}) => {
|
2017-11-07 22:48:13 +09:00
|
|
|
const tagCharsWithoutEmojis = '<&';
|
|
|
|
const tagCharsWithEmojis = Object.keys(customEmojis).length ? '<&:' : '<&';
|
|
|
|
let rtn = '', tagChars = tagCharsWithEmojis, invisible = 0;
|
2017-09-20 06:27:29 +09:00
|
|
|
for (;;) {
|
|
|
|
let match, i = 0, tag;
|
2017-11-07 22:48:13 +09:00
|
|
|
while (i < str.length && (tag = tagChars.indexOf(str[i])) === -1 && (invisible || !(match = trie.search(str.slice(i))))) {
|
2017-09-20 06:27:29 +09:00
|
|
|
i += str.codePointAt(i) < 65536 ? 1 : 2;
|
|
|
|
}
|
2017-09-30 22:57:32 +09:00
|
|
|
let rend, replacement = '';
|
|
|
|
if (i === str.length) {
|
2017-09-20 06:27:29 +09:00
|
|
|
break;
|
2017-09-21 10:47:16 +09:00
|
|
|
} else if (str[i] === ':') {
|
2017-09-30 22:57:32 +09:00
|
|
|
if (!(() => {
|
|
|
|
rend = str.indexOf(':', i + 1) + 1;
|
|
|
|
if (!rend) return false; // no pair of ':'
|
2017-09-20 06:27:29 +09:00
|
|
|
const lt = str.indexOf('<', i + 1);
|
2017-09-30 22:57:32 +09:00
|
|
|
if (!(lt === -1 || lt >= rend)) return false; // tag appeared before closing ':'
|
|
|
|
const shortname = str.slice(i, rend);
|
|
|
|
// now got a replacee as ':shortname:'
|
|
|
|
// if you want additional emoji handler, add statements below which set replacement and return true.
|
2017-09-21 10:47:16 +09:00
|
|
|
if (shortname in customEmojis) {
|
2017-11-01 06:58:07 +09:00
|
|
|
const filename = autoPlayGif ? customEmojis[shortname].url : customEmojis[shortname].static_url;
|
2017-10-07 09:38:52 +09:00
|
|
|
replacement = `<img draggable="false" class="emojione" alt="${shortname}" title="${shortname}" src="${filename}" />`;
|
2017-09-30 22:57:32 +09:00
|
|
|
return true;
|
2017-09-20 06:27:29 +09:00
|
|
|
}
|
2017-09-30 22:57:32 +09:00
|
|
|
return false;
|
|
|
|
})()) rend = ++i;
|
|
|
|
} else if (tag >= 0) { // <, &
|
|
|
|
rend = str.indexOf('>;'[tag], i + 1) + 1;
|
2017-11-07 22:48:13 +09:00
|
|
|
if (!rend) {
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
if (tag === 0) {
|
|
|
|
if (invisible) {
|
|
|
|
if (str[i + 1] === '/') { // closing tag
|
|
|
|
if (!--invisible) {
|
|
|
|
tagChars = tagCharsWithEmojis;
|
|
|
|
}
|
|
|
|
} else if (str[rend - 2] !== '/') { // opening tag
|
|
|
|
invisible++;
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
if (str.startsWith('<span class="invisible">', i)) {
|
|
|
|
// avoid emojifying on invisible text
|
|
|
|
invisible = 1;
|
|
|
|
tagChars = tagCharsWithoutEmojis;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2017-09-30 22:57:32 +09:00
|
|
|
i = rend;
|
|
|
|
} else { // matched to unicode emoji
|
2017-10-06 10:42:34 +09:00
|
|
|
const { filename, shortCode } = unicodeMapping[match];
|
|
|
|
const title = shortCode ? `:${shortCode}:` : '';
|
|
|
|
replacement = `<img draggable="false" class="emojione" alt="${match}" title="${title}" src="${assetHost}/emoji/${filename}.svg" />`;
|
2017-09-30 22:57:32 +09:00
|
|
|
rend = i + match.length;
|
2018-09-04 00:30:55 +09:00
|
|
|
// If the matched character was followed by VS15 (for selecting text presentation), skip it.
|
|
|
|
if (str.codePointAt(rend) === 65038) {
|
|
|
|
rend += 1;
|
|
|
|
}
|
2017-07-01 00:29:22 +09:00
|
|
|
}
|
2017-09-30 22:57:32 +09:00
|
|
|
rtn += str.slice(0, i) + replacement;
|
|
|
|
str = str.slice(rend);
|
2017-03-30 05:27:24 +09:00
|
|
|
}
|
2017-09-20 06:27:29 +09:00
|
|
|
return rtn + str;
|
2017-08-03 04:05:17 +09:00
|
|
|
};
|
2016-11-16 02:38:57 +09:00
|
|
|
|
2017-07-03 18:02:36 +09:00
|
|
|
export default emojify;
|
2018-01-05 14:17:30 +09:00
|
|
|
export { unicodeMapping };
|
2017-09-23 12:40:28 +09:00
|
|
|
|
2017-11-01 06:58:07 +09:00
|
|
|
export const buildCustomEmojis = (customEmojis) => {
|
2017-09-23 12:40:28 +09:00
|
|
|
const emojis = [];
|
|
|
|
|
|
|
|
customEmojis.forEach(emoji => {
|
|
|
|
const shortcode = emoji.get('shortcode');
|
2017-11-01 06:58:07 +09:00
|
|
|
const url = autoPlayGif ? emoji.get('url') : emoji.get('static_url');
|
2017-09-23 12:40:28 +09:00
|
|
|
const name = shortcode.replace(':', '');
|
|
|
|
|
|
|
|
emojis.push({
|
2017-09-23 21:47:32 +09:00
|
|
|
id: name,
|
2017-09-23 12:40:28 +09:00
|
|
|
name,
|
|
|
|
short_names: [name],
|
|
|
|
text: '',
|
|
|
|
emoticons: [],
|
|
|
|
keywords: [name],
|
|
|
|
imageUrl: url,
|
2017-09-23 21:47:32 +09:00
|
|
|
custom: true,
|
2019-06-28 22:54:10 +09:00
|
|
|
customCategory: emoji.get('category'),
|
2017-09-23 12:40:28 +09:00
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
return emojis;
|
|
|
|
};
|
2019-06-28 22:54:10 +09:00
|
|
|
|
|
|
|
export const categoriesFromEmojis = customEmojis => customEmojis.reduce((set, emoji) => set.add(emoji.get('category') ? `custom-${emoji.get('category')}` : 'custom'), new Set());
|