Emojize
High resolution, unicode (emoji) to html conversion utility
npm install emojize --save
var convert = require('emojize').emojize
var html = convert('Haay 😜. Just getting ☕. But maybe 🍻 at 🕘🌜 is that 🆒')
Browser usage with Ender
ender add emojize
Note
Use of this library requires <meta charset='utf-8'>
encoding if used in a browser.
<head>
<meta charset='utf-8'>
<link href='sprite/emoji.css' type='text/css'>
<script src='ender.js'></script>
</head>
var convert = require('emojize').emojize
document.getElementById('content').innerHTML = convert('Haay 😜')
Sprite vs Image
emojize
defaults to sprite based conversion which ultimately requires the developer to include the sprite/emoji.css
and upload the emoji.png
along side the file. You could otherwise include all images found in img/
and pass in flag to the second argument to emojize
var emo = require('emojize')
emo.base('images/emojis/')
emo.emojize('Haay 😜', true)
/**
* outputs:
* 'Haay <img src="images/emojis/_1f61c.png">'
*/
Examples
make build
make example
open http://localhost:3000/example.jade
Sizing
Each emoji defaults to 64px
× 64px
which may not always be desired. Thus, consider the following practice. Example assumes LESS.
.quarter { zoom: 0.25 }
.half { zoom: 0.5 }
.three-quarter { zoom: 0.75 }
.full { zoom: 1 }
@media screen and (max-width: 768px) {
.emoji {
.quarter()
}
}
@media screen and (max-width: 992px) {
.emoji {
.half()
}
}
@media screen and (max-width: 1200px) {
.emoji {
.three-quarter()
}
}
@media screen and (max-width: 1600px) {
.emoji {
.full()
}
}
Credits
Much thanks to Gemoji project for high resolution images and Apple Inc. for Artwork. See License
Happy Emojizing!