Feature proposal #8718
closedReplace twemoji entirely with font based emojis
Description
These can't be scaled properly without distorting/bluring them and we need to make some usages larger in certain situations. So replace this image based emoji usage with entirely font icon based usage.
Updated by krileon about 3 years ago
Might be better to support unicode emoji only and get rid of the custom emoji parsing.
Spec: https://www.unicode.org/reports/tr51/tr51-19.html
List: https://unicode.org/emoji/charts/full-emoji-list.html
Only include those that are available in all major browsers (nearly all of them). Then completely remove the need for a stored database of emojis or configuration of them since they're all just valid unicode anyone can use right now (this feature would just be providing a handy categorized selector for them).
Additional links that might be of use as follows.
https://getemoji.com/
https://emojipedia.org/
Also add a category selection for kaomoji, which are just text based emojis.
Once implemented the entire storage functionality for emotes can be completely removed. This would just be a simple PHP array that can be imported and cached by PHP.
This will result in a lot of HTML elements so probably the best way to handle it is either an ajax response (risks being too slow), 1 central HTML node for the emoji that's re-used, or just dynamically built out when the tooltip opens and sits in JS. Last 2 options probably being the best. Could be worth using a library like one of the following to cover this usage.
https://github.com/missive/emoji-mart (with https://github.com/missive/emoji-mart/pull/510 applied)
https://github.com/OneSignal/emoji-picker
https://github.com/mervick/emojionearea
https://github.com/joeattardi/emoji-button
https://github.com/nolanlawson/emoji-picker-element
Updated by krileon about 3 years ago
First step is collecting a JSON data set for the emoji. This will then be pushed to local storage. Next implement the necessary JSON to handle hotswapping. The above pre-existing solutions aren't going to work well for J3 since they're modules and custom elements, but can be considered later when moving to AlpineJS. For now a simple custom solution needs to be implemented instead.
Official Unicode Datasets can be found below.
https://unicode.org/Public/emoji/13.1/
https://unicode.org/Public/13.0.0/ucd/emoji/
Need to parse this into a suitable JSON structure or maybe use https://cldr.unicode.org/.
Already done as existing Github project see https://github.com/milesj/emojibase
Updated by krileon about 3 years ago
- % Done changed from 0 to 30
Slimmed JSON file now done at only 66kb before gzip.
Updated by krileon about 3 years ago
- Tracker changed from Bug to Feature proposal
Updated by krileon about 3 years ago
- Status changed from Assigned to Resolved
- % Done changed from 80 to 100