Git Merge Request #135: Added Twemoji support (merged)
Merging...
Merged
Something went wrong. Please, merge manually
Checking if merge is possible...
Something went wrong. Please, merge manually
Rohan Verma wants to merge 4 commits from /u/rhnvrm/allura/ to master, 2016-06-29
Hello,
This will "provide standard Unicode emoji support across all platforms.". It only converts standard unicode which looks like this:
into:
P.S.
I'm working on integrating emojis using ReactJS using various libraries but have not been able to do so as of yet due to it taking more time than I had expected. Some promising ones are [http://conor.rodeo/react-emoji-react/demo/, https://github.com/pladaria/react-emojione].
In the future, we will be able to use http://www.emoji-cheat-sheet.com/ emoji which will be converted into emoji by ReactJS along with https://github.com/blog/2119-add-reactions-to-pull-requests-issues-and-comments
Rohan Verma
Cool. It doesn't seem like we need to do anything with ReactJS do we? Can just set it up the simple way. React seems best suited for specific components, that are dynamic on the page (changing html).
We prefer to have JS and CSS libraries included in Allura rather than loaded from a CDN url. So could you add it alongside our other .js files and mention it in the LICENSE files like we do for others?
The
onloadcode would be better in a js file likeallura-base.jsand can go inside the jquery function instead of usingonload. We could potentially parse all the.markdown_contentdivs, if we wanted to limit it to the spots where user text is present, but doing the whole document seems fine too.Similarly, the CSS should all be in the .css file.
It would be nice when editing something like a comment or ticket, if the preview button ran twemoji then too so you can see exactly how it'll look when it's saved.
In the future we probably should discuss if/how we want to make it easier to insert emoji characters, but this seems like a good start on its own.
Okay, will put the files in their proper place.
Also, regarding using React I think I forgot to mention that I'm trying it to implement these features which I'll send in another merge request in the future:
1. Github's reactions:
2. Slack's emoji suggestions:
3. http://www.emoji-cheat-sheet.com/ emoji shortcodes support.
Nice. For providing suggestions in our input fields, CodeMirror (which simplemde is based on) has a
showHintoption https://codemirror.net/doc/manual.html#addons I've looked into that a little bit for other ideas like suggesting tickets if you start typing[#Are you thinking we'd save the unicode value? Or the shortcode? Seems like unicode might the best approach so that we don't have to worry about shortcodes showing up in other places besides web pages (e.g. emails, rss feeds, apis)
And for github-style reactions, did you know tickets can be voted on? (And other things could potentially too, by re-using its
VotableArtifact). How would reactions work in relationship to voting? I kind of thought of voting as better way to handle thumbs up/down already.Updated.
Last edit: Rohan Verma 2016-06-23
This looks good and I was just about to merge it when I was testing different font sizes. For example a big heading like:
# abc 😳 def 🌄And they end up looking pixellated because the images are only 16px. Do you know if there's a way to make that better? It also makes me think about high-res monitors (e.g. retina on a Mac) where double-size images would be best to make it look real sharp.
Updated it to 36x36, now it looks much better.
