Update unicodeToImage to maintain compatibility with emojione

We recently updated our version of emojione but this update included the addition of emoji represented in unicode with ZWJ (Zero-Width-Joiners). These ZWJs are not present in the asset file names, so any emoji with ZWJ in them were just not found (404 on the web client).

This updates `unicodeToImage` to be compatible with emojione 2.2.7 so that the correct filenames are used when converting from unicode to <img>.
This commit is contained in:
Luke Barnard 2017-07-11 18:27:35 +01:00
parent 6369253142
commit 0df144cb62

View file

@ -38,7 +38,7 @@ const COLOR_REGEX = /^#[0-9a-fA-F]{6}$/;
* because we want to include emoji shortnames in title text * because we want to include emoji shortnames in title text
*/ */
export function unicodeToImage(str) { export function unicodeToImage(str) {
let replaceWith, unicode, alt; let replaceWith, unicode, alt, short, fname;
const mappedUnicode = emojione.mapUnicodeToShort(); const mappedUnicode = emojione.mapUnicodeToShort();
str = str.replace(emojione.regUnicode, function(unicodeChar) { str = str.replace(emojione.regUnicode, function(unicodeChar) {
@ -50,11 +50,14 @@ export function unicodeToImage(str) {
// get the unicode codepoint from the actual char // get the unicode codepoint from the actual char
unicode = emojione.jsEscapeMap[unicodeChar]; unicode = emojione.jsEscapeMap[unicodeChar];
short = mappedUnicode[unicode];
fname = emojione.emojioneList[short].fname;
// depending on the settings, we'll either add the native unicode as the alt tag, otherwise the shortname // depending on the settings, we'll either add the native unicode as the alt tag, otherwise the shortname
alt = (emojione.unicodeAlt) ? emojione.convert(unicode.toUpperCase()) : mappedUnicode[unicode]; alt = (emojione.unicodeAlt) ? emojione.convert(unicode.toUpperCase()) : mappedUnicode[unicode];
const title = mappedUnicode[unicode]; const title = mappedUnicode[unicode];
replaceWith = `<img class="mx_emojione" title="${title}" alt="${alt}" src="${emojione.imagePathSVG}${unicode}.svg${emojione.cacheBustParam}"/>`; replaceWith = `<img class="mx_emojione" title="${title}" alt="${alt}" src="${emojione.imagePathSVG}${fname}.svg${emojione.cacheBustParam}"/>`;
return replaceWith; return replaceWith;
} }
}); });