mirror of
https://github.com/twitter/twemoji.git
synced 2024-07-03 03:18:58 +00:00
adding assets version 1 based on V2 API for testing and comparison purpose
This commit is contained in:
Andrea Giammarchi
parent
39e0a526f8
commit
0c1b4ddfd7
55
1/templates/preview.html
Normal file
55
1/templates/preview.html
Normal file
|
|
@ -0,0 +1,55 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Twitter Emoji (Twemoji) Preview</title>
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<style>
|
||||
ul.emoji-list * {
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
ul.emoji-list li {
|
||||
font-size: 36px;
|
||||
float: left;
|
||||
display: inline-block;
|
||||
padding: 2px;
|
||||
margin: 4px;
|
||||
}
|
||||
img.emoji {
|
||||
cursor: pointer;
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
margin: 0 .05em 0 .1em;
|
||||
vertical-align: -0.1em;
|
||||
}
|
||||
</style>
|
||||
<script src="https://twemoji.maxcdn.com/1/twemoji.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<ul class="emoji-list">
|
||||
{{emoji-list}}
|
||||
</ul>
|
||||
<script>
|
||||
var ul = document.getElementsByTagName('ul')[0];
|
||||
var total = ul.getElementsByTagName('li').length;
|
||||
var elapsed = +new Date;
|
||||
twemoji.parse(ul, {{emoji-options}});
|
||||
elapsed = (+new Date) - elapsed;
|
||||
document.body.insertBefore(
|
||||
document.createTextNode(total + ' emoji parsed in ' + elapsed + 'ms'),
|
||||
document.body.firstChild
|
||||
);
|
||||
(function (img, metaKey, i) {
|
||||
function copyToClipboard(e) {
|
||||
prompt('Copy to clipboard via ' + metaKey + '+C and Enter', this.alt);
|
||||
}
|
||||
for (i = 0; i < img.length; img[i++].onclick = copyToClipboard) {}
|
||||
}(
|
||||
document.getElementsByTagName('img'),
|
||||
/\b(?:Mac |i)OS\b/i.test(navigator.userAgent) ? 'Command' : 'Ctrl'
|
||||
));
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
928
1/test/preview-svg.html
Normal file
928
1/test/preview-svg.html
Normal file
|
|
@ -0,0 +1,928 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Twitter Emoji (Twemoji) Preview</title>
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<style>
|
||||
ul.emoji-list * {
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
ul.emoji-list li {
|
||||
font-size: 36px;
|
||||
float: left;
|
||||
display: inline-block;
|
||||
padding: 2px;
|
||||
margin: 4px;
|
||||
}
|
||||
img.emoji {
|
||||
cursor: pointer;
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
margin: 0 .05em 0 .1em;
|
||||
vertical-align: -0.1em;
|
||||
}
|
||||
</style>
|
||||
<script src="https://twemoji.maxcdn.com/1/twemoji.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<ul class="emoji-list">
|
||||
<li>🀄</li>
|
||||
<li>🃏</li>
|
||||
<li>🅰</li>
|
||||
<li>🅱</li>
|
||||
<li>🅾</li>
|
||||
<li>🅿</li>
|
||||
<li>🆎</li>
|
||||
<li>🆑</li>
|
||||
<li>🆒</li>
|
||||
<li>🆓</li>
|
||||
<li>🆔</li>
|
||||
<li>🆕</li>
|
||||
<li>🆖</li>
|
||||
<li>🆗</li>
|
||||
<li>🆘</li>
|
||||
<li>🆙</li>
|
||||
<li>🆚</li>
|
||||
<li>🇦</li>
|
||||
<li>🇧</li>
|
||||
<li>🇨🇳</li>
|
||||
<li>🇨</li>
|
||||
<li>🇩🇪</li>
|
||||
<li>🇩</li>
|
||||
<li>🇪🇸</li>
|
||||
<li>🇪</li>
|
||||
<li>🇫🇷</li>
|
||||
<li>🇫</li>
|
||||
<li>🇬🇧</li>
|
||||
<li>🇬</li>
|
||||
<li>🇭</li>
|
||||
<li>🇮🇹</li>
|
||||
<li>🇮</li>
|
||||
<li>🇯🇵</li>
|
||||
<li>🇯</li>
|
||||
<li>🇰🇷</li>
|
||||
<li>🇰</li>
|
||||
<li>🇱</li>
|
||||
<li>🇲</li>
|
||||
<li>🇳</li>
|
||||
<li>🇴</li>
|
||||
<li>🇵</li>
|
||||
<li>🇶</li>
|
||||
<li>🇷🇺</li>
|
||||
<li>🇷</li>
|
||||
<li>🇸</li>
|
||||
<li>🇹</li>
|
||||
<li>🇺🇸</li>
|
||||
<li>🇺</li>
|
||||
<li>🇻</li>
|
||||
<li>🇼</li>
|
||||
<li>🇽</li>
|
||||
<li>🇾</li>
|
||||
<li>🇿</li>
|
||||
<li>🈁</li>
|
||||
<li>🈂</li>
|
||||
<li>🈚</li>
|
||||
<li>🈯</li>
|
||||
<li>🈲</li>
|
||||
<li>🈳</li>
|
||||
<li>🈴</li>
|
||||
<li>🈵</li>
|
||||
<li>🈶</li>
|
||||
<li>🈷</li>
|
||||
<li>🈸</li>
|
||||
<li>🈹</li>
|
||||
<li>🈺</li>
|
||||
<li>🉐</li>
|
||||
<li>🉑</li>
|
||||
<li>🌀</li>
|
||||
<li>🌁</li>
|
||||
<li>🌂</li>
|
||||
<li>🌃</li>
|
||||
<li>🌄</li>
|
||||
<li>🌅</li>
|
||||
<li>🌆</li>
|
||||
<li>🌇</li>
|
||||
<li>🌈</li>
|
||||
<li>🌉</li>
|
||||
<li>🌊</li>
|
||||
<li>🌋</li>
|
||||
<li>🌌</li>
|
||||
<li>🌍</li>
|
||||
<li>🌎</li>
|
||||
<li>🌏</li>
|
||||
<li>🌐</li>
|
||||
<li>🌑</li>
|
||||
<li>🌒</li>
|
||||
<li>🌓</li>
|
||||
<li>🌔</li>
|
||||
<li>🌕</li>
|
||||
<li>🌖</li>
|
||||
<li>🌗</li>
|
||||
<li>🌘</li>
|
||||
<li>🌙</li>
|
||||
<li>🌚</li>
|
||||
<li>🌛</li>
|
||||
<li>🌜</li>
|
||||
<li>🌝</li>
|
||||
<li>🌞</li>
|
||||
<li>🌟</li>
|
||||
<li>🌠</li>
|
||||
<li>🌰</li>
|
||||
<li>🌱</li>
|
||||
<li>🌲</li>
|
||||
<li>🌳</li>
|
||||
<li>🌴</li>
|
||||
<li>🌵</li>
|
||||
<li>🌷</li>
|
||||
<li>🌸</li>
|
||||
<li>🌹</li>
|
||||
<li>🌺</li>
|
||||
<li>🌻</li>
|
||||
<li>🌼</li>
|
||||
<li>🌽</li>
|
||||
<li>🌾</li>
|
||||
<li>🌿</li>
|
||||
<li>🍀</li>
|
||||
<li>🍁</li>
|
||||
<li>🍂</li>
|
||||
<li>🍃</li>
|
||||
<li>🍄</li>
|
||||
<li>🍅</li>
|
||||
<li>🍆</li>
|
||||
<li>🍇</li>
|
||||
<li>🍈</li>
|
||||
<li>🍉</li>
|
||||
<li>🍊</li>
|
||||
<li>🍋</li>
|
||||
<li>🍌</li>
|
||||
<li>🍍</li>
|
||||
<li>🍎</li>
|
||||
<li>🍏</li>
|
||||
<li>🍐</li>
|
||||
<li>🍑</li>
|
||||
<li>🍒</li>
|
||||
<li>🍓</li>
|
||||
<li>🍔</li>
|
||||
<li>🍕</li>
|
||||
<li>🍖</li>
|
||||
<li>🍗</li>
|
||||
<li>🍘</li>
|
||||
<li>🍙</li>
|
||||
<li>🍚</li>
|
||||
<li>🍛</li>
|
||||
<li>🍜</li>
|
||||
<li>🍝</li>
|
||||
<li>🍞</li>
|
||||
<li>🍟</li>
|
||||
<li>🍠</li>
|
||||
<li>🍡</li>
|
||||
<li>🍢</li>
|
||||
<li>🍣</li>
|
||||
<li>🍤</li>
|
||||
<li>🍥</li>
|
||||
<li>🍦</li>
|
||||
<li>🍧</li>
|
||||
<li>🍨</li>
|
||||
<li>🍩</li>
|
||||
<li>🍪</li>
|
||||
<li>🍫</li>
|
||||
<li>🍬</li>
|
||||
<li>🍭</li>
|
||||
<li>🍮</li>
|
||||
<li>🍯</li>
|
||||
<li>🍰</li>
|
||||
<li>🍱</li>
|
||||
<li>🍲</li>
|
||||
<li>🍳</li>
|
||||
<li>🍴</li>
|
||||
<li>🍵</li>
|
||||
<li>🍶</li>
|
||||
<li>🍷</li>
|
||||
<li>🍸</li>
|
||||
<li>🍹</li>
|
||||
<li>🍺</li>
|
||||
<li>🍻</li>
|
||||
<li>🍼</li>
|
||||
<li>🎀</li>
|
||||
<li>🎁</li>
|
||||
<li>🎂</li>
|
||||
<li>🎃</li>
|
||||
<li>🎄</li>
|
||||
<li>🎅</li>
|
||||
<li>🎆</li>
|
||||
<li>🎇</li>
|
||||
<li>🎈</li>
|
||||
<li>🎉</li>
|
||||
<li>🎊</li>
|
||||
<li>🎋</li>
|
||||
<li>🎌</li>
|
||||
<li>🎍</li>
|
||||
<li>🎎</li>
|
||||
<li>🎏</li>
|
||||
<li>🎐</li>
|
||||
<li>🎑</li>
|
||||
<li>🎒</li>
|
||||
<li>🎓</li>
|
||||
<li>🎠</li>
|
||||
<li>🎡</li>
|
||||
<li>🎢</li>
|
||||
<li>🎣</li>
|
||||
<li>🎤</li>
|
||||
<li>🎥</li>
|
||||
<li>🎦</li>
|
||||
<li>🎧</li>
|
||||
<li>🎨</li>
|
||||
<li>🎩</li>
|
||||
<li>🎪</li>
|
||||
<li>🎫</li>
|
||||
<li>🎬</li>
|
||||
<li>🎭</li>
|
||||
<li>🎮</li>
|
||||
<li>🎯</li>
|
||||
<li>🎰</li>
|
||||
<li>🎱</li>
|
||||
<li>🎲</li>
|
||||
<li>🎳</li>
|
||||
<li>🎴</li>
|
||||
<li>🎵</li>
|
||||
<li>🎶</li>
|
||||
<li>🎷</li>
|
||||
<li>🎸</li>
|
||||
<li>🎹</li>
|
||||
<li>🎺</li>
|
||||
<li>🎻</li>
|
||||
<li>🎼</li>
|
||||
<li>🎽</li>
|
||||
<li>🎾</li>
|
||||
<li>🎿</li>
|
||||
<li>🏀</li>
|
||||
<li>🏁</li>
|
||||
<li>🏂</li>
|
||||
<li>🏃</li>
|
||||
<li>🏄</li>
|
||||
<li>🏆</li>
|
||||
<li>🏇</li>
|
||||
<li>🏈</li>
|
||||
<li>🏉</li>
|
||||
<li>🏊</li>
|
||||
<li>🏠</li>
|
||||
<li>🏡</li>
|
||||
<li>🏢</li>
|
||||
<li>🏣</li>
|
||||
<li>🏤</li>
|
||||
<li>🏥</li>
|
||||
<li>🏦</li>
|
||||
<li>🏧</li>
|
||||
<li>🏨</li>
|
||||
<li>🏩</li>
|
||||
<li>🏪</li>
|
||||
<li>🏫</li>
|
||||
<li>🏬</li>
|
||||
<li>🏭</li>
|
||||
<li>🏮</li>
|
||||
<li>🏯</li>
|
||||
<li>🏰</li>
|
||||
<li>🐀</li>
|
||||
<li>🐁</li>
|
||||
<li>🐂</li>
|
||||
<li>🐃</li>
|
||||
<li>🐄</li>
|
||||
<li>🐅</li>
|
||||
<li>🐆</li>
|
||||
<li>🐇</li>
|
||||
<li>🐈</li>
|
||||
<li>🐉</li>
|
||||
<li>🐊</li>
|
||||
<li>🐋</li>
|
||||
<li>🐌</li>
|
||||
<li>🐍</li>
|
||||
<li>🐎</li>
|
||||
<li>🐏</li>
|
||||
<li>🐐</li>
|
||||
<li>🐑</li>
|
||||
<li>🐒</li>
|
||||
<li>🐓</li>
|
||||
<li>🐔</li>
|
||||
<li>🐕</li>
|
||||
<li>🐖</li>
|
||||
<li>🐗</li>
|
||||
<li>🐘</li>
|
||||
<li>🐙</li>
|
||||
<li>🐚</li>
|
||||
<li>🐛</li>
|
||||
<li>🐜</li>
|
||||
<li>🐝</li>
|
||||
<li>🐞</li>
|
||||
<li>🐟</li>
|
||||
<li>🐠</li>
|
||||
<li>🐡</li>
|
||||
<li>🐢</li>
|
||||
<li>🐣</li>
|
||||
<li>🐤</li>
|
||||
<li>🐥</li>
|
||||
<li>🐦</li>
|
||||
<li>🐧</li>
|
||||
<li>🐨</li>
|
||||
<li>🐩</li>
|
||||
<li>🐪</li>
|
||||
<li>🐫</li>
|
||||
<li>🐬</li>
|
||||
<li>🐭</li>
|
||||
<li>🐮</li>
|
||||
<li>🐯</li>
|
||||
<li>🐰</li>
|
||||
<li>🐱</li>
|
||||
<li>🐲</li>
|
||||
<li>🐳</li>
|
||||
<li>🐴</li>
|
||||
<li>🐵</li>
|
||||
<li>🐶</li>
|
||||
<li>🐷</li>
|
||||
<li>🐸</li>
|
||||
<li>🐹</li>
|
||||
<li>🐺</li>
|
||||
<li>🐻</li>
|
||||
<li>🐼</li>
|
||||
<li>🐽</li>
|
||||
<li>🐾</li>
|
||||
<li>👀</li>
|
||||
<li>👂</li>
|
||||
<li>👃</li>
|
||||
<li>👄</li>
|
||||
<li>👅</li>
|
||||
<li>👆</li>
|
||||
<li>👇</li>
|
||||
<li>👈</li>
|
||||
<li>👉</li>
|
||||
<li>👊</li>
|
||||
<li>👋</li>
|
||||
<li>👌</li>
|
||||
<li>👍</li>
|
||||
<li>👎</li>
|
||||
<li>👏</li>
|
||||
<li>👐</li>
|
||||
<li>👑</li>
|
||||
<li>👒</li>
|
||||
<li>👓</li>
|
||||
<li>👔</li>
|
||||
<li>👕</li>
|
||||
<li>👖</li>
|
||||
<li>👗</li>
|
||||
<li>👘</li>
|
||||
<li>👙</li>
|
||||
<li>👚</li>
|
||||
<li>👛</li>
|
||||
<li>👜</li>
|
||||
<li>👝</li>
|
||||
<li>👞</li>
|
||||
<li>👟</li>
|
||||
<li>👠</li>
|
||||
<li>👡</li>
|
||||
<li>👢</li>
|
||||
<li>👣</li>
|
||||
<li>👤</li>
|
||||
<li>👥</li>
|
||||
<li>👦</li>
|
||||
<li>👧</li>
|
||||
<li>👨</li>
|
||||
<li>👩</li>
|
||||
<li>👪</li>
|
||||
<li>👫</li>
|
||||
<li>👬</li>
|
||||
<li>👭</li>
|
||||
<li>👮</li>
|
||||
<li>👯</li>
|
||||
<li>👰</li>
|
||||
<li>👱</li>
|
||||
<li>👲</li>
|
||||
<li>👳</li>
|
||||
<li>👴</li>
|
||||
<li>👵</li>
|
||||
<li>👶</li>
|
||||
<li>👷</li>
|
||||
<li>👸</li>
|
||||
<li>👹</li>
|
||||
<li>👺</li>
|
||||
<li>👻</li>
|
||||
<li>👼</li>
|
||||
<li>👽</li>
|
||||
<li>👾</li>
|
||||
<li>👿</li>
|
||||
<li>💀</li>
|
||||
<li>💁</li>
|
||||
<li>💂</li>
|
||||
<li>💃</li>
|
||||
<li>💄</li>
|
||||
<li>💅</li>
|
||||
<li>💆</li>
|
||||
<li>💇</li>
|
||||
<li>💈</li>
|
||||
<li>💉</li>
|
||||
<li>💊</li>
|
||||
<li>💋</li>
|
||||
<li>💌</li>
|
||||
<li>💍</li>
|
||||
<li>💎</li>
|
||||
<li>💏</li>
|
||||
<li>💐</li>
|
||||
<li>💑</li>
|
||||
<li>💒</li>
|
||||
<li>💓</li>
|
||||
<li>💔</li>
|
||||
<li>💕</li>
|
||||
<li>💖</li>
|
||||
<li>💗</li>
|
||||
<li>💘</li>
|
||||
<li>💙</li>
|
||||
<li>💚</li>
|
||||
<li>💛</li>
|
||||
<li>💜</li>
|
||||
<li>💝</li>
|
||||
<li>💞</li>
|
||||
<li>💟</li>
|
||||
<li>💠</li>
|
||||
<li>💡</li>
|
||||
<li>💢</li>
|
||||
<li>💣</li>
|
||||
<li>💤</li>
|
||||
<li>💥</li>
|
||||
<li>💦</li>
|
||||
<li>💧</li>
|
||||
<li>💨</li>
|
||||
<li>💩</li>
|
||||
<li>💪</li>
|
||||
<li>💫</li>
|
||||
<li>💬</li>
|
||||
<li>💭</li>
|
||||
<li>💮</li>
|
||||
<li>💯</li>
|
||||
<li>💰</li>
|
||||
<li>💱</li>
|
||||
<li>💲</li>
|
||||
<li>💳</li>
|
||||
<li>💴</li>
|
||||
<li>💵</li>
|
||||
<li>💶</li>
|
||||
<li>💷</li>
|
||||
<li>💸</li>
|
||||
<li>💹</li>
|
||||
<li>💺</li>
|
||||
<li>💻</li>
|
||||
<li>💼</li>
|
||||
<li>💽</li>
|
||||
<li>💾</li>
|
||||
<li>💿</li>
|
||||
<li>📀</li>
|
||||
<li>📁</li>
|
||||
<li>📂</li>
|
||||
<li>📃</li>
|
||||
<li>📄</li>
|
||||
<li>📅</li>
|
||||
<li>📆</li>
|
||||
<li>📇</li>
|
||||
<li>📈</li>
|
||||
<li>📉</li>
|
||||
<li>📊</li>
|
||||
<li>📋</li>
|
||||
<li>📌</li>
|
||||
<li>📍</li>
|
||||
<li>📎</li>
|
||||
<li>📏</li>
|
||||
<li>📐</li>
|
||||
<li>📑</li>
|
||||
<li>📒</li>
|
||||
<li>📓</li>
|
||||
<li>📔</li>
|
||||
<li>📕</li>
|
||||
<li>📖</li>
|
||||
<li>📗</li>
|
||||
<li>📘</li>
|
||||
<li>📙</li>
|
||||
<li>📚</li>
|
||||
<li>📛</li>
|
||||
<li>📜</li>
|
||||
<li>📝</li>
|
||||
<li>📞</li>
|
||||
<li>📟</li>
|
||||
<li>📠</li>
|
||||
<li>📡</li>
|
||||
<li>📢</li>
|
||||
<li>📣</li>
|
||||
<li>📤</li>
|
||||
<li>📥</li>
|
||||
<li>📦</li>
|
||||
<li>📧</li>
|
||||
<li>📨</li>
|
||||
<li>📩</li>
|
||||
<li>📪</li>
|
||||
<li>📫</li>
|
||||
<li>📬</li>
|
||||
<li>📭</li>
|
||||
<li>📮</li>
|
||||
<li>📯</li>
|
||||
<li>📰</li>
|
||||
<li>📱</li>
|
||||
<li>📲</li>
|
||||
<li>📳</li>
|
||||
<li>📴</li>
|
||||
<li>📵</li>
|
||||
<li>📶</li>
|
||||
<li>📷</li>
|
||||
<li>📹</li>
|
||||
<li>📺</li>
|
||||
<li>📻</li>
|
||||
<li>📼</li>
|
||||
<li>🔀</li>
|
||||
<li>🔁</li>
|
||||
<li>🔂</li>
|
||||
<li>🔃</li>
|
||||
<li>🔄</li>
|
||||
<li>🔅</li>
|
||||
<li>🔆</li>
|
||||
<li>🔇</li>
|
||||
<li>🔈</li>
|
||||
<li>🔉</li>
|
||||
<li>🔊</li>
|
||||
<li>🔋</li>
|
||||
<li>🔌</li>
|
||||
<li>🔍</li>
|
||||
<li>🔎</li>
|
||||
<li>🔏</li>
|
||||
<li>🔐</li>
|
||||
<li>🔑</li>
|
||||
<li>🔒</li>
|
||||
<li>🔓</li>
|
||||
<li>🔔</li>
|
||||
<li>🔕</li>
|
||||
<li>🔖</li>
|
||||
<li>🔗</li>
|
||||
<li>🔘</li>
|
||||
<li>🔙</li>
|
||||
<li>🔚</li>
|
||||
<li>🔛</li>
|
||||
<li>🔜</li>
|
||||
<li>🔝</li>
|
||||
<li>🔞</li>
|
||||
<li>🔟</li>
|
||||
<li>🔠</li>
|
||||
<li>🔡</li>
|
||||
<li>🔢</li>
|
||||
<li>🔣</li>
|
||||
<li>🔤</li>
|
||||
<li>🔥</li>
|
||||
<li>🔦</li>
|
||||
<li>🔧</li>
|
||||
<li>🔨</li>
|
||||
<li>🔩</li>
|
||||
<li>🔪</li>
|
||||
<li>🔫</li>
|
||||
<li>🔬</li>
|
||||
<li>🔭</li>
|
||||
<li>🔮</li>
|
||||
<li>🔯</li>
|
||||
<li>🔰</li>
|
||||
<li>🔱</li>
|
||||
<li>🔲</li>
|
||||
<li>🔳</li>
|
||||
<li>🔴</li>
|
||||
<li>🔵</li>
|
||||
<li>🔶</li>
|
||||
<li>🔷</li>
|
||||
<li>🔸</li>
|
||||
<li>🔹</li>
|
||||
<li>🔺</li>
|
||||
<li>🔻</li>
|
||||
<li>🔼</li>
|
||||
<li>🔽</li>
|
||||
<li>🕐</li>
|
||||
<li>🕑</li>
|
||||
<li>🕒</li>
|
||||
<li>🕓</li>
|
||||
<li>🕔</li>
|
||||
<li>🕕</li>
|
||||
<li>🕖</li>
|
||||
<li>🕗</li>
|
||||
<li>🕘</li>
|
||||
<li>🕙</li>
|
||||
<li>🕚</li>
|
||||
<li>🕛</li>
|
||||
<li>🕜</li>
|
||||
<li>🕝</li>
|
||||
<li>🕞</li>
|
||||
<li>🕟</li>
|
||||
<li>🕠</li>
|
||||
<li>🕡</li>
|
||||
<li>🕢</li>
|
||||
<li>🕣</li>
|
||||
<li>🕤</li>
|
||||
<li>🕥</li>
|
||||
<li>🕦</li>
|
||||
<li>🕧</li>
|
||||
<li>🗻</li>
|
||||
<li>🗼</li>
|
||||
<li>🗽</li>
|
||||
<li>🗾</li>
|
||||
<li>🗿</li>
|
||||
<li>😀</li>
|
||||
<li>😁</li>
|
||||
<li>😂</li>
|
||||
<li>😃</li>
|
||||
<li>😄</li>
|
||||
<li>😅</li>
|
||||
<li>😆</li>
|
||||
<li>😇</li>
|
||||
<li>😈</li>
|
||||
<li>😉</li>
|
||||
<li>😊</li>
|
||||
<li>😋</li>
|
||||
<li>😌</li>
|
||||
<li>😍</li>
|
||||
<li>😎</li>
|
||||
<li>😏</li>
|
||||
<li>😐</li>
|
||||
<li>😑</li>
|
||||
<li>😒</li>
|
||||
<li>😓</li>
|
||||
<li>😔</li>
|
||||
<li>😕</li>
|
||||
<li>😖</li>
|
||||
<li>😗</li>
|
||||
<li>😘</li>
|
||||
<li>😙</li>
|
||||
<li>😚</li>
|
||||
<li>😛</li>
|
||||
<li>😜</li>
|
||||
<li>😝</li>
|
||||
<li>😞</li>
|
||||
<li>😟</li>
|
||||
<li>😠</li>
|
||||
<li>😡</li>
|
||||
<li>😢</li>
|
||||
<li>😣</li>
|
||||
<li>😤</li>
|
||||
<li>😥</li>
|
||||
<li>😦</li>
|
||||
<li>😧</li>
|
||||
<li>😨</li>
|
||||
<li>😩</li>
|
||||
<li>😪</li>
|
||||
<li>😫</li>
|
||||
<li>😬</li>
|
||||
<li>😭</li>
|
||||
<li>😮</li>
|
||||
<li>😯</li>
|
||||
<li>😰</li>
|
||||
<li>😱</li>
|
||||
<li>😲</li>
|
||||
<li>😳</li>
|
||||
<li>😴</li>
|
||||
<li>😵</li>
|
||||
<li>😶</li>
|
||||
<li>😷</li>
|
||||
<li>😸</li>
|
||||
<li>😹</li>
|
||||
<li>😺</li>
|
||||
<li>😻</li>
|
||||
<li>😼</li>
|
||||
<li>😽</li>
|
||||
<li>😾</li>
|
||||
<li>😿</li>
|
||||
<li>🙀</li>
|
||||
<li>🙁</li>
|
||||
<li>🙂</li>
|
||||
<li>🙅</li>
|
||||
<li>🙆</li>
|
||||
<li>🙇</li>
|
||||
<li>🙈</li>
|
||||
<li>🙉</li>
|
||||
<li>🙊</li>
|
||||
<li>🙋</li>
|
||||
<li>🙌</li>
|
||||
<li>🙍</li>
|
||||
<li>🙎</li>
|
||||
<li>🙏</li>
|
||||
<li>🚀</li>
|
||||
<li>🚁</li>
|
||||
<li>🚂</li>
|
||||
<li>🚃</li>
|
||||
<li>🚄</li>
|
||||
<li>🚅</li>
|
||||
<li>🚆</li>
|
||||
<li>🚇</li>
|
||||
<li>🚈</li>
|
||||
<li>🚉</li>
|
||||
<li>🚊</li>
|
||||
<li>🚋</li>
|
||||
<li>🚌</li>
|
||||
<li>🚍</li>
|
||||
<li>🚎</li>
|
||||
<li>🚏</li>
|
||||
<li>🚐</li>
|
||||
<li>🚑</li>
|
||||
<li>🚒</li>
|
||||
<li>🚓</li>
|
||||
<li>🚔</li>
|
||||
<li>🚕</li>
|
||||
<li>🚖</li>
|
||||
<li>🚗</li>
|
||||
<li>🚘</li>
|
||||
<li>🚙</li>
|
||||
<li>🚚</li>
|
||||
<li>🚛</li>
|
||||
<li>🚜</li>
|
||||
<li>🚝</li>
|
||||
<li>🚞</li>
|
||||
<li>🚟</li>
|
||||
<li>🚠</li>
|
||||
<li>🚡</li>
|
||||
<li>🚢</li>
|
||||
<li>🚣</li>
|
||||
<li>🚤</li>
|
||||
<li>🚥</li>
|
||||
<li>🚦</li>
|
||||
<li>🚧</li>
|
||||
<li>🚨</li>
|
||||
<li>🚩</li>
|
||||
<li>🚪</li>
|
||||
<li>🚫</li>
|
||||
<li>🚬</li>
|
||||
<li>🚭</li>
|
||||
<li>🚮</li>
|
||||
<li>🚯</li>
|
||||
<li>🚰</li>
|
||||
<li>🚱</li>
|
||||
<li>🚲</li>
|
||||
<li>🚳</li>
|
||||
<li>🚴</li>
|
||||
<li>🚵</li>
|
||||
<li>🚶</li>
|
||||
<li>🚷</li>
|
||||
<li>🚸</li>
|
||||
<li>🚹</li>
|
||||
<li>🚺</li>
|
||||
<li>🚻</li>
|
||||
<li>🚼</li>
|
||||
<li>🚽</li>
|
||||
<li>🚾</li>
|
||||
<li>🚿</li>
|
||||
<li>🛀</li>
|
||||
<li>🛁</li>
|
||||
<li>🛂</li>
|
||||
<li>🛃</li>
|
||||
<li>🛄</li>
|
||||
<li>🛅</li>
|
||||
<li>‼</li>
|
||||
<li>⁉</li>
|
||||
<li>™</li>
|
||||
<li>ℹ</li>
|
||||
<li>↔</li>
|
||||
<li>↕</li>
|
||||
<li>↖</li>
|
||||
<li>↗</li>
|
||||
<li>↘</li>
|
||||
<li>↙</li>
|
||||
<li>↩</li>
|
||||
<li>↪</li>
|
||||
<li>#⃣</li>
|
||||
<li>⌚</li>
|
||||
<li>⌛</li>
|
||||
<li>⏩</li>
|
||||
<li>⏪</li>
|
||||
<li>⏫</li>
|
||||
<li>⏬</li>
|
||||
<li>⏰</li>
|
||||
<li>⏳</li>
|
||||
<li>Ⓜ</li>
|
||||
<li>▪</li>
|
||||
<li>▫</li>
|
||||
<li>▶</li>
|
||||
<li>◀</li>
|
||||
<li>◻</li>
|
||||
<li>◼</li>
|
||||
<li>◽</li>
|
||||
<li>◾</li>
|
||||
<li>☀</li>
|
||||
<li>☁</li>
|
||||
<li>☎</li>
|
||||
<li>☑</li>
|
||||
<li>☔</li>
|
||||
<li>☕</li>
|
||||
<li>☝</li>
|
||||
<li>☺</li>
|
||||
<li>♈</li>
|
||||
<li>♉</li>
|
||||
<li>♊</li>
|
||||
<li>♋</li>
|
||||
<li>♌</li>
|
||||
<li>♍</li>
|
||||
<li>♎</li>
|
||||
<li>♏</li>
|
||||
<li>♐</li>
|
||||
<li>♑</li>
|
||||
<li>♒</li>
|
||||
<li>♓</li>
|
||||
<li>♠</li>
|
||||
<li>♣</li>
|
||||
<li>♥</li>
|
||||
<li>♦</li>
|
||||
<li>♨</li>
|
||||
<li>♻</li>
|
||||
<li>♿</li>
|
||||
<li>⚓</li>
|
||||
<li>⚠</li>
|
||||
<li>⚡</li>
|
||||
<li>⚪</li>
|
||||
<li>⚫</li>
|
||||
<li>⚽</li>
|
||||
<li>⚾</li>
|
||||
<li>⛄</li>
|
||||
<li>⛅</li>
|
||||
<li>⛎</li>
|
||||
<li>⛔</li>
|
||||
<li>⛪</li>
|
||||
<li>⛲</li>
|
||||
<li>⛳</li>
|
||||
<li>⛵</li>
|
||||
<li>⛺</li>
|
||||
<li>⛽</li>
|
||||
<li>✂</li>
|
||||
<li>✅</li>
|
||||
<li>✈</li>
|
||||
<li>✉</li>
|
||||
<li>✊</li>
|
||||
<li>✋</li>
|
||||
<li>✌</li>
|
||||
<li>✏</li>
|
||||
<li>✒</li>
|
||||
<li>✔</li>
|
||||
<li>✖</li>
|
||||
<li>✨</li>
|
||||
<li>✳</li>
|
||||
<li>✴</li>
|
||||
<li>❄</li>
|
||||
<li>❇</li>
|
||||
<li>❌</li>
|
||||
<li>❎</li>
|
||||
<li>❓</li>
|
||||
<li>❔</li>
|
||||
<li>❕</li>
|
||||
<li>❗</li>
|
||||
<li>❤</li>
|
||||
<li>➕</li>
|
||||
<li>➖</li>
|
||||
<li>➗</li>
|
||||
<li>➡</li>
|
||||
<li>➰</li>
|
||||
<li>➿</li>
|
||||
<li>⤴</li>
|
||||
<li>⤵</li>
|
||||
<li>⬅</li>
|
||||
<li>⬆</li>
|
||||
<li>⬇</li>
|
||||
<li>⬛</li>
|
||||
<li>⬜</li>
|
||||
<li>⭐</li>
|
||||
<li>⭕</li>
|
||||
<li>0⃣</li>
|
||||
<li>〰</li>
|
||||
<li>〽</li>
|
||||
<li>1⃣</li>
|
||||
<li>2⃣</li>
|
||||
<li>㊗</li>
|
||||
<li>㊙</li>
|
||||
<li>3⃣</li>
|
||||
<li>4⃣</li>
|
||||
<li>5⃣</li>
|
||||
<li>6⃣</li>
|
||||
<li>7⃣</li>
|
||||
<li>8⃣</li>
|
||||
<li>9⃣</li>
|
||||
<li>©</li>
|
||||
<li>®</li>
|
||||
<li></li>
|
||||
</ul>
|
||||
<script>
|
||||
var ul = document.getElementsByTagName('ul')[0];
|
||||
var total = ul.getElementsByTagName('li').length;
|
||||
var elapsed = +new Date;
|
||||
twemoji.parse(ul, {"folder":"../svg","ext":".svg","base":""});
|
||||
elapsed = (+new Date) - elapsed;
|
||||
document.body.insertBefore(
|
||||
document.createTextNode(total + ' emoji parsed in ' + elapsed + 'ms'),
|
||||
document.body.firstChild
|
||||
);
|
||||
(function (img, metaKey, i) {
|
||||
function copyToClipboard(e) {
|
||||
prompt('Copy to clipboard via ' + metaKey + '+C and Enter', this.alt);
|
||||
}
|
||||
for (i = 0; i < img.length; img[i++].onclick = copyToClipboard) {}
|
||||
}(
|
||||
document.getElementsByTagName('img'),
|
||||
/\b(?:Mac |i)OS\b/i.test(navigator.userAgent) ? 'Command' : 'Ctrl'
|
||||
));
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
928
1/test/preview.html
Normal file
928
1/test/preview.html
Normal file
|
|
@ -0,0 +1,928 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Twitter Emoji (Twemoji) Preview</title>
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<style>
|
||||
ul.emoji-list * {
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
ul.emoji-list li {
|
||||
font-size: 36px;
|
||||
float: left;
|
||||
display: inline-block;
|
||||
padding: 2px;
|
||||
margin: 4px;
|
||||
}
|
||||
img.emoji {
|
||||
cursor: pointer;
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
margin: 0 .05em 0 .1em;
|
||||
vertical-align: -0.1em;
|
||||
}
|
||||
</style>
|
||||
<script src="https://twemoji.maxcdn.com/1/twemoji.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<ul class="emoji-list">
|
||||
<li>🀄</li>
|
||||
<li>🃏</li>
|
||||
<li>🅰</li>
|
||||
<li>🅱</li>
|
||||
<li>🅾</li>
|
||||
<li>🅿</li>
|
||||
<li>🆎</li>
|
||||
<li>🆑</li>
|
||||
<li>🆒</li>
|
||||
<li>🆓</li>
|
||||
<li>🆔</li>
|
||||
<li>🆕</li>
|
||||
<li>🆖</li>
|
||||
<li>🆗</li>
|
||||
<li>🆘</li>
|
||||
<li>🆙</li>
|
||||
<li>🆚</li>
|
||||
<li>🇦</li>
|
||||
<li>🇧</li>
|
||||
<li>🇨🇳</li>
|
||||
<li>🇨</li>
|
||||
<li>🇩🇪</li>
|
||||
<li>🇩</li>
|
||||
<li>🇪🇸</li>
|
||||
<li>🇪</li>
|
||||
<li>🇫🇷</li>
|
||||
<li>🇫</li>
|
||||
<li>🇬🇧</li>
|
||||
<li>🇬</li>
|
||||
<li>🇭</li>
|
||||
<li>🇮🇹</li>
|
||||
<li>🇮</li>
|
||||
<li>🇯🇵</li>
|
||||
<li>🇯</li>
|
||||
<li>🇰🇷</li>
|
||||
<li>🇰</li>
|
||||
<li>🇱</li>
|
||||
<li>🇲</li>
|
||||
<li>🇳</li>
|
||||
<li>🇴</li>
|
||||
<li>🇵</li>
|
||||
<li>🇶</li>
|
||||
<li>🇷🇺</li>
|
||||
<li>🇷</li>
|
||||
<li>🇸</li>
|
||||
<li>🇹</li>
|
||||
<li>🇺🇸</li>
|
||||
<li>🇺</li>
|
||||
<li>🇻</li>
|
||||
<li>🇼</li>
|
||||
<li>🇽</li>
|
||||
<li>🇾</li>
|
||||
<li>🇿</li>
|
||||
<li>🈁</li>
|
||||
<li>🈂</li>
|
||||
<li>🈚</li>
|
||||
<li>🈯</li>
|
||||
<li>🈲</li>
|
||||
<li>🈳</li>
|
||||
<li>🈴</li>
|
||||
<li>🈵</li>
|
||||
<li>🈶</li>
|
||||
<li>🈷</li>
|
||||
<li>🈸</li>
|
||||
<li>🈹</li>
|
||||
<li>🈺</li>
|
||||
<li>🉐</li>
|
||||
<li>🉑</li>
|
||||
<li>🌀</li>
|
||||
<li>🌁</li>
|
||||
<li>🌂</li>
|
||||
<li>🌃</li>
|
||||
<li>🌄</li>
|
||||
<li>🌅</li>
|
||||
<li>🌆</li>
|
||||
<li>🌇</li>
|
||||
<li>🌈</li>
|
||||
<li>🌉</li>
|
||||
<li>🌊</li>
|
||||
<li>🌋</li>
|
||||
<li>🌌</li>
|
||||
<li>🌍</li>
|
||||
<li>🌎</li>
|
||||
<li>🌏</li>
|
||||
<li>🌐</li>
|
||||
<li>🌑</li>
|
||||
<li>🌒</li>
|
||||
<li>🌓</li>
|
||||
<li>🌔</li>
|
||||
<li>🌕</li>
|
||||
<li>🌖</li>
|
||||
<li>🌗</li>
|
||||
<li>🌘</li>
|
||||
<li>🌙</li>
|
||||
<li>🌚</li>
|
||||
<li>🌛</li>
|
||||
<li>🌜</li>
|
||||
<li>🌝</li>
|
||||
<li>🌞</li>
|
||||
<li>🌟</li>
|
||||
<li>🌠</li>
|
||||
<li>🌰</li>
|
||||
<li>🌱</li>
|
||||
<li>🌲</li>
|
||||
<li>🌳</li>
|
||||
<li>🌴</li>
|
||||
<li>🌵</li>
|
||||
<li>🌷</li>
|
||||
<li>🌸</li>
|
||||
<li>🌹</li>
|
||||
<li>🌺</li>
|
||||
<li>🌻</li>
|
||||
<li>🌼</li>
|
||||
<li>🌽</li>
|
||||
<li>🌾</li>
|
||||
<li>🌿</li>
|
||||
<li>🍀</li>
|
||||
<li>🍁</li>
|
||||
<li>🍂</li>
|
||||
<li>🍃</li>
|
||||
<li>🍄</li>
|
||||
<li>🍅</li>
|
||||
<li>🍆</li>
|
||||
<li>🍇</li>
|
||||
<li>🍈</li>
|
||||
<li>🍉</li>
|
||||
<li>🍊</li>
|
||||
<li>🍋</li>
|
||||
<li>🍌</li>
|
||||
<li>🍍</li>
|
||||
<li>🍎</li>
|
||||
<li>🍏</li>
|
||||
<li>🍐</li>
|
||||
<li>🍑</li>
|
||||
<li>🍒</li>
|
||||
<li>🍓</li>
|
||||
<li>🍔</li>
|
||||
<li>🍕</li>
|
||||
<li>🍖</li>
|
||||
<li>🍗</li>
|
||||
<li>🍘</li>
|
||||
<li>🍙</li>
|
||||
<li>🍚</li>
|
||||
<li>🍛</li>
|
||||
<li>🍜</li>
|
||||
<li>🍝</li>
|
||||
<li>🍞</li>
|
||||
<li>🍟</li>
|
||||
<li>🍠</li>
|
||||
<li>🍡</li>
|
||||
<li>🍢</li>
|
||||
<li>🍣</li>
|
||||
<li>🍤</li>
|
||||
<li>🍥</li>
|
||||
<li>🍦</li>
|
||||
<li>🍧</li>
|
||||
<li>🍨</li>
|
||||
<li>🍩</li>
|
||||
<li>🍪</li>
|
||||
<li>🍫</li>
|
||||
<li>🍬</li>
|
||||
<li>🍭</li>
|
||||
<li>🍮</li>
|
||||
<li>🍯</li>
|
||||
<li>🍰</li>
|
||||
<li>🍱</li>
|
||||
<li>🍲</li>
|
||||
<li>🍳</li>
|
||||
<li>🍴</li>
|
||||
<li>🍵</li>
|
||||
<li>🍶</li>
|
||||
<li>🍷</li>
|
||||
<li>🍸</li>
|
||||
<li>🍹</li>
|
||||
<li>🍺</li>
|
||||
<li>🍻</li>
|
||||
<li>🍼</li>
|
||||
<li>🎀</li>
|
||||
<li>🎁</li>
|
||||
<li>🎂</li>
|
||||
<li>🎃</li>
|
||||
<li>🎄</li>
|
||||
<li>🎅</li>
|
||||
<li>🎆</li>
|
||||
<li>🎇</li>
|
||||
<li>🎈</li>
|
||||
<li>🎉</li>
|
||||
<li>🎊</li>
|
||||
<li>🎋</li>
|
||||
<li>🎌</li>
|
||||
<li>🎍</li>
|
||||
<li>🎎</li>
|
||||
<li>🎏</li>
|
||||
<li>🎐</li>
|
||||
<li>🎑</li>
|
||||
<li>🎒</li>
|
||||
<li>🎓</li>
|
||||
<li>🎠</li>
|
||||
<li>🎡</li>
|
||||
<li>🎢</li>
|
||||
<li>🎣</li>
|
||||
<li>🎤</li>
|
||||
<li>🎥</li>
|
||||
<li>🎦</li>
|
||||
<li>🎧</li>
|
||||
<li>🎨</li>
|
||||
<li>🎩</li>
|
||||
<li>🎪</li>
|
||||
<li>🎫</li>
|
||||
<li>🎬</li>
|
||||
<li>🎭</li>
|
||||
<li>🎮</li>
|
||||
<li>🎯</li>
|
||||
<li>🎰</li>
|
||||
<li>🎱</li>
|
||||
<li>🎲</li>
|
||||
<li>🎳</li>
|
||||
<li>🎴</li>
|
||||
<li>🎵</li>
|
||||
<li>🎶</li>
|
||||
<li>🎷</li>
|
||||
<li>🎸</li>
|
||||
<li>🎹</li>
|
||||
<li>🎺</li>
|
||||
<li>🎻</li>
|
||||
<li>🎼</li>
|
||||
<li>🎽</li>
|
||||
<li>🎾</li>
|
||||
<li>🎿</li>
|
||||
<li>🏀</li>
|
||||
<li>🏁</li>
|
||||
<li>🏂</li>
|
||||
<li>🏃</li>
|
||||
<li>🏄</li>
|
||||
<li>🏆</li>
|
||||
<li>🏇</li>
|
||||
<li>🏈</li>
|
||||
<li>🏉</li>
|
||||
<li>🏊</li>
|
||||
<li>🏠</li>
|
||||
<li>🏡</li>
|
||||
<li>🏢</li>
|
||||
<li>🏣</li>
|
||||
<li>🏤</li>
|
||||
<li>🏥</li>
|
||||
<li>🏦</li>
|
||||
<li>🏧</li>
|
||||
<li>🏨</li>
|
||||
<li>🏩</li>
|
||||
<li>🏪</li>
|
||||
<li>🏫</li>
|
||||
<li>🏬</li>
|
||||
<li>🏭</li>
|
||||
<li>🏮</li>
|
||||
<li>🏯</li>
|
||||
<li>🏰</li>
|
||||
<li>🐀</li>
|
||||
<li>🐁</li>
|
||||
<li>🐂</li>
|
||||
<li>🐃</li>
|
||||
<li>🐄</li>
|
||||
<li>🐅</li>
|
||||
<li>🐆</li>
|
||||
<li>🐇</li>
|
||||
<li>🐈</li>
|
||||
<li>🐉</li>
|
||||
<li>🐊</li>
|
||||
<li>🐋</li>
|
||||
<li>🐌</li>
|
||||
<li>🐍</li>
|
||||
<li>🐎</li>
|
||||
<li>🐏</li>
|
||||
<li>🐐</li>
|
||||
<li>🐑</li>
|
||||
<li>🐒</li>
|
||||
<li>🐓</li>
|
||||
<li>🐔</li>
|
||||
<li>🐕</li>
|
||||
<li>🐖</li>
|
||||
<li>🐗</li>
|
||||
<li>🐘</li>
|
||||
<li>🐙</li>
|
||||
<li>🐚</li>
|
||||
<li>🐛</li>
|
||||
<li>🐜</li>
|
||||
<li>🐝</li>
|
||||
<li>🐞</li>
|
||||
<li>🐟</li>
|
||||
<li>🐠</li>
|
||||
<li>🐡</li>
|
||||
<li>🐢</li>
|
||||
<li>🐣</li>
|
||||
<li>🐤</li>
|
||||
<li>🐥</li>
|
||||
<li>🐦</li>
|
||||
<li>🐧</li>
|
||||
<li>🐨</li>
|
||||
<li>🐩</li>
|
||||
<li>🐪</li>
|
||||
<li>🐫</li>
|
||||
<li>🐬</li>
|
||||
<li>🐭</li>
|
||||
<li>🐮</li>
|
||||
<li>🐯</li>
|
||||
<li>🐰</li>
|
||||
<li>🐱</li>
|
||||
<li>🐲</li>
|
||||
<li>🐳</li>
|
||||
<li>🐴</li>
|
||||
<li>🐵</li>
|
||||
<li>🐶</li>
|
||||
<li>🐷</li>
|
||||
<li>🐸</li>
|
||||
<li>🐹</li>
|
||||
<li>🐺</li>
|
||||
<li>🐻</li>
|
||||
<li>🐼</li>
|
||||
<li>🐽</li>
|
||||
<li>🐾</li>
|
||||
<li>👀</li>
|
||||
<li>👂</li>
|
||||
<li>👃</li>
|
||||
<li>👄</li>
|
||||
<li>👅</li>
|
||||
<li>👆</li>
|
||||
<li>👇</li>
|
||||
<li>👈</li>
|
||||
<li>👉</li>
|
||||
<li>👊</li>
|
||||
<li>👋</li>
|
||||
<li>👌</li>
|
||||
<li>👍</li>
|
||||
<li>👎</li>
|
||||
<li>👏</li>
|
||||
<li>👐</li>
|
||||
<li>👑</li>
|
||||
<li>👒</li>
|
||||
<li>👓</li>
|
||||
<li>👔</li>
|
||||
<li>👕</li>
|
||||
<li>👖</li>
|
||||
<li>👗</li>
|
||||
<li>👘</li>
|
||||
<li>👙</li>
|
||||
<li>👚</li>
|
||||
<li>👛</li>
|
||||
<li>👜</li>
|
||||
<li>👝</li>
|
||||
<li>👞</li>
|
||||
<li>👟</li>
|
||||
<li>👠</li>
|
||||
<li>👡</li>
|
||||
<li>👢</li>
|
||||
<li>👣</li>
|
||||
<li>👤</li>
|
||||
<li>👥</li>
|
||||
<li>👦</li>
|
||||
<li>👧</li>
|
||||
<li>👨</li>
|
||||
<li>👩</li>
|
||||
<li>👪</li>
|
||||
<li>👫</li>
|
||||
<li>👬</li>
|
||||
<li>👭</li>
|
||||
<li>👮</li>
|
||||
<li>👯</li>
|
||||
<li>👰</li>
|
||||
<li>👱</li>
|
||||
<li>👲</li>
|
||||
<li>👳</li>
|
||||
<li>👴</li>
|
||||
<li>👵</li>
|
||||
<li>👶</li>
|
||||
<li>👷</li>
|
||||
<li>👸</li>
|
||||
<li>👹</li>
|
||||
<li>👺</li>
|
||||
<li>👻</li>
|
||||
<li>👼</li>
|
||||
<li>👽</li>
|
||||
<li>👾</li>
|
||||
<li>👿</li>
|
||||
<li>💀</li>
|
||||
<li>💁</li>
|
||||
<li>💂</li>
|
||||
<li>💃</li>
|
||||
<li>💄</li>
|
||||
<li>💅</li>
|
||||
<li>💆</li>
|
||||
<li>💇</li>
|
||||
<li>💈</li>
|
||||
<li>💉</li>
|
||||
<li>💊</li>
|
||||
<li>💋</li>
|
||||
<li>💌</li>
|
||||
<li>💍</li>
|
||||
<li>💎</li>
|
||||
<li>💏</li>
|
||||
<li>💐</li>
|
||||
<li>💑</li>
|
||||
<li>💒</li>
|
||||
<li>💓</li>
|
||||
<li>💔</li>
|
||||
<li>💕</li>
|
||||
<li>💖</li>
|
||||
<li>💗</li>
|
||||
<li>💘</li>
|
||||
<li>💙</li>
|
||||
<li>💚</li>
|
||||
<li>💛</li>
|
||||
<li>💜</li>
|
||||
<li>💝</li>
|
||||
<li>💞</li>
|
||||
<li>💟</li>
|
||||
<li>💠</li>
|
||||
<li>💡</li>
|
||||
<li>💢</li>
|
||||
<li>💣</li>
|
||||
<li>💤</li>
|
||||
<li>💥</li>
|
||||
<li>💦</li>
|
||||
<li>💧</li>
|
||||
<li>💨</li>
|
||||
<li>💩</li>
|
||||
<li>💪</li>
|
||||
<li>💫</li>
|
||||
<li>💬</li>
|
||||
<li>💭</li>
|
||||
<li>💮</li>
|
||||
<li>💯</li>
|
||||
<li>💰</li>
|
||||
<li>💱</li>
|
||||
<li>💲</li>
|
||||
<li>💳</li>
|
||||
<li>💴</li>
|
||||
<li>💵</li>
|
||||
<li>💶</li>
|
||||
<li>💷</li>
|
||||
<li>💸</li>
|
||||
<li>💹</li>
|
||||
<li>💺</li>
|
||||
<li>💻</li>
|
||||
<li>💼</li>
|
||||
<li>💽</li>
|
||||
<li>💾</li>
|
||||
<li>💿</li>
|
||||
<li>📀</li>
|
||||
<li>📁</li>
|
||||
<li>📂</li>
|
||||
<li>📃</li>
|
||||
<li>📄</li>
|
||||
<li>📅</li>
|
||||
<li>📆</li>
|
||||
<li>📇</li>
|
||||
<li>📈</li>
|
||||
<li>📉</li>
|
||||
<li>📊</li>
|
||||
<li>📋</li>
|
||||
<li>📌</li>
|
||||
<li>📍</li>
|
||||
<li>📎</li>
|
||||
<li>📏</li>
|
||||
<li>📐</li>
|
||||
<li>📑</li>
|
||||
<li>📒</li>
|
||||
<li>📓</li>
|
||||
<li>📔</li>
|
||||
<li>📕</li>
|
||||
<li>📖</li>
|
||||
<li>📗</li>
|
||||
<li>📘</li>
|
||||
<li>📙</li>
|
||||
<li>📚</li>
|
||||
<li>📛</li>
|
||||
<li>📜</li>
|
||||
<li>📝</li>
|
||||
<li>📞</li>
|
||||
<li>📟</li>
|
||||
<li>📠</li>
|
||||
<li>📡</li>
|
||||
<li>📢</li>
|
||||
<li>📣</li>
|
||||
<li>📤</li>
|
||||
<li>📥</li>
|
||||
<li>📦</li>
|
||||
<li>📧</li>
|
||||
<li>📨</li>
|
||||
<li>📩</li>
|
||||
<li>📪</li>
|
||||
<li>📫</li>
|
||||
<li>📬</li>
|
||||
<li>📭</li>
|
||||
<li>📮</li>
|
||||
<li>📯</li>
|
||||
<li>📰</li>
|
||||
<li>📱</li>
|
||||
<li>📲</li>
|
||||
<li>📳</li>
|
||||
<li>📴</li>
|
||||
<li>📵</li>
|
||||
<li>📶</li>
|
||||
<li>📷</li>
|
||||
<li>📹</li>
|
||||
<li>📺</li>
|
||||
<li>📻</li>
|
||||
<li>📼</li>
|
||||
<li>🔀</li>
|
||||
<li>🔁</li>
|
||||
<li>🔂</li>
|
||||
<li>🔃</li>
|
||||
<li>🔄</li>
|
||||
<li>🔅</li>
|
||||
<li>🔆</li>
|
||||
<li>🔇</li>
|
||||
<li>🔈</li>
|
||||
<li>🔉</li>
|
||||
<li>🔊</li>
|
||||
<li>🔋</li>
|
||||
<li>🔌</li>
|
||||
<li>🔍</li>
|
||||
<li>🔎</li>
|
||||
<li>🔏</li>
|
||||
<li>🔐</li>
|
||||
<li>🔑</li>
|
||||
<li>🔒</li>
|
||||
<li>🔓</li>
|
||||
<li>🔔</li>
|
||||
<li>🔕</li>
|
||||
<li>🔖</li>
|
||||
<li>🔗</li>
|
||||
<li>🔘</li>
|
||||
<li>🔙</li>
|
||||
<li>🔚</li>
|
||||
<li>🔛</li>
|
||||
<li>🔜</li>
|
||||
<li>🔝</li>
|
||||
<li>🔞</li>
|
||||
<li>🔟</li>
|
||||
<li>🔠</li>
|
||||
<li>🔡</li>
|
||||
<li>🔢</li>
|
||||
<li>🔣</li>
|
||||
<li>🔤</li>
|
||||
<li>🔥</li>
|
||||
<li>🔦</li>
|
||||
<li>🔧</li>
|
||||
<li>🔨</li>
|
||||
<li>🔩</li>
|
||||
<li>🔪</li>
|
||||
<li>🔫</li>
|
||||
<li>🔬</li>
|
||||
<li>🔭</li>
|
||||
<li>🔮</li>
|
||||
<li>🔯</li>
|
||||
<li>🔰</li>
|
||||
<li>🔱</li>
|
||||
<li>🔲</li>
|
||||
<li>🔳</li>
|
||||
<li>🔴</li>
|
||||
<li>🔵</li>
|
||||
<li>🔶</li>
|
||||
<li>🔷</li>
|
||||
<li>🔸</li>
|
||||
<li>🔹</li>
|
||||
<li>🔺</li>
|
||||
<li>🔻</li>
|
||||
<li>🔼</li>
|
||||
<li>🔽</li>
|
||||
<li>🕐</li>
|
||||
<li>🕑</li>
|
||||
<li>🕒</li>
|
||||
<li>🕓</li>
|
||||
<li>🕔</li>
|
||||
<li>🕕</li>
|
||||
<li>🕖</li>
|
||||
<li>🕗</li>
|
||||
<li>🕘</li>
|
||||
<li>🕙</li>
|
||||
<li>🕚</li>
|
||||
<li>🕛</li>
|
||||
<li>🕜</li>
|
||||
<li>🕝</li>
|
||||
<li>🕞</li>
|
||||
<li>🕟</li>
|
||||
<li>🕠</li>
|
||||
<li>🕡</li>
|
||||
<li>🕢</li>
|
||||
<li>🕣</li>
|
||||
<li>🕤</li>
|
||||
<li>🕥</li>
|
||||
<li>🕦</li>
|
||||
<li>🕧</li>
|
||||
<li>🗻</li>
|
||||
<li>🗼</li>
|
||||
<li>🗽</li>
|
||||
<li>🗾</li>
|
||||
<li>🗿</li>
|
||||
<li>😀</li>
|
||||
<li>😁</li>
|
||||
<li>😂</li>
|
||||
<li>😃</li>
|
||||
<li>😄</li>
|
||||
<li>😅</li>
|
||||
<li>😆</li>
|
||||
<li>😇</li>
|
||||
<li>😈</li>
|
||||
<li>😉</li>
|
||||
<li>😊</li>
|
||||
<li>😋</li>
|
||||
<li>😌</li>
|
||||
<li>😍</li>
|
||||
<li>😎</li>
|
||||
<li>😏</li>
|
||||
<li>😐</li>
|
||||
<li>😑</li>
|
||||
<li>😒</li>
|
||||
<li>😓</li>
|
||||
<li>😔</li>
|
||||
<li>😕</li>
|
||||
<li>😖</li>
|
||||
<li>😗</li>
|
||||
<li>😘</li>
|
||||
<li>😙</li>
|
||||
<li>😚</li>
|
||||
<li>😛</li>
|
||||
<li>😜</li>
|
||||
<li>😝</li>
|
||||
<li>😞</li>
|
||||
<li>😟</li>
|
||||
<li>😠</li>
|
||||
<li>😡</li>
|
||||
<li>😢</li>
|
||||
<li>😣</li>
|
||||
<li>😤</li>
|
||||
<li>😥</li>
|
||||
<li>😦</li>
|
||||
<li>😧</li>
|
||||
<li>😨</li>
|
||||
<li>😩</li>
|
||||
<li>😪</li>
|
||||
<li>😫</li>
|
||||
<li>😬</li>
|
||||
<li>😭</li>
|
||||
<li>😮</li>
|
||||
<li>😯</li>
|
||||
<li>😰</li>
|
||||
<li>😱</li>
|
||||
<li>😲</li>
|
||||
<li>😳</li>
|
||||
<li>😴</li>
|
||||
<li>😵</li>
|
||||
<li>😶</li>
|
||||
<li>😷</li>
|
||||
<li>😸</li>
|
||||
<li>😹</li>
|
||||
<li>😺</li>
|
||||
<li>😻</li>
|
||||
<li>😼</li>
|
||||
<li>😽</li>
|
||||
<li>😾</li>
|
||||
<li>😿</li>
|
||||
<li>🙀</li>
|
||||
<li>🙁</li>
|
||||
<li>🙂</li>
|
||||
<li>🙅</li>
|
||||
<li>🙆</li>
|
||||
<li>🙇</li>
|
||||
<li>🙈</li>
|
||||
<li>🙉</li>
|
||||
<li>🙊</li>
|
||||
<li>🙋</li>
|
||||
<li>🙌</li>
|
||||
<li>🙍</li>
|
||||
<li>🙎</li>
|
||||
<li>🙏</li>
|
||||
<li>🚀</li>
|
||||
<li>🚁</li>
|
||||
<li>🚂</li>
|
||||
<li>🚃</li>
|
||||
<li>🚄</li>
|
||||
<li>🚅</li>
|
||||
<li>🚆</li>
|
||||
<li>🚇</li>
|
||||
<li>🚈</li>
|
||||
<li>🚉</li>
|
||||
<li>🚊</li>
|
||||
<li>🚋</li>
|
||||
<li>🚌</li>
|
||||
<li>🚍</li>
|
||||
<li>🚎</li>
|
||||
<li>🚏</li>
|
||||
<li>🚐</li>
|
||||
<li>🚑</li>
|
||||
<li>🚒</li>
|
||||
<li>🚓</li>
|
||||
<li>🚔</li>
|
||||
<li>🚕</li>
|
||||
<li>🚖</li>
|
||||
<li>🚗</li>
|
||||
<li>🚘</li>
|
||||
<li>🚙</li>
|
||||
<li>🚚</li>
|
||||
<li>🚛</li>
|
||||
<li>🚜</li>
|
||||
<li>🚝</li>
|
||||
<li>🚞</li>
|
||||
<li>🚟</li>
|
||||
<li>🚠</li>
|
||||
<li>🚡</li>
|
||||
<li>🚢</li>
|
||||
<li>🚣</li>
|
||||
<li>🚤</li>
|
||||
<li>🚥</li>
|
||||
<li>🚦</li>
|
||||
<li>🚧</li>
|
||||
<li>🚨</li>
|
||||
<li>🚩</li>
|
||||
<li>🚪</li>
|
||||
<li>🚫</li>
|
||||
<li>🚬</li>
|
||||
<li>🚭</li>
|
||||
<li>🚮</li>
|
||||
<li>🚯</li>
|
||||
<li>🚰</li>
|
||||
<li>🚱</li>
|
||||
<li>🚲</li>
|
||||
<li>🚳</li>
|
||||
<li>🚴</li>
|
||||
<li>🚵</li>
|
||||
<li>🚶</li>
|
||||
<li>🚷</li>
|
||||
<li>🚸</li>
|
||||
<li>🚹</li>
|
||||
<li>🚺</li>
|
||||
<li>🚻</li>
|
||||
<li>🚼</li>
|
||||
<li>🚽</li>
|
||||
<li>🚾</li>
|
||||
<li>🚿</li>
|
||||
<li>🛀</li>
|
||||
<li>🛁</li>
|
||||
<li>🛂</li>
|
||||
<li>🛃</li>
|
||||
<li>🛄</li>
|
||||
<li>🛅</li>
|
||||
<li>‼</li>
|
||||
<li>⁉</li>
|
||||
<li>™</li>
|
||||
<li>ℹ</li>
|
||||
<li>↔</li>
|
||||
<li>↕</li>
|
||||
<li>↖</li>
|
||||
<li>↗</li>
|
||||
<li>↘</li>
|
||||
<li>↙</li>
|
||||
<li>↩</li>
|
||||
<li>↪</li>
|
||||
<li>#⃣</li>
|
||||
<li>⌚</li>
|
||||
<li>⌛</li>
|
||||
<li>⏩</li>
|
||||
<li>⏪</li>
|
||||
<li>⏫</li>
|
||||
<li>⏬</li>
|
||||
<li>⏰</li>
|
||||
<li>⏳</li>
|
||||
<li>Ⓜ</li>
|
||||
<li>▪</li>
|
||||
<li>▫</li>
|
||||
<li>▶</li>
|
||||
<li>◀</li>
|
||||
<li>◻</li>
|
||||
<li>◼</li>
|
||||
<li>◽</li>
|
||||
<li>◾</li>
|
||||
<li>☀</li>
|
||||
<li>☁</li>
|
||||
<li>☎</li>
|
||||
<li>☑</li>
|
||||
<li>☔</li>
|
||||
<li>☕</li>
|
||||
<li>☝</li>
|
||||
<li>☺</li>
|
||||
<li>♈</li>
|
||||
<li>♉</li>
|
||||
<li>♊</li>
|
||||
<li>♋</li>
|
||||
<li>♌</li>
|
||||
<li>♍</li>
|
||||
<li>♎</li>
|
||||
<li>♏</li>
|
||||
<li>♐</li>
|
||||
<li>♑</li>
|
||||
<li>♒</li>
|
||||
<li>♓</li>
|
||||
<li>♠</li>
|
||||
<li>♣</li>
|
||||
<li>♥</li>
|
||||
<li>♦</li>
|
||||
<li>♨</li>
|
||||
<li>♻</li>
|
||||
<li>♿</li>
|
||||
<li>⚓</li>
|
||||
<li>⚠</li>
|
||||
<li>⚡</li>
|
||||
<li>⚪</li>
|
||||
<li>⚫</li>
|
||||
<li>⚽</li>
|
||||
<li>⚾</li>
|
||||
<li>⛄</li>
|
||||
<li>⛅</li>
|
||||
<li>⛎</li>
|
||||
<li>⛔</li>
|
||||
<li>⛪</li>
|
||||
<li>⛲</li>
|
||||
<li>⛳</li>
|
||||
<li>⛵</li>
|
||||
<li>⛺</li>
|
||||
<li>⛽</li>
|
||||
<li>✂</li>
|
||||
<li>✅</li>
|
||||
<li>✈</li>
|
||||
<li>✉</li>
|
||||
<li>✊</li>
|
||||
<li>✋</li>
|
||||
<li>✌</li>
|
||||
<li>✏</li>
|
||||
<li>✒</li>
|
||||
<li>✔</li>
|
||||
<li>✖</li>
|
||||
<li>✨</li>
|
||||
<li>✳</li>
|
||||
<li>✴</li>
|
||||
<li>❄</li>
|
||||
<li>❇</li>
|
||||
<li>❌</li>
|
||||
<li>❎</li>
|
||||
<li>❓</li>
|
||||
<li>❔</li>
|
||||
<li>❕</li>
|
||||
<li>❗</li>
|
||||
<li>❤</li>
|
||||
<li>➕</li>
|
||||
<li>➖</li>
|
||||
<li>➗</li>
|
||||
<li>➡</li>
|
||||
<li>➰</li>
|
||||
<li>➿</li>
|
||||
<li>⤴</li>
|
||||
<li>⤵</li>
|
||||
<li>⬅</li>
|
||||
<li>⬆</li>
|
||||
<li>⬇</li>
|
||||
<li>⬛</li>
|
||||
<li>⬜</li>
|
||||
<li>⭐</li>
|
||||
<li>⭕</li>
|
||||
<li>0⃣</li>
|
||||
<li>〰</li>
|
||||
<li>〽</li>
|
||||
<li>1⃣</li>
|
||||
<li>2⃣</li>
|
||||
<li>㊗</li>
|
||||
<li>㊙</li>
|
||||
<li>3⃣</li>
|
||||
<li>4⃣</li>
|
||||
<li>5⃣</li>
|
||||
<li>6⃣</li>
|
||||
<li>7⃣</li>
|
||||
<li>8⃣</li>
|
||||
<li>9⃣</li>
|
||||
<li>©</li>
|
||||
<li>®</li>
|
||||
<li></li>
|
||||
</ul>
|
||||
<script>
|
||||
var ul = document.getElementsByTagName('ul')[0];
|
||||
var total = ul.getElementsByTagName('li').length;
|
||||
var elapsed = +new Date;
|
||||
twemoji.parse(ul, {"size":72});
|
||||
elapsed = (+new Date) - elapsed;
|
||||
document.body.insertBefore(
|
||||
document.createTextNode(total + ' emoji parsed in ' + elapsed + 'ms'),
|
||||
document.body.firstChild
|
||||
);
|
||||
(function (img, metaKey, i) {
|
||||
function copyToClipboard(e) {
|
||||
prompt('Copy to clipboard via ' + metaKey + '+C and Enter', this.alt);
|
||||
}
|
||||
for (i = 0; i < img.length; img[i++].onclick = copyToClipboard) {}
|
||||
}(
|
||||
document.getElementsByTagName('img'),
|
||||
/\b(?:Mac |i)OS\b/i.test(navigator.userAgent) ? 'Command' : 'Ctrl'
|
||||
));
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
569
1/twemoji.amd.js
Normal file
569
1/twemoji.amd.js
Normal file
|
|
@ -0,0 +1,569 @@
|
|||
define(function () {
|
||||
/*jslint indent: 2, browser: true, bitwise: true, plusplus: true */
|
||||
var twemoji = (function (
|
||||
/*! Copyright Twitter Inc. and other contributors. Licensed under MIT *//*
|
||||
https://github.com/twitter/twemoji/blob/gh-pages/LICENSE
|
||||
*/
|
||||
|
||||
// WARNING: this file is generated automatically via
|
||||
// `node twemoji-generator.js`
|
||||
// please update its `createTwemoji` function
|
||||
// at the bottom of the same file instead.
|
||||
|
||||
) {
|
||||
'use strict';
|
||||
|
||||
/*jshint maxparams:4 */
|
||||
|
||||
var
|
||||
// the exported module object
|
||||
twemoji = {
|
||||
|
||||
|
||||
/////////////////////////
|
||||
// properties //
|
||||
/////////////////////////
|
||||
|
||||
// default assets url, by default will be Twitter Inc. CDN
|
||||
base: 'https://twemoji.maxcdn.com/1/',
|
||||
|
||||
// default assets file extensions, by default '.png'
|
||||
ext: '.png',
|
||||
|
||||
// default assets/folder size, by default "72x72"
|
||||
// available via Twitter CDN: 72
|
||||
size: '72x72',
|
||||
|
||||
// default class name, by default 'emoji'
|
||||
className: 'emoji',
|
||||
|
||||
// basic utilities / helpers to convert code points
|
||||
// to JavaScript surrogates and vice versa
|
||||
convert: {
|
||||
|
||||
/**
|
||||
* Given an HEX codepoint, returns UTF16 surrogate pairs.
|
||||
*
|
||||
* @param string generic codepoint, i.e. '1F4A9'
|
||||
* @return string codepoint transformed into utf16 surrogates pair,
|
||||
* i.e. \uD83D\uDCA9
|
||||
*
|
||||
* @example
|
||||
* twemoji.convert.fromCodePoint('1f1e8');
|
||||
* // "\ud83c\udde8"
|
||||
*
|
||||
* '1f1e8-1f1f3'.split('-').map(twemoji.convert.fromCodePoint).join('')
|
||||
* // "\ud83c\udde8\ud83c\uddf3"
|
||||
*/
|
||||
fromCodePoint: fromCodePoint,
|
||||
|
||||
/**
|
||||
* Given UTF16 surrogate pairs, returns the equivalent HEX codepoint.
|
||||
*
|
||||
* @param string generic utf16 surrogates pair, i.e. \uD83D\uDCA9
|
||||
* @param string optional separator for double code points, default='-'
|
||||
* @return string utf16 transformed into codepoint, i.e. '1F4A9'
|
||||
*
|
||||
* @example
|
||||
* twemoji.convert.toCodePoint('\ud83c\udde8\ud83c\uddf3');
|
||||
* // "1f1e8-1f1f3"
|
||||
*
|
||||
* twemoji.convert.toCodePoint('\ud83c\udde8\ud83c\uddf3', '~');
|
||||
* // "1f1e8~1f1f3"
|
||||
*/
|
||||
toCodePoint: toCodePoint
|
||||
},
|
||||
|
||||
|
||||
/////////////////////////
|
||||
// methods //
|
||||
/////////////////////////
|
||||
|
||||
/**
|
||||
* User first: used to remove missing images
|
||||
* preserving the original text intent when
|
||||
* a fallback for network problems is desired.
|
||||
* Automatically added to Image nodes via DOM
|
||||
* It could be recycled for string operations via:
|
||||
* $('img.emoji').on('error', twemoji.onerror)
|
||||
*/
|
||||
onerror: function onerror() {
|
||||
if (this.parentNode) {
|
||||
this.parentNode.replaceChild(createText(this.alt), this);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Main method/logic to generate either <img> tags or HTMLImage nodes.
|
||||
* "emojify" a generic text or DOM Element.
|
||||
*
|
||||
* @overloads
|
||||
*
|
||||
* String replacement for `innerHTML` or server side operations
|
||||
* twemoji.parse(string);
|
||||
* twemoji.parse(string, Function);
|
||||
* twemoji.parse(string, Object);
|
||||
*
|
||||
* HTMLElement tree parsing for safer operations over existing DOM
|
||||
* twemoji.parse(HTMLElement);
|
||||
* twemoji.parse(HTMLElement, Function);
|
||||
* twemoji.parse(HTMLElement, Object);
|
||||
*
|
||||
* @param string|HTMLElement the source to parse and enrich with emoji.
|
||||
*
|
||||
* string replace emoji matches with <img> tags.
|
||||
* Mainly used to inject emoji via `innerHTML`
|
||||
* It does **not** parse the string or validate it,
|
||||
* it simply replaces found emoji with a tag.
|
||||
* NOTE: be sure this won't affect security.
|
||||
*
|
||||
* HTMLElement walk through the DOM tree and find emoji
|
||||
* that are inside **text node only** (nodeType === 3)
|
||||
* Mainly used to put emoji in already generated DOM
|
||||
* without compromising surrounding nodes and
|
||||
* **avoiding** the usage of `innerHTML`.
|
||||
* NOTE: Using DOM elements instead of strings should
|
||||
* improve security without compromising too much
|
||||
* performance compared with a less safe `innerHTML`.
|
||||
*
|
||||
* @param Function|Object [optional]
|
||||
* either the callback that will be invoked or an object
|
||||
* with all properties to use per each found emoji.
|
||||
*
|
||||
* Function if specified, this will be invoked per each emoji
|
||||
* that has been found through the RegExp except
|
||||
* those follwed by the invariant \uFE0E ("as text").
|
||||
* Once invoked, parameters will be:
|
||||
*
|
||||
* iconId:string the lower case HEX code point
|
||||
* i.e. "1f4a9"
|
||||
*
|
||||
* options:Object all info for this parsing operation
|
||||
*
|
||||
* variant:char the optional \uFE0F ("as image")
|
||||
* variant, in case this info
|
||||
* is anyhow meaningful.
|
||||
* By default this is ignored.
|
||||
*
|
||||
* If such callback will return a falsy value instead
|
||||
* of a valid `src` to use for the image, nothing will
|
||||
* actually change for that specific emoji.
|
||||
*
|
||||
*
|
||||
* Object if specified, an object containing the following properties
|
||||
*
|
||||
* callback Function the callback to invoke per each found emoji.
|
||||
* base string the base url, by default twemoji.base
|
||||
* ext string the image extension, by default twemoji.ext
|
||||
* size string the assets size, by default twemoji.size
|
||||
*
|
||||
* @example
|
||||
*
|
||||
* twemoji.parse("I \u2764\uFE0F emoji!");
|
||||
* // I <img class="emoji" draggable="false" alt="❤️" src="/assets/2764.gif"> emoji!
|
||||
*
|
||||
*
|
||||
* twemoji.parse("I \u2764\uFE0F emoji!", function(iconId, options) {
|
||||
* return '/assets/' + iconId + '.gif';
|
||||
* });
|
||||
* // I <img class="emoji" draggable="false" alt="❤️" src="/assets/2764.gif"> emoji!
|
||||
*
|
||||
*
|
||||
* twemoji.parse("I \u2764\uFE0F emoji!", {
|
||||
* size: 72,
|
||||
* callback: function(iconId, options) {
|
||||
* return '/assets/' + options.size + '/' + iconId + options.ext;
|
||||
* }
|
||||
* });
|
||||
* // I <img class="emoji" draggable="false" alt="❤️" src="/assets/72x72/2764.png"> emoji!
|
||||
*
|
||||
*/
|
||||
parse: parse,
|
||||
|
||||
/**
|
||||
* Given a string, invokes the callback argument
|
||||
* per each emoji found in such string.
|
||||
* This is the most raw version used by
|
||||
* the .parse(string) method itself.
|
||||
*
|
||||
* @param string generic string to parse
|
||||
* @param Function a generic callback that will be
|
||||
* invoked to replace the content.
|
||||
* This calback wil receive standard
|
||||
* String.prototype.replace(str, callback)
|
||||
* arguments such:
|
||||
* callback(
|
||||
* rawText, // the emoji match
|
||||
* );
|
||||
*
|
||||
* and others commonly received via replace.
|
||||
*/
|
||||
replace: replace,
|
||||
|
||||
/**
|
||||
* Simplify string tests against emoji.
|
||||
*
|
||||
* @param string some text that might contain emoji
|
||||
* @return boolean true if any emoji was found, false otherwise.
|
||||
*
|
||||
* @example
|
||||
*
|
||||
* if (twemoji.test(someContent)) {
|
||||
* console.log("emoji All The Things!");
|
||||
* }
|
||||
*/
|
||||
test: test
|
||||
},
|
||||
|
||||
// used to escape HTML special chars in attributes
|
||||
escaper = {
|
||||
'&': '&',
|
||||
'<': '<',
|
||||
'>': '>',
|
||||
"'": ''',
|
||||
'"': '"'
|
||||
},
|
||||
|
||||
// RegExp based on emoji's official Unicode standards
|
||||
// http://www.unicode.org/Public/UNIDATA/EmojiSources.txt
|
||||
re = /(?:[\u0039\u0038\u0037\u0036\u0035\u0034\u0033\u0032\u0031\u0030\u0023])\ufe0f?\u20e3|\ud83c\udde8\ud83c\uddf3|\ud83c\udde9\ud83c\uddea|\ud83c\uddea\ud83c\uddf8|\ud83c\uddeb\ud83c\uddf7|\ud83c\uddec\ud83c\udde7|\ud83c\uddee\ud83c\uddf9|\ud83c\uddef\ud83c\uddf5|\ud83c\uddf0\ud83c\uddf7|\ud83c\uddf7\ud83c\uddfa|\ud83c\uddfa\ud83c\uddf8|\ud83d[\udc00-\udc3e\udc40\udc42-\udcf7\udcf9-\udcfc\udd00-\udd3d\udd50-\udd67\uddfb-\ude42\ude45-\ude4f\ude80-\udec5]|\ud83c[\udccf\udd8e\udd91-\udd9a\udde6-\uddff\ude01\ude32-\ude36\ude38-\ude3a\ude50\ude51\udf00-\udf20\udf30-\udf35\udf37-\udf7c\udf80-\udf93\udfa0-\udfc4\udfc6-\udfca\udfe0-\udff0]|[\ue50a\u27bf\u27b0\u2797\u2796\u2795\u2755\u2754\u2753\u274e\u274c\u2728\u270b\u270a\u2705\u26ce\u23f3\u23f0\u23ec\u23eb\u23ea\u23e9]|(?:\ud83c[\udc04\udd70\udd71\udd7e\udd7f\ude02\ude1a\ude2f\ude37]|[\u3299\u3297\u303d\u3030\u2b55\u2b50\u2b1c\u2b1b\u2b07\u2b06\u2b05\u2935\u2934\u27a1\u2764\u2757\u2747\u2744\u2734\u2733\u2716\u2714\u2712\u270f\u270c\u2709\u2708\u2702\u26fd\u26fa\u26f5\u26f3\u26f2\u26ea\u26d4\u26c5\u26c4\u26be\u26bd\u26ab\u26aa\u26a1\u26a0\u2693\u267f\u267b\u2668\u2666\u2665\u2663\u2660\u2653\u2652\u2651\u2650\u264f\u264e\u264d\u264c\u264b\u264a\u2649\u2648\u263a\u261d\u2615\u2614\u2611\u260e\u2601\u2600\u25fe\u25fd\u25fc\u25fb\u25c0\u25b6\u25ab\u25aa\u24c2\u231b\u231a\u21aa\u21a9\u2199\u2198\u2197\u2196\u2195\u2194\u2139\u2122\u2049\u203c\u00ae\u00a9])(?:\ufe0f|(?!\ufe0e))/g,
|
||||
|
||||
// avoid runtime RegExp creation for not so smart,
|
||||
// not JIT based, and old browsers / engines
|
||||
UFE0Fg = /\uFE0F/g,
|
||||
|
||||
// avoid using a string literal like '\u200D' here because minifiers expand it inline
|
||||
U200D = String.fromCharCode(0x200D),
|
||||
|
||||
// used to find HTML special chars in attributes
|
||||
rescaper = /[&<>'"]/g,
|
||||
|
||||
// nodes with type 1 which should **not** be parsed (including lower case svg)
|
||||
shouldntBeParsed = /IFRAME|NOFRAMES|NOSCRIPT|SCRIPT|SELECT|STYLE|TEXTAREA|[a-z]/,
|
||||
|
||||
// just a private shortcut
|
||||
fromCharCode = String.fromCharCode;
|
||||
|
||||
return twemoji;
|
||||
|
||||
|
||||
/////////////////////////
|
||||
// private functions //
|
||||
// declaration //
|
||||
/////////////////////////
|
||||
|
||||
/**
|
||||
* Shortcut to create text nodes
|
||||
* @param string text used to create DOM text node
|
||||
* @return Node a DOM node with that text
|
||||
*/
|
||||
function createText(text) {
|
||||
return document.createTextNode(text);
|
||||
}
|
||||
|
||||
/**
|
||||
* Utility function to escape html attribute text
|
||||
* @param string text use in HTML attribute
|
||||
* @return string text encoded to use in HTML attribute
|
||||
*/
|
||||
function escapeHTML(s) {
|
||||
return s.replace(rescaper, replacer);
|
||||
}
|
||||
|
||||
/**
|
||||
* Default callback used to generate emoji src
|
||||
* based on Twitter CDN
|
||||
* @param string the emoji codepoint string
|
||||
* @param string the default size to use, i.e. "36x36"
|
||||
* @return string the image source to use
|
||||
*/
|
||||
function defaultImageSrcGenerator(icon, options) {
|
||||
return ''.concat(options.base, options.size, '/', icon, options.ext);
|
||||
}
|
||||
|
||||
/**
|
||||
* Given a generic DOM nodeType 1, walk through all children
|
||||
* and store every nodeType 3 (#text) found in the tree.
|
||||
* @param Element a DOM Element with probably some text in it
|
||||
* @param Array the list of previously discovered text nodes
|
||||
* @return Array same list with new discovered nodes, if any
|
||||
*/
|
||||
function grabAllTextNodes(node, allText) {
|
||||
var
|
||||
childNodes = node.childNodes,
|
||||
length = childNodes.length,
|
||||
subnode,
|
||||
nodeType;
|
||||
while (length--) {
|
||||
subnode = childNodes[length];
|
||||
nodeType = subnode.nodeType;
|
||||
// parse emoji only in text nodes
|
||||
if (nodeType === 3) {
|
||||
// collect them to process emoji later
|
||||
allText.push(subnode);
|
||||
}
|
||||
// ignore all nodes that are not type 1 or that
|
||||
// should not be parsed as script, style, and others
|
||||
else if (nodeType === 1 && !shouldntBeParsed.test(subnode.nodeName)) {
|
||||
grabAllTextNodes(subnode, allText);
|
||||
}
|
||||
}
|
||||
return allText;
|
||||
}
|
||||
|
||||
/**
|
||||
* Used to both remove the possible variant
|
||||
* and to convert utf16 into code points.
|
||||
* If there is a zero-width-joiner (U+200D), leave the variants in.
|
||||
* @param string the raw text of the emoji match
|
||||
*/
|
||||
function grabTheRightIcon(rawText) {
|
||||
// if variant is present as \uFE0F
|
||||
return toCodePoint(rawText.indexOf(U200D) < 0 ?
|
||||
rawText.replace(UFE0Fg, '') :
|
||||
rawText
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* DOM version of the same logic / parser:
|
||||
* emojify all found sub-text nodes placing images node instead.
|
||||
* @param Element generic DOM node with some text in some child node
|
||||
* @param Object options containing info about how to parse
|
||||
*
|
||||
* .callback Function the callback to invoke per each found emoji.
|
||||
* .base string the base url, by default twemoji.base
|
||||
* .ext string the image extension, by default twemoji.ext
|
||||
* .size string the assets size, by default twemoji.size
|
||||
*
|
||||
* @return Element same generic node with emoji in place, if any.
|
||||
*/
|
||||
function parseNode(node, options) {
|
||||
var
|
||||
allText = grabAllTextNodes(node, []),
|
||||
length = allText.length,
|
||||
attrib,
|
||||
attrname,
|
||||
modified,
|
||||
fragment,
|
||||
subnode,
|
||||
text,
|
||||
match,
|
||||
i,
|
||||
index,
|
||||
img,
|
||||
rawText,
|
||||
iconId,
|
||||
src;
|
||||
while (length--) {
|
||||
modified = false;
|
||||
fragment = document.createDocumentFragment();
|
||||
subnode = allText[length];
|
||||
text = subnode.nodeValue;
|
||||
i = 0;
|
||||
while ((match = re.exec(text))) {
|
||||
index = match.index;
|
||||
if (index !== i) {
|
||||
fragment.appendChild(
|
||||
createText(text.slice(i, index))
|
||||
);
|
||||
}
|
||||
rawText = match[0];
|
||||
iconId = grabTheRightIcon(rawText);
|
||||
i = index + rawText.length;
|
||||
src = options.callback(iconId, options);
|
||||
if (src) {
|
||||
img = new Image();
|
||||
img.onerror = options.onerror;
|
||||
img.setAttribute('draggable', 'false');
|
||||
attrib = options.attributes(rawText, iconId);
|
||||
for (attrname in attrib) {
|
||||
if (
|
||||
attrib.hasOwnProperty(attrname) &&
|
||||
// don't allow any handlers to be set + don't allow overrides
|
||||
attrname.indexOf('on') !== 0 &&
|
||||
!img.hasAttribute(attrname)
|
||||
) {
|
||||
img.setAttribute(attrname, attrib[attrname]);
|
||||
}
|
||||
}
|
||||
img.className = options.className;
|
||||
img.alt = rawText;
|
||||
img.src = src;
|
||||
modified = true;
|
||||
fragment.appendChild(img);
|
||||
}
|
||||
if (!img) fragment.appendChild(createText(rawText));
|
||||
img = null;
|
||||
}
|
||||
// is there actually anything to replace in here ?
|
||||
if (modified) {
|
||||
// any text left to be added ?
|
||||
if (i < text.length) {
|
||||
fragment.appendChild(
|
||||
createText(text.slice(i))
|
||||
);
|
||||
}
|
||||
// replace the text node only, leave intact
|
||||
// anything else surrounding such text
|
||||
subnode.parentNode.replaceChild(fragment, subnode);
|
||||
}
|
||||
}
|
||||
return node;
|
||||
}
|
||||
|
||||
/**
|
||||
* String/HTML version of the same logic / parser:
|
||||
* emojify a generic text placing images tags instead of surrogates pair.
|
||||
* @param string generic string with possibly some emoji in it
|
||||
* @param Object options containing info about how to parse
|
||||
*
|
||||
* .callback Function the callback to invoke per each found emoji.
|
||||
* .base string the base url, by default twemoji.base
|
||||
* .ext string the image extension, by default twemoji.ext
|
||||
* .size string the assets size, by default twemoji.size
|
||||
*
|
||||
* @return the string with <img tags> replacing all found and parsed emoji
|
||||
*/
|
||||
function parseString(str, options) {
|
||||
return replace(str, function (rawText) {
|
||||
var
|
||||
ret = rawText,
|
||||
iconId = grabTheRightIcon(rawText),
|
||||
src = options.callback(iconId, options),
|
||||
attrib,
|
||||
attrname;
|
||||
if (src) {
|
||||
// recycle the match string replacing the emoji
|
||||
// with its image counter part
|
||||
ret = '<img '.concat(
|
||||
'class="', options.className, '" ',
|
||||
'draggable="false" ',
|
||||
// needs to preserve user original intent
|
||||
// when variants should be copied and pasted too
|
||||
'alt="',
|
||||
rawText,
|
||||
'"',
|
||||
' src="',
|
||||
src,
|
||||
'"'
|
||||
);
|
||||
attrib = options.attributes(rawText, iconId);
|
||||
for (attrname in attrib) {
|
||||
if (
|
||||
attrib.hasOwnProperty(attrname) &&
|
||||
// don't allow any handlers to be set + don't allow overrides
|
||||
attrname.indexOf('on') !== 0 &&
|
||||
ret.indexOf(' ' + attrname + '=') === -1
|
||||
) {
|
||||
ret = ret.concat(' ', attrname, '="', escapeHTML(attrib[attrname]), '"');
|
||||
}
|
||||
}
|
||||
ret = ret.concat('>');
|
||||
}
|
||||
return ret;
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Function used to actually replace HTML special chars
|
||||
* @param string HTML special char
|
||||
* @return string encoded HTML special char
|
||||
*/
|
||||
function replacer(m) {
|
||||
return escaper[m];
|
||||
}
|
||||
|
||||
/**
|
||||
* Default options.attribute callback
|
||||
* @return null
|
||||
*/
|
||||
function returnNull() {
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Given a generic value, creates its squared counterpart if it's a number.
|
||||
* As example, number 36 will return '36x36'.
|
||||
* @param any a generic value.
|
||||
* @return any a string representing asset size, i.e. "36x36"
|
||||
* only in case the value was a number.
|
||||
* Returns initial value otherwise.
|
||||
*/
|
||||
function toSizeSquaredAsset(value) {
|
||||
return typeof value === 'number' ?
|
||||
value + 'x' + value :
|
||||
value;
|
||||
}
|
||||
|
||||
|
||||
/////////////////////////
|
||||
// exported functions //
|
||||
// declaration //
|
||||
/////////////////////////
|
||||
|
||||
function fromCodePoint(codepoint) {
|
||||
var code = typeof codepoint === 'string' ?
|
||||
parseInt(codepoint, 16) : codepoint;
|
||||
if (code < 0x10000) {
|
||||
return fromCharCode(code);
|
||||
}
|
||||
code -= 0x10000;
|
||||
return fromCharCode(
|
||||
0xD800 + (code >> 10),
|
||||
0xDC00 + (code & 0x3FF)
|
||||
);
|
||||
}
|
||||
|
||||
function parse(what, how) {
|
||||
if (!how || typeof how === 'function') {
|
||||
how = {callback: how};
|
||||
}
|
||||
// if first argument is string, inject html <img> tags
|
||||
// otherwise use the DOM tree and parse text nodes only
|
||||
return (typeof what === 'string' ? parseString : parseNode)(what, {
|
||||
callback: how.callback || defaultImageSrcGenerator,
|
||||
attributes: typeof how.attributes === 'function' ? how.attributes : returnNull,
|
||||
base: typeof how.base === 'string' ? how.base : twemoji.base,
|
||||
ext: how.ext || twemoji.ext,
|
||||
size: how.folder || toSizeSquaredAsset(how.size || twemoji.size),
|
||||
className: how.className || twemoji.className,
|
||||
onerror: how.onerror || twemoji.onerror
|
||||
});
|
||||
}
|
||||
|
||||
function replace(text, callback) {
|
||||
return String(text).replace(re, callback);
|
||||
}
|
||||
|
||||
function test(text) {
|
||||
// IE6 needs a reset before too
|
||||
re.lastIndex = 0;
|
||||
var result = re.test(text);
|
||||
re.lastIndex = 0;
|
||||
return result;
|
||||
}
|
||||
|
||||
function toCodePoint(unicodeSurrogates, sep) {
|
||||
var
|
||||
r = [],
|
||||
c = 0,
|
||||
p = 0,
|
||||
i = 0;
|
||||
while (i < unicodeSurrogates.length) {
|
||||
c = unicodeSurrogates.charCodeAt(i++);
|
||||
if (p) {
|
||||
r.push((0x10000 + ((p - 0xD800) << 10) + (c - 0xDC00)).toString(16));
|
||||
p = 0;
|
||||
} else if (0xD800 <= c && c <= 0xDBFF) {
|
||||
p = c;
|
||||
} else {
|
||||
r.push(c.toString(16));
|
||||
}
|
||||
}
|
||||
return r.join(sep || '-');
|
||||
}
|
||||
|
||||
}());
|
||||
return twemoji;
|
||||
});
|
||||
566
1/twemoji.js
Normal file
566
1/twemoji.js
Normal file
|
|
@ -0,0 +1,566 @@
|
|||
/*jslint indent: 2, browser: true, bitwise: true, plusplus: true */
|
||||
var twemoji = (function (
|
||||
/*! Copyright Twitter Inc. and other contributors. Licensed under MIT *//*
|
||||
https://github.com/twitter/twemoji/blob/gh-pages/LICENSE
|
||||
*/
|
||||
|
||||
// WARNING: this file is generated automatically via
|
||||
// `node twemoji-generator.js`
|
||||
// please update its `createTwemoji` function
|
||||
// at the bottom of the same file instead.
|
||||
|
||||
) {
|
||||
'use strict';
|
||||
|
||||
/*jshint maxparams:4 */
|
||||
|
||||
var
|
||||
// the exported module object
|
||||
twemoji = {
|
||||
|
||||
|
||||
/////////////////////////
|
||||
// properties //
|
||||
/////////////////////////
|
||||
|
||||
// default assets url, by default will be Twitter Inc. CDN
|
||||
base: 'https://twemoji.maxcdn.com/1/',
|
||||
|
||||
// default assets file extensions, by default '.png'
|
||||
ext: '.png',
|
||||
|
||||
// default assets/folder size, by default "72x72"
|
||||
// available via Twitter CDN: 72
|
||||
size: '72x72',
|
||||
|
||||
// default class name, by default 'emoji'
|
||||
className: 'emoji',
|
||||
|
||||
// basic utilities / helpers to convert code points
|
||||
// to JavaScript surrogates and vice versa
|
||||
convert: {
|
||||
|
||||
/**
|
||||
* Given an HEX codepoint, returns UTF16 surrogate pairs.
|
||||
*
|
||||
* @param string generic codepoint, i.e. '1F4A9'
|
||||
* @return string codepoint transformed into utf16 surrogates pair,
|
||||
* i.e. \uD83D\uDCA9
|
||||
*
|
||||
* @example
|
||||
* twemoji.convert.fromCodePoint('1f1e8');
|
||||
* // "\ud83c\udde8"
|
||||
*
|
||||
* '1f1e8-1f1f3'.split('-').map(twemoji.convert.fromCodePoint).join('')
|
||||
* // "\ud83c\udde8\ud83c\uddf3"
|
||||
*/
|
||||
fromCodePoint: fromCodePoint,
|
||||
|
||||
/**
|
||||
* Given UTF16 surrogate pairs, returns the equivalent HEX codepoint.
|
||||
*
|
||||
* @param string generic utf16 surrogates pair, i.e. \uD83D\uDCA9
|
||||
* @param string optional separator for double code points, default='-'
|
||||
* @return string utf16 transformed into codepoint, i.e. '1F4A9'
|
||||
*
|
||||
* @example
|
||||
* twemoji.convert.toCodePoint('\ud83c\udde8\ud83c\uddf3');
|
||||
* // "1f1e8-1f1f3"
|
||||
*
|
||||
* twemoji.convert.toCodePoint('\ud83c\udde8\ud83c\uddf3', '~');
|
||||
* // "1f1e8~1f1f3"
|
||||
*/
|
||||
toCodePoint: toCodePoint
|
||||
},
|
||||
|
||||
|
||||
/////////////////////////
|
||||
// methods //
|
||||
/////////////////////////
|
||||
|
||||
/**
|
||||
* User first: used to remove missing images
|
||||
* preserving the original text intent when
|
||||
* a fallback for network problems is desired.
|
||||
* Automatically added to Image nodes via DOM
|
||||
* It could be recycled for string operations via:
|
||||
* $('img.emoji').on('error', twemoji.onerror)
|
||||
*/
|
||||
onerror: function onerror() {
|
||||
if (this.parentNode) {
|
||||
this.parentNode.replaceChild(createText(this.alt), this);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Main method/logic to generate either <img> tags or HTMLImage nodes.
|
||||
* "emojify" a generic text or DOM Element.
|
||||
*
|
||||
* @overloads
|
||||
*
|
||||
* String replacement for `innerHTML` or server side operations
|
||||
* twemoji.parse(string);
|
||||
* twemoji.parse(string, Function);
|
||||
* twemoji.parse(string, Object);
|
||||
*
|
||||
* HTMLElement tree parsing for safer operations over existing DOM
|
||||
* twemoji.parse(HTMLElement);
|
||||
* twemoji.parse(HTMLElement, Function);
|
||||
* twemoji.parse(HTMLElement, Object);
|
||||
*
|
||||
* @param string|HTMLElement the source to parse and enrich with emoji.
|
||||
*
|
||||
* string replace emoji matches with <img> tags.
|
||||
* Mainly used to inject emoji via `innerHTML`
|
||||
* It does **not** parse the string or validate it,
|
||||
* it simply replaces found emoji with a tag.
|
||||
* NOTE: be sure this won't affect security.
|
||||
*
|
||||
* HTMLElement walk through the DOM tree and find emoji
|
||||
* that are inside **text node only** (nodeType === 3)
|
||||
* Mainly used to put emoji in already generated DOM
|
||||
* without compromising surrounding nodes and
|
||||
* **avoiding** the usage of `innerHTML`.
|
||||
* NOTE: Using DOM elements instead of strings should
|
||||
* improve security without compromising too much
|
||||
* performance compared with a less safe `innerHTML`.
|
||||
*
|
||||
* @param Function|Object [optional]
|
||||
* either the callback that will be invoked or an object
|
||||
* with all properties to use per each found emoji.
|
||||
*
|
||||
* Function if specified, this will be invoked per each emoji
|
||||
* that has been found through the RegExp except
|
||||
* those follwed by the invariant \uFE0E ("as text").
|
||||
* Once invoked, parameters will be:
|
||||
*
|
||||
* iconId:string the lower case HEX code point
|
||||
* i.e. "1f4a9"
|
||||
*
|
||||
* options:Object all info for this parsing operation
|
||||
*
|
||||
* variant:char the optional \uFE0F ("as image")
|
||||
* variant, in case this info
|
||||
* is anyhow meaningful.
|
||||
* By default this is ignored.
|
||||
*
|
||||
* If such callback will return a falsy value instead
|
||||
* of a valid `src` to use for the image, nothing will
|
||||
* actually change for that specific emoji.
|
||||
*
|
||||
*
|
||||
* Object if specified, an object containing the following properties
|
||||
*
|
||||
* callback Function the callback to invoke per each found emoji.
|
||||
* base string the base url, by default twemoji.base
|
||||
* ext string the image extension, by default twemoji.ext
|
||||
* size string the assets size, by default twemoji.size
|
||||
*
|
||||
* @example
|
||||
*
|
||||
* twemoji.parse("I \u2764\uFE0F emoji!");
|
||||
* // I <img class="emoji" draggable="false" alt="❤️" src="/assets/2764.gif"> emoji!
|
||||
*
|
||||
*
|
||||
* twemoji.parse("I \u2764\uFE0F emoji!", function(iconId, options) {
|
||||
* return '/assets/' + iconId + '.gif';
|
||||
* });
|
||||
* // I <img class="emoji" draggable="false" alt="❤️" src="/assets/2764.gif"> emoji!
|
||||
*
|
||||
*
|
||||
* twemoji.parse("I \u2764\uFE0F emoji!", {
|
||||
* size: 72,
|
||||
* callback: function(iconId, options) {
|
||||
* return '/assets/' + options.size + '/' + iconId + options.ext;
|
||||
* }
|
||||
* });
|
||||
* // I <img class="emoji" draggable="false" alt="❤️" src="/assets/72x72/2764.png"> emoji!
|
||||
*
|
||||
*/
|
||||
parse: parse,
|
||||
|
||||
/**
|
||||
* Given a string, invokes the callback argument
|
||||
* per each emoji found in such string.
|
||||
* This is the most raw version used by
|
||||
* the .parse(string) method itself.
|
||||
*
|
||||
* @param string generic string to parse
|
||||
* @param Function a generic callback that will be
|
||||
* invoked to replace the content.
|
||||
* This calback wil receive standard
|
||||
* String.prototype.replace(str, callback)
|
||||
* arguments such:
|
||||
* callback(
|
||||
* rawText, // the emoji match
|
||||
* );
|
||||
*
|
||||
* and others commonly received via replace.
|
||||
*/
|
||||
replace: replace,
|
||||
|
||||
/**
|
||||
* Simplify string tests against emoji.
|
||||
*
|
||||
* @param string some text that might contain emoji
|
||||
* @return boolean true if any emoji was found, false otherwise.
|
||||
*
|
||||
* @example
|
||||
*
|
||||
* if (twemoji.test(someContent)) {
|
||||
* console.log("emoji All The Things!");
|
||||
* }
|
||||
*/
|
||||
test: test
|
||||
},
|
||||
|
||||
// used to escape HTML special chars in attributes
|
||||
escaper = {
|
||||
'&': '&',
|
||||
'<': '<',
|
||||
'>': '>',
|
||||
"'": ''',
|
||||
'"': '"'
|
||||
},
|
||||
|
||||
// RegExp based on emoji's official Unicode standards
|
||||
// http://www.unicode.org/Public/UNIDATA/EmojiSources.txt
|
||||
re = /(?:[\u0039\u0038\u0037\u0036\u0035\u0034\u0033\u0032\u0031\u0030\u0023])\ufe0f?\u20e3|\ud83c\udde8\ud83c\uddf3|\ud83c\udde9\ud83c\uddea|\ud83c\uddea\ud83c\uddf8|\ud83c\uddeb\ud83c\uddf7|\ud83c\uddec\ud83c\udde7|\ud83c\uddee\ud83c\uddf9|\ud83c\uddef\ud83c\uddf5|\ud83c\uddf0\ud83c\uddf7|\ud83c\uddf7\ud83c\uddfa|\ud83c\uddfa\ud83c\uddf8|\ud83d[\udc00-\udc3e\udc40\udc42-\udcf7\udcf9-\udcfc\udd00-\udd3d\udd50-\udd67\uddfb-\ude42\ude45-\ude4f\ude80-\udec5]|\ud83c[\udccf\udd8e\udd91-\udd9a\udde6-\uddff\ude01\ude32-\ude36\ude38-\ude3a\ude50\ude51\udf00-\udf20\udf30-\udf35\udf37-\udf7c\udf80-\udf93\udfa0-\udfc4\udfc6-\udfca\udfe0-\udff0]|[\ue50a\u27bf\u27b0\u2797\u2796\u2795\u2755\u2754\u2753\u274e\u274c\u2728\u270b\u270a\u2705\u26ce\u23f3\u23f0\u23ec\u23eb\u23ea\u23e9]|(?:\ud83c[\udc04\udd70\udd71\udd7e\udd7f\ude02\ude1a\ude2f\ude37]|[\u3299\u3297\u303d\u3030\u2b55\u2b50\u2b1c\u2b1b\u2b07\u2b06\u2b05\u2935\u2934\u27a1\u2764\u2757\u2747\u2744\u2734\u2733\u2716\u2714\u2712\u270f\u270c\u2709\u2708\u2702\u26fd\u26fa\u26f5\u26f3\u26f2\u26ea\u26d4\u26c5\u26c4\u26be\u26bd\u26ab\u26aa\u26a1\u26a0\u2693\u267f\u267b\u2668\u2666\u2665\u2663\u2660\u2653\u2652\u2651\u2650\u264f\u264e\u264d\u264c\u264b\u264a\u2649\u2648\u263a\u261d\u2615\u2614\u2611\u260e\u2601\u2600\u25fe\u25fd\u25fc\u25fb\u25c0\u25b6\u25ab\u25aa\u24c2\u231b\u231a\u21aa\u21a9\u2199\u2198\u2197\u2196\u2195\u2194\u2139\u2122\u2049\u203c\u00ae\u00a9])(?:\ufe0f|(?!\ufe0e))/g,
|
||||
|
||||
// avoid runtime RegExp creation for not so smart,
|
||||
// not JIT based, and old browsers / engines
|
||||
UFE0Fg = /\uFE0F/g,
|
||||
|
||||
// avoid using a string literal like '\u200D' here because minifiers expand it inline
|
||||
U200D = String.fromCharCode(0x200D),
|
||||
|
||||
// used to find HTML special chars in attributes
|
||||
rescaper = /[&<>'"]/g,
|
||||
|
||||
// nodes with type 1 which should **not** be parsed (including lower case svg)
|
||||
shouldntBeParsed = /IFRAME|NOFRAMES|NOSCRIPT|SCRIPT|SELECT|STYLE|TEXTAREA|[a-z]/,
|
||||
|
||||
// just a private shortcut
|
||||
fromCharCode = String.fromCharCode;
|
||||
|
||||
return twemoji;
|
||||
|
||||
|
||||
/////////////////////////
|
||||
// private functions //
|
||||
// declaration //
|
||||
/////////////////////////
|
||||
|
||||
/**
|
||||
* Shortcut to create text nodes
|
||||
* @param string text used to create DOM text node
|
||||
* @return Node a DOM node with that text
|
||||
*/
|
||||
function createText(text) {
|
||||
return document.createTextNode(text);
|
||||
}
|
||||
|
||||
/**
|
||||
* Utility function to escape html attribute text
|
||||
* @param string text use in HTML attribute
|
||||
* @return string text encoded to use in HTML attribute
|
||||
*/
|
||||
function escapeHTML(s) {
|
||||
return s.replace(rescaper, replacer);
|
||||
}
|
||||
|
||||
/**
|
||||
* Default callback used to generate emoji src
|
||||
* based on Twitter CDN
|
||||
* @param string the emoji codepoint string
|
||||
* @param string the default size to use, i.e. "36x36"
|
||||
* @return string the image source to use
|
||||
*/
|
||||
function defaultImageSrcGenerator(icon, options) {
|
||||
return ''.concat(options.base, options.size, '/', icon, options.ext);
|
||||
}
|
||||
|
||||
/**
|
||||
* Given a generic DOM nodeType 1, walk through all children
|
||||
* and store every nodeType 3 (#text) found in the tree.
|
||||
* @param Element a DOM Element with probably some text in it
|
||||
* @param Array the list of previously discovered text nodes
|
||||
* @return Array same list with new discovered nodes, if any
|
||||
*/
|
||||
function grabAllTextNodes(node, allText) {
|
||||
var
|
||||
childNodes = node.childNodes,
|
||||
length = childNodes.length,
|
||||
subnode,
|
||||
nodeType;
|
||||
while (length--) {
|
||||
subnode = childNodes[length];
|
||||
nodeType = subnode.nodeType;
|
||||
// parse emoji only in text nodes
|
||||
if (nodeType === 3) {
|
||||
// collect them to process emoji later
|
||||
allText.push(subnode);
|
||||
}
|
||||
// ignore all nodes that are not type 1 or that
|
||||
// should not be parsed as script, style, and others
|
||||
else if (nodeType === 1 && !shouldntBeParsed.test(subnode.nodeName)) {
|
||||
grabAllTextNodes(subnode, allText);
|
||||
}
|
||||
}
|
||||
return allText;
|
||||
}
|
||||
|
||||
/**
|
||||
* Used to both remove the possible variant
|
||||
* and to convert utf16 into code points.
|
||||
* If there is a zero-width-joiner (U+200D), leave the variants in.
|
||||
* @param string the raw text of the emoji match
|
||||
*/
|
||||
function grabTheRightIcon(rawText) {
|
||||
// if variant is present as \uFE0F
|
||||
return toCodePoint(rawText.indexOf(U200D) < 0 ?
|
||||
rawText.replace(UFE0Fg, '') :
|
||||
rawText
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* DOM version of the same logic / parser:
|
||||
* emojify all found sub-text nodes placing images node instead.
|
||||
* @param Element generic DOM node with some text in some child node
|
||||
* @param Object options containing info about how to parse
|
||||
*
|
||||
* .callback Function the callback to invoke per each found emoji.
|
||||
* .base string the base url, by default twemoji.base
|
||||
* .ext string the image extension, by default twemoji.ext
|
||||
* .size string the assets size, by default twemoji.size
|
||||
*
|
||||
* @return Element same generic node with emoji in place, if any.
|
||||
*/
|
||||
function parseNode(node, options) {
|
||||
var
|
||||
allText = grabAllTextNodes(node, []),
|
||||
length = allText.length,
|
||||
attrib,
|
||||
attrname,
|
||||
modified,
|
||||
fragment,
|
||||
subnode,
|
||||
text,
|
||||
match,
|
||||
i,
|
||||
index,
|
||||
img,
|
||||
rawText,
|
||||
iconId,
|
||||
src;
|
||||
while (length--) {
|
||||
modified = false;
|
||||
fragment = document.createDocumentFragment();
|
||||
subnode = allText[length];
|
||||
text = subnode.nodeValue;
|
||||
i = 0;
|
||||
while ((match = re.exec(text))) {
|
||||
index = match.index;
|
||||
if (index !== i) {
|
||||
fragment.appendChild(
|
||||
createText(text.slice(i, index))
|
||||
);
|
||||
}
|
||||
rawText = match[0];
|
||||
iconId = grabTheRightIcon(rawText);
|
||||
i = index + rawText.length;
|
||||
src = options.callback(iconId, options);
|
||||
if (src) {
|
||||
img = new Image();
|
||||
img.onerror = options.onerror;
|
||||
img.setAttribute('draggable', 'false');
|
||||
attrib = options.attributes(rawText, iconId);
|
||||
for (attrname in attrib) {
|
||||
if (
|
||||
attrib.hasOwnProperty(attrname) &&
|
||||
// don't allow any handlers to be set + don't allow overrides
|
||||
attrname.indexOf('on') !== 0 &&
|
||||
!img.hasAttribute(attrname)
|
||||
) {
|
||||
img.setAttribute(attrname, attrib[attrname]);
|
||||
}
|
||||
}
|
||||
img.className = options.className;
|
||||
img.alt = rawText;
|
||||
img.src = src;
|
||||
modified = true;
|
||||
fragment.appendChild(img);
|
||||
}
|
||||
if (!img) fragment.appendChild(createText(rawText));
|
||||
img = null;
|
||||
}
|
||||
// is there actually anything to replace in here ?
|
||||
if (modified) {
|
||||
// any text left to be added ?
|
||||
if (i < text.length) {
|
||||
fragment.appendChild(
|
||||
createText(text.slice(i))
|
||||
);
|
||||
}
|
||||
// replace the text node only, leave intact
|
||||
// anything else surrounding such text
|
||||
subnode.parentNode.replaceChild(fragment, subnode);
|
||||
}
|
||||
}
|
||||
return node;
|
||||
}
|
||||
|
||||
/**
|
||||
* String/HTML version of the same logic / parser:
|
||||
* emojify a generic text placing images tags instead of surrogates pair.
|
||||
* @param string generic string with possibly some emoji in it
|
||||
* @param Object options containing info about how to parse
|
||||
*
|
||||
* .callback Function the callback to invoke per each found emoji.
|
||||
* .base string the base url, by default twemoji.base
|
||||
* .ext string the image extension, by default twemoji.ext
|
||||
* .size string the assets size, by default twemoji.size
|
||||
*
|
||||
* @return the string with <img tags> replacing all found and parsed emoji
|
||||
*/
|
||||
function parseString(str, options) {
|
||||
return replace(str, function (rawText) {
|
||||
var
|
||||
ret = rawText,
|
||||
iconId = grabTheRightIcon(rawText),
|
||||
src = options.callback(iconId, options),
|
||||
attrib,
|
||||
attrname;
|
||||
if (src) {
|
||||
// recycle the match string replacing the emoji
|
||||
// with its image counter part
|
||||
ret = '<img '.concat(
|
||||
'class="', options.className, '" ',
|
||||
'draggable="false" ',
|
||||
// needs to preserve user original intent
|
||||
// when variants should be copied and pasted too
|
||||
'alt="',
|
||||
rawText,
|
||||
'"',
|
||||
' src="',
|
||||
src,
|
||||
'"'
|
||||
);
|
||||
attrib = options.attributes(rawText, iconId);
|
||||
for (attrname in attrib) {
|
||||
if (
|
||||
attrib.hasOwnProperty(attrname) &&
|
||||
// don't allow any handlers to be set + don't allow overrides
|
||||
attrname.indexOf('on') !== 0 &&
|
||||
ret.indexOf(' ' + attrname + '=') === -1
|
||||
) {
|
||||
ret = ret.concat(' ', attrname, '="', escapeHTML(attrib[attrname]), '"');
|
||||
}
|
||||
}
|
||||
ret = ret.concat('>');
|
||||
}
|
||||
return ret;
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Function used to actually replace HTML special chars
|
||||
* @param string HTML special char
|
||||
* @return string encoded HTML special char
|
||||
*/
|
||||
function replacer(m) {
|
||||
return escaper[m];
|
||||
}
|
||||
|
||||
/**
|
||||
* Default options.attribute callback
|
||||
* @return null
|
||||
*/
|
||||
function returnNull() {
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Given a generic value, creates its squared counterpart if it's a number.
|
||||
* As example, number 36 will return '36x36'.
|
||||
* @param any a generic value.
|
||||
* @return any a string representing asset size, i.e. "36x36"
|
||||
* only in case the value was a number.
|
||||
* Returns initial value otherwise.
|
||||
*/
|
||||
function toSizeSquaredAsset(value) {
|
||||
return typeof value === 'number' ?
|
||||
value + 'x' + value :
|
||||
value;
|
||||
}
|
||||
|
||||
|
||||
/////////////////////////
|
||||
// exported functions //
|
||||
// declaration //
|
||||
/////////////////////////
|
||||
|
||||
function fromCodePoint(codepoint) {
|
||||
var code = typeof codepoint === 'string' ?
|
||||
parseInt(codepoint, 16) : codepoint;
|
||||
if (code < 0x10000) {
|
||||
return fromCharCode(code);
|
||||
}
|
||||
code -= 0x10000;
|
||||
return fromCharCode(
|
||||
0xD800 + (code >> 10),
|
||||
0xDC00 + (code & 0x3FF)
|
||||
);
|
||||
}
|
||||
|
||||
function parse(what, how) {
|
||||
if (!how || typeof how === 'function') {
|
||||
how = {callback: how};
|
||||
}
|
||||
// if first argument is string, inject html <img> tags
|
||||
// otherwise use the DOM tree and parse text nodes only
|
||||
return (typeof what === 'string' ? parseString : parseNode)(what, {
|
||||
callback: how.callback || defaultImageSrcGenerator,
|
||||
attributes: typeof how.attributes === 'function' ? how.attributes : returnNull,
|
||||
base: typeof how.base === 'string' ? how.base : twemoji.base,
|
||||
ext: how.ext || twemoji.ext,
|
||||
size: how.folder || toSizeSquaredAsset(how.size || twemoji.size),
|
||||
className: how.className || twemoji.className,
|
||||
onerror: how.onerror || twemoji.onerror
|
||||
});
|
||||
}
|
||||
|
||||
function replace(text, callback) {
|
||||
return String(text).replace(re, callback);
|
||||
}
|
||||
|
||||
function test(text) {
|
||||
// IE6 needs a reset before too
|
||||
re.lastIndex = 0;
|
||||
var result = re.test(text);
|
||||
re.lastIndex = 0;
|
||||
return result;
|
||||
}
|
||||
|
||||
function toCodePoint(unicodeSurrogates, sep) {
|
||||
var
|
||||
r = [],
|
||||
c = 0,
|
||||
p = 0,
|
||||
i = 0;
|
||||
while (i < unicodeSurrogates.length) {
|
||||
c = unicodeSurrogates.charCodeAt(i++);
|
||||
if (p) {
|
||||
r.push((0x10000 + ((p - 0xD800) << 10) + (c - 0xDC00)).toString(16));
|
||||
p = 0;
|
||||
} else if (0xD800 <= c && c <= 0xDBFF) {
|
||||
p = c;
|
||||
} else {
|
||||
r.push(c.toString(16));
|
||||
}
|
||||
}
|
||||
return r.join(sep || '-');
|
||||
}
|
||||
|
||||
}());
|
||||
2
1/twemoji.min.js
vendored
Normal file
2
1/twemoji.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
571
1/twemoji.npm.js
Normal file
571
1/twemoji.npm.js
Normal file
|
|
@ -0,0 +1,571 @@
|
|||
var location = global.location || {};
|
||||
/*jslint indent: 2, browser: true, bitwise: true, plusplus: true */
|
||||
var twemoji = (function (
|
||||
/*! Copyright Twitter Inc. and other contributors. Licensed under MIT *//*
|
||||
https://github.com/twitter/twemoji/blob/gh-pages/LICENSE
|
||||
*/
|
||||
|
||||
// WARNING: this file is generated automatically via
|
||||
// `node twemoji-generator.js`
|
||||
// please update its `createTwemoji` function
|
||||
// at the bottom of the same file instead.
|
||||
|
||||
) {
|
||||
'use strict';
|
||||
|
||||
/*jshint maxparams:4 */
|
||||
|
||||
var
|
||||
// the exported module object
|
||||
twemoji = {
|
||||
|
||||
|
||||
/////////////////////////
|
||||
// properties //
|
||||
/////////////////////////
|
||||
|
||||
// default assets url, by default will be Twitter Inc. CDN
|
||||
base: 'https://twemoji.maxcdn.com/1/',
|
||||
|
||||
// default assets file extensions, by default '.png'
|
||||
ext: '.png',
|
||||
|
||||
// default assets/folder size, by default "72x72"
|
||||
// available via Twitter CDN: 72
|
||||
size: '72x72',
|
||||
|
||||
// default class name, by default 'emoji'
|
||||
className: 'emoji',
|
||||
|
||||
// basic utilities / helpers to convert code points
|
||||
// to JavaScript surrogates and vice versa
|
||||
convert: {
|
||||
|
||||
/**
|
||||
* Given an HEX codepoint, returns UTF16 surrogate pairs.
|
||||
*
|
||||
* @param string generic codepoint, i.e. '1F4A9'
|
||||
* @return string codepoint transformed into utf16 surrogates pair,
|
||||
* i.e. \uD83D\uDCA9
|
||||
*
|
||||
* @example
|
||||
* twemoji.convert.fromCodePoint('1f1e8');
|
||||
* // "\ud83c\udde8"
|
||||
*
|
||||
* '1f1e8-1f1f3'.split('-').map(twemoji.convert.fromCodePoint).join('')
|
||||
* // "\ud83c\udde8\ud83c\uddf3"
|
||||
*/
|
||||
fromCodePoint: fromCodePoint,
|
||||
|
||||
/**
|
||||
* Given UTF16 surrogate pairs, returns the equivalent HEX codepoint.
|
||||
*
|
||||
* @param string generic utf16 surrogates pair, i.e. \uD83D\uDCA9
|
||||
* @param string optional separator for double code points, default='-'
|
||||
* @return string utf16 transformed into codepoint, i.e. '1F4A9'
|
||||
*
|
||||
* @example
|
||||
* twemoji.convert.toCodePoint('\ud83c\udde8\ud83c\uddf3');
|
||||
* // "1f1e8-1f1f3"
|
||||
*
|
||||
* twemoji.convert.toCodePoint('\ud83c\udde8\ud83c\uddf3', '~');
|
||||
* // "1f1e8~1f1f3"
|
||||
*/
|
||||
toCodePoint: toCodePoint
|
||||
},
|
||||
|
||||
|
||||
/////////////////////////
|
||||
// methods //
|
||||
/////////////////////////
|
||||
|
||||
/**
|
||||
* User first: used to remove missing images
|
||||
* preserving the original text intent when
|
||||
* a fallback for network problems is desired.
|
||||
* Automatically added to Image nodes via DOM
|
||||
* It could be recycled for string operations via:
|
||||
* $('img.emoji').on('error', twemoji.onerror)
|
||||
*/
|
||||
onerror: function onerror() {
|
||||
if (this.parentNode) {
|
||||
this.parentNode.replaceChild(createText(this.alt), this);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Main method/logic to generate either <img> tags or HTMLImage nodes.
|
||||
* "emojify" a generic text or DOM Element.
|
||||
*
|
||||
* @overloads
|
||||
*
|
||||
* String replacement for `innerHTML` or server side operations
|
||||
* twemoji.parse(string);
|
||||
* twemoji.parse(string, Function);
|
||||
* twemoji.parse(string, Object);
|
||||
*
|
||||
* HTMLElement tree parsing for safer operations over existing DOM
|
||||
* twemoji.parse(HTMLElement);
|
||||
* twemoji.parse(HTMLElement, Function);
|
||||
* twemoji.parse(HTMLElement, Object);
|
||||
*
|
||||
* @param string|HTMLElement the source to parse and enrich with emoji.
|
||||
*
|
||||
* string replace emoji matches with <img> tags.
|
||||
* Mainly used to inject emoji via `innerHTML`
|
||||
* It does **not** parse the string or validate it,
|
||||
* it simply replaces found emoji with a tag.
|
||||
* NOTE: be sure this won't affect security.
|
||||
*
|
||||
* HTMLElement walk through the DOM tree and find emoji
|
||||
* that are inside **text node only** (nodeType === 3)
|
||||
* Mainly used to put emoji in already generated DOM
|
||||
* without compromising surrounding nodes and
|
||||
* **avoiding** the usage of `innerHTML`.
|
||||
* NOTE: Using DOM elements instead of strings should
|
||||
* improve security without compromising too much
|
||||
* performance compared with a less safe `innerHTML`.
|
||||
*
|
||||
* @param Function|Object [optional]
|
||||
* either the callback that will be invoked or an object
|
||||
* with all properties to use per each found emoji.
|
||||
*
|
||||
* Function if specified, this will be invoked per each emoji
|
||||
* that has been found through the RegExp except
|
||||
* those follwed by the invariant \uFE0E ("as text").
|
||||
* Once invoked, parameters will be:
|
||||
*
|
||||
* iconId:string the lower case HEX code point
|
||||
* i.e. "1f4a9"
|
||||
*
|
||||
* options:Object all info for this parsing operation
|
||||
*
|
||||
* variant:char the optional \uFE0F ("as image")
|
||||
* variant, in case this info
|
||||
* is anyhow meaningful.
|
||||
* By default this is ignored.
|
||||
*
|
||||
* If such callback will return a falsy value instead
|
||||
* of a valid `src` to use for the image, nothing will
|
||||
* actually change for that specific emoji.
|
||||
*
|
||||
*
|
||||
* Object if specified, an object containing the following properties
|
||||
*
|
||||
* callback Function the callback to invoke per each found emoji.
|
||||
* base string the base url, by default twemoji.base
|
||||
* ext string the image extension, by default twemoji.ext
|
||||
* size string the assets size, by default twemoji.size
|
||||
*
|
||||
* @example
|
||||
*
|
||||
* twemoji.parse("I \u2764\uFE0F emoji!");
|
||||
* // I <img class="emoji" draggable="false" alt="❤️" src="/assets/2764.gif"> emoji!
|
||||
*
|
||||
*
|
||||
* twemoji.parse("I \u2764\uFE0F emoji!", function(iconId, options) {
|
||||
* return '/assets/' + iconId + '.gif';
|
||||
* });
|
||||
* // I <img class="emoji" draggable="false" alt="❤️" src="/assets/2764.gif"> emoji!
|
||||
*
|
||||
*
|
||||
* twemoji.parse("I \u2764\uFE0F emoji!", {
|
||||
* size: 72,
|
||||
* callback: function(iconId, options) {
|
||||
* return '/assets/' + options.size + '/' + iconId + options.ext;
|
||||
* }
|
||||
* });
|
||||
* // I <img class="emoji" draggable="false" alt="❤️" src="/assets/72x72/2764.png"> emoji!
|
||||
*
|
||||
*/
|
||||
parse: parse,
|
||||
|
||||
/**
|
||||
* Given a string, invokes the callback argument
|
||||
* per each emoji found in such string.
|
||||
* This is the most raw version used by
|
||||
* the .parse(string) method itself.
|
||||
*
|
||||
* @param string generic string to parse
|
||||
* @param Function a generic callback that will be
|
||||
* invoked to replace the content.
|
||||
* This calback wil receive standard
|
||||
* String.prototype.replace(str, callback)
|
||||
* arguments such:
|
||||
* callback(
|
||||
* rawText, // the emoji match
|
||||
* );
|
||||
*
|
||||
* and others commonly received via replace.
|
||||
*/
|
||||
replace: replace,
|
||||
|
||||
/**
|
||||
* Simplify string tests against emoji.
|
||||
*
|
||||
* @param string some text that might contain emoji
|
||||
* @return boolean true if any emoji was found, false otherwise.
|
||||
*
|
||||
* @example
|
||||
*
|
||||
* if (twemoji.test(someContent)) {
|
||||
* console.log("emoji All The Things!");
|
||||
* }
|
||||
*/
|
||||
test: test
|
||||
},
|
||||
|
||||
// used to escape HTML special chars in attributes
|
||||
escaper = {
|
||||
'&': '&',
|
||||
'<': '<',
|
||||
'>': '>',
|
||||
"'": ''',
|
||||
'"': '"'
|
||||
},
|
||||
|
||||
// RegExp based on emoji's official Unicode standards
|
||||
// http://www.unicode.org/Public/UNIDATA/EmojiSources.txt
|
||||
re = /(?:[\u0039\u0038\u0037\u0036\u0035\u0034\u0033\u0032\u0031\u0030\u0023])\ufe0f?\u20e3|\ud83c\udde8\ud83c\uddf3|\ud83c\udde9\ud83c\uddea|\ud83c\uddea\ud83c\uddf8|\ud83c\uddeb\ud83c\uddf7|\ud83c\uddec\ud83c\udde7|\ud83c\uddee\ud83c\uddf9|\ud83c\uddef\ud83c\uddf5|\ud83c\uddf0\ud83c\uddf7|\ud83c\uddf7\ud83c\uddfa|\ud83c\uddfa\ud83c\uddf8|\ud83d[\udc00-\udc3e\udc40\udc42-\udcf7\udcf9-\udcfc\udd00-\udd3d\udd50-\udd67\uddfb-\ude42\ude45-\ude4f\ude80-\udec5]|\ud83c[\udccf\udd8e\udd91-\udd9a\udde6-\uddff\ude01\ude32-\ude36\ude38-\ude3a\ude50\ude51\udf00-\udf20\udf30-\udf35\udf37-\udf7c\udf80-\udf93\udfa0-\udfc4\udfc6-\udfca\udfe0-\udff0]|[\ue50a\u27bf\u27b0\u2797\u2796\u2795\u2755\u2754\u2753\u274e\u274c\u2728\u270b\u270a\u2705\u26ce\u23f3\u23f0\u23ec\u23eb\u23ea\u23e9]|(?:\ud83c[\udc04\udd70\udd71\udd7e\udd7f\ude02\ude1a\ude2f\ude37]|[\u3299\u3297\u303d\u3030\u2b55\u2b50\u2b1c\u2b1b\u2b07\u2b06\u2b05\u2935\u2934\u27a1\u2764\u2757\u2747\u2744\u2734\u2733\u2716\u2714\u2712\u270f\u270c\u2709\u2708\u2702\u26fd\u26fa\u26f5\u26f3\u26f2\u26ea\u26d4\u26c5\u26c4\u26be\u26bd\u26ab\u26aa\u26a1\u26a0\u2693\u267f\u267b\u2668\u2666\u2665\u2663\u2660\u2653\u2652\u2651\u2650\u264f\u264e\u264d\u264c\u264b\u264a\u2649\u2648\u263a\u261d\u2615\u2614\u2611\u260e\u2601\u2600\u25fe\u25fd\u25fc\u25fb\u25c0\u25b6\u25ab\u25aa\u24c2\u231b\u231a\u21aa\u21a9\u2199\u2198\u2197\u2196\u2195\u2194\u2139\u2122\u2049\u203c\u00ae\u00a9])(?:\ufe0f|(?!\ufe0e))/g,
|
||||
|
||||
// avoid runtime RegExp creation for not so smart,
|
||||
// not JIT based, and old browsers / engines
|
||||
UFE0Fg = /\uFE0F/g,
|
||||
|
||||
// avoid using a string literal like '\u200D' here because minifiers expand it inline
|
||||
U200D = String.fromCharCode(0x200D),
|
||||
|
||||
// used to find HTML special chars in attributes
|
||||
rescaper = /[&<>'"]/g,
|
||||
|
||||
// nodes with type 1 which should **not** be parsed (including lower case svg)
|
||||
shouldntBeParsed = /IFRAME|NOFRAMES|NOSCRIPT|SCRIPT|SELECT|STYLE|TEXTAREA|[a-z]/,
|
||||
|
||||
// just a private shortcut
|
||||
fromCharCode = String.fromCharCode;
|
||||
|
||||
return twemoji;
|
||||
|
||||
|
||||
/////////////////////////
|
||||
// private functions //
|
||||
// declaration //
|
||||
/////////////////////////
|
||||
|
||||
/**
|
||||
* Shortcut to create text nodes
|
||||
* @param string text used to create DOM text node
|
||||
* @return Node a DOM node with that text
|
||||
*/
|
||||
function createText(text) {
|
||||
return document.createTextNode(text);
|
||||
}
|
||||
|
||||
/**
|
||||
* Utility function to escape html attribute text
|
||||
* @param string text use in HTML attribute
|
||||
* @return string text encoded to use in HTML attribute
|
||||
*/
|
||||
function escapeHTML(s) {
|
||||
return s.replace(rescaper, replacer);
|
||||
}
|
||||
|
||||
/**
|
||||
* Default callback used to generate emoji src
|
||||
* based on Twitter CDN
|
||||
* @param string the emoji codepoint string
|
||||
* @param string the default size to use, i.e. "36x36"
|
||||
* @return string the image source to use
|
||||
*/
|
||||
function defaultImageSrcGenerator(icon, options) {
|
||||
return ''.concat(options.base, options.size, '/', icon, options.ext);
|
||||
}
|
||||
|
||||
/**
|
||||
* Given a generic DOM nodeType 1, walk through all children
|
||||
* and store every nodeType 3 (#text) found in the tree.
|
||||
* @param Element a DOM Element with probably some text in it
|
||||
* @param Array the list of previously discovered text nodes
|
||||
* @return Array same list with new discovered nodes, if any
|
||||
*/
|
||||
function grabAllTextNodes(node, allText) {
|
||||
var
|
||||
childNodes = node.childNodes,
|
||||
length = childNodes.length,
|
||||
subnode,
|
||||
nodeType;
|
||||
while (length--) {
|
||||
subnode = childNodes[length];
|
||||
nodeType = subnode.nodeType;
|
||||
// parse emoji only in text nodes
|
||||
if (nodeType === 3) {
|
||||
// collect them to process emoji later
|
||||
allText.push(subnode);
|
||||
}
|
||||
// ignore all nodes that are not type 1 or that
|
||||
// should not be parsed as script, style, and others
|
||||
else if (nodeType === 1 && !shouldntBeParsed.test(subnode.nodeName)) {
|
||||
grabAllTextNodes(subnode, allText);
|
||||
}
|
||||
}
|
||||
return allText;
|
||||
}
|
||||
|
||||
/**
|
||||
* Used to both remove the possible variant
|
||||
* and to convert utf16 into code points.
|
||||
* If there is a zero-width-joiner (U+200D), leave the variants in.
|
||||
* @param string the raw text of the emoji match
|
||||
*/
|
||||
function grabTheRightIcon(rawText) {
|
||||
// if variant is present as \uFE0F
|
||||
return toCodePoint(rawText.indexOf(U200D) < 0 ?
|
||||
rawText.replace(UFE0Fg, '') :
|
||||
rawText
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* DOM version of the same logic / parser:
|
||||
* emojify all found sub-text nodes placing images node instead.
|
||||
* @param Element generic DOM node with some text in some child node
|
||||
* @param Object options containing info about how to parse
|
||||
*
|
||||
* .callback Function the callback to invoke per each found emoji.
|
||||
* .base string the base url, by default twemoji.base
|
||||
* .ext string the image extension, by default twemoji.ext
|
||||
* .size string the assets size, by default twemoji.size
|
||||
*
|
||||
* @return Element same generic node with emoji in place, if any.
|
||||
*/
|
||||
function parseNode(node, options) {
|
||||
var
|
||||
allText = grabAllTextNodes(node, []),
|
||||
length = allText.length,
|
||||
attrib,
|
||||
attrname,
|
||||
modified,
|
||||
fragment,
|
||||
subnode,
|
||||
text,
|
||||
match,
|
||||
i,
|
||||
index,
|
||||
img,
|
||||
rawText,
|
||||
iconId,
|
||||
src;
|
||||
while (length--) {
|
||||
modified = false;
|
||||
fragment = document.createDocumentFragment();
|
||||
subnode = allText[length];
|
||||
text = subnode.nodeValue;
|
||||
i = 0;
|
||||
while ((match = re.exec(text))) {
|
||||
index = match.index;
|
||||
if (index !== i) {
|
||||
fragment.appendChild(
|
||||
createText(text.slice(i, index))
|
||||
);
|
||||
}
|
||||
rawText = match[0];
|
||||
iconId = grabTheRightIcon(rawText);
|
||||
i = index + rawText.length;
|
||||
src = options.callback(iconId, options);
|
||||
if (src) {
|
||||
img = new Image();
|
||||
img.onerror = options.onerror;
|
||||
img.setAttribute('draggable', 'false');
|
||||
attrib = options.attributes(rawText, iconId);
|
||||
for (attrname in attrib) {
|
||||
if (
|
||||
attrib.hasOwnProperty(attrname) &&
|
||||
// don't allow any handlers to be set + don't allow overrides
|
||||
attrname.indexOf('on') !== 0 &&
|
||||
!img.hasAttribute(attrname)
|
||||
) {
|
||||
img.setAttribute(attrname, attrib[attrname]);
|
||||
}
|
||||
}
|
||||
img.className = options.className;
|
||||
img.alt = rawText;
|
||||
img.src = src;
|
||||
modified = true;
|
||||
fragment.appendChild(img);
|
||||
}
|
||||
if (!img) fragment.appendChild(createText(rawText));
|
||||
img = null;
|
||||
}
|
||||
// is there actually anything to replace in here ?
|
||||
if (modified) {
|
||||
// any text left to be added ?
|
||||
if (i < text.length) {
|
||||
fragment.appendChild(
|
||||
createText(text.slice(i))
|
||||
);
|
||||
}
|
||||
// replace the text node only, leave intact
|
||||
// anything else surrounding such text
|
||||
subnode.parentNode.replaceChild(fragment, subnode);
|
||||
}
|
||||
}
|
||||
return node;
|
||||
}
|
||||
|
||||
/**
|
||||
* String/HTML version of the same logic / parser:
|
||||
* emojify a generic text placing images tags instead of surrogates pair.
|
||||
* @param string generic string with possibly some emoji in it
|
||||
* @param Object options containing info about how to parse
|
||||
*
|
||||
* .callback Function the callback to invoke per each found emoji.
|
||||
* .base string the base url, by default twemoji.base
|
||||
* .ext string the image extension, by default twemoji.ext
|
||||
* .size string the assets size, by default twemoji.size
|
||||
*
|
||||
* @return the string with <img tags> replacing all found and parsed emoji
|
||||
*/
|
||||
function parseString(str, options) {
|
||||
return replace(str, function (rawText) {
|
||||
var
|
||||
ret = rawText,
|
||||
iconId = grabTheRightIcon(rawText),
|
||||
src = options.callback(iconId, options),
|
||||
attrib,
|
||||
attrname;
|
||||
if (src) {
|
||||
// recycle the match string replacing the emoji
|
||||
// with its image counter part
|
||||
ret = '<img '.concat(
|
||||
'class="', options.className, '" ',
|
||||
'draggable="false" ',
|
||||
// needs to preserve user original intent
|
||||
// when variants should be copied and pasted too
|
||||
'alt="',
|
||||
rawText,
|
||||
'"',
|
||||
' src="',
|
||||
src,
|
||||
'"'
|
||||
);
|
||||
attrib = options.attributes(rawText, iconId);
|
||||
for (attrname in attrib) {
|
||||
if (
|
||||
attrib.hasOwnProperty(attrname) &&
|
||||
// don't allow any handlers to be set + don't allow overrides
|
||||
attrname.indexOf('on') !== 0 &&
|
||||
ret.indexOf(' ' + attrname + '=') === -1
|
||||
) {
|
||||
ret = ret.concat(' ', attrname, '="', escapeHTML(attrib[attrname]), '"');
|
||||
}
|
||||
}
|
||||
ret = ret.concat('>');
|
||||
}
|
||||
return ret;
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Function used to actually replace HTML special chars
|
||||
* @param string HTML special char
|
||||
* @return string encoded HTML special char
|
||||
*/
|
||||
function replacer(m) {
|
||||
return escaper[m];
|
||||
}
|
||||
|
||||
/**
|
||||
* Default options.attribute callback
|
||||
* @return null
|
||||
*/
|
||||
function returnNull() {
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Given a generic value, creates its squared counterpart if it's a number.
|
||||
* As example, number 36 will return '36x36'.
|
||||
* @param any a generic value.
|
||||
* @return any a string representing asset size, i.e. "36x36"
|
||||
* only in case the value was a number.
|
||||
* Returns initial value otherwise.
|
||||
*/
|
||||
function toSizeSquaredAsset(value) {
|
||||
return typeof value === 'number' ?
|
||||
value + 'x' + value :
|
||||
value;
|
||||
}
|
||||
|
||||
|
||||
/////////////////////////
|
||||
// exported functions //
|
||||
// declaration //
|
||||
/////////////////////////
|
||||
|
||||
function fromCodePoint(codepoint) {
|
||||
var code = typeof codepoint === 'string' ?
|
||||
parseInt(codepoint, 16) : codepoint;
|
||||
if (code < 0x10000) {
|
||||
return fromCharCode(code);
|
||||
}
|
||||
code -= 0x10000;
|
||||
return fromCharCode(
|
||||
0xD800 + (code >> 10),
|
||||
0xDC00 + (code & 0x3FF)
|
||||
);
|
||||
}
|
||||
|
||||
function parse(what, how) {
|
||||
if (!how || typeof how === 'function') {
|
||||
how = {callback: how};
|
||||
}
|
||||
// if first argument is string, inject html <img> tags
|
||||
// otherwise use the DOM tree and parse text nodes only
|
||||
return (typeof what === 'string' ? parseString : parseNode)(what, {
|
||||
callback: how.callback || defaultImageSrcGenerator,
|
||||
attributes: typeof how.attributes === 'function' ? how.attributes : returnNull,
|
||||
base: typeof how.base === 'string' ? how.base : twemoji.base,
|
||||
ext: how.ext || twemoji.ext,
|
||||
size: how.folder || toSizeSquaredAsset(how.size || twemoji.size),
|
||||
className: how.className || twemoji.className,
|
||||
onerror: how.onerror || twemoji.onerror
|
||||
});
|
||||
}
|
||||
|
||||
function replace(text, callback) {
|
||||
return String(text).replace(re, callback);
|
||||
}
|
||||
|
||||
function test(text) {
|
||||
// IE6 needs a reset before too
|
||||
re.lastIndex = 0;
|
||||
var result = re.test(text);
|
||||
re.lastIndex = 0;
|
||||
return result;
|
||||
}
|
||||
|
||||
function toCodePoint(unicodeSurrogates, sep) {
|
||||
var
|
||||
r = [],
|
||||
c = 0,
|
||||
p = 0,
|
||||
i = 0;
|
||||
while (i < unicodeSurrogates.length) {
|
||||
c = unicodeSurrogates.charCodeAt(i++);
|
||||
if (p) {
|
||||
r.push((0x10000 + ((p - 0xD800) << 10) + (c - 0xDC00)).toString(16));
|
||||
p = 0;
|
||||
} else if (0xD800 <= c && c <= 0xDBFF) {
|
||||
p = c;
|
||||
} else {
|
||||
r.push(c.toString(16));
|
||||
}
|
||||
}
|
||||
return r.join(sep || '-');
|
||||
}
|
||||
|
||||
}());
|
||||
if (!location.protocol) {
|
||||
twemoji.base = twemoji.base.replace(/^http:/, "");
|
||||
}
|
||||
module.exports = twemoji;
|
||||
52
1/utils/create-dist
Executable file
52
1/utils/create-dist
Executable file
|
|
@ -0,0 +1,52 @@
|
|||
#!/usr/bin/env node
|
||||
|
||||
/*! Copyright Twitter Inc. and other contributors. Licensed under MIT *//*
|
||||
https://github.com/twitter/twemoji/blob/gh-pages/LICENSE
|
||||
*/
|
||||
|
||||
var fs = require('fs');
|
||||
var path = require('path');
|
||||
|
||||
function file(which) {
|
||||
return path.join(__dirname, '..', which);
|
||||
}
|
||||
|
||||
fs.writeFileSync(
|
||||
file('twemoji.npm.js'),
|
||||
[
|
||||
'var location = global.location || {};',
|
||||
fs.readFileSync(file('twemoji.js')),
|
||||
'if (!location.protocol) {',
|
||||
' twemoji.base = twemoji.base.replace(/^http:/, "");',
|
||||
'}',
|
||||
'module.exports = twemoji;'
|
||||
].join('\n')
|
||||
);
|
||||
|
||||
fs.writeFileSync(
|
||||
file('twemoji.amd.js'),
|
||||
'define(function () {\n' +
|
||||
fs.readFileSync(file('twemoji.js')).toString().replace(
|
||||
/^(.)/gm, ' $1'
|
||||
) +
|
||||
'\n return twemoji;\n});'
|
||||
);
|
||||
|
||||
require('child_process').spawn(
|
||||
'node',
|
||||
[
|
||||
path.join(__dirname, '../../', 'node_modules/uglify-js/bin/uglifyjs'),
|
||||
'--verbose',
|
||||
file('twemoji.js'),
|
||||
'-o',
|
||||
file('twemoji.tmp.js')
|
||||
]
|
||||
).on('close', function () {
|
||||
fs.writeFileSync(
|
||||
file('twemoji.min.js'),
|
||||
'/*! Copyright Twitter Inc. and other contributors. Licensed under MIT */\n' +
|
||||
fs.readFileSync(file('twemoji.tmp.js'))
|
||||
);
|
||||
fs.unlink(file('twemoji.tmp.js'));
|
||||
// gzip -c twemoji.min.js | wc -c
|
||||
});
|
||||
995
1/utils/generate
Executable file
995
1/utils/generate
Executable file
|
|
@ -0,0 +1,995 @@
|
|||
#!/usr/bin/env node
|
||||
|
||||
/*! Copyright Twitter Inc. and other contributors. Licensed under MIT *//*
|
||||
https://github.com/twitter/twemoji/blob/gh-pages/LICENSE
|
||||
*/
|
||||
|
||||
// dependencies
|
||||
var fs = require('fs');
|
||||
var http = require('http');
|
||||
var path = require('path');
|
||||
|
||||
function file(which) {
|
||||
return path.join(__dirname, '../..', which);
|
||||
}
|
||||
|
||||
// Twitter assets by property name
|
||||
var assets = {
|
||||
'72x72': [],
|
||||
'svg': []
|
||||
};
|
||||
|
||||
// white spaces we don't want to catch via the RegExp
|
||||
// there is no asset equivalent for these
|
||||
var ignoreMissing = ['2002', '2003', '2005'];
|
||||
|
||||
// basic utility to organize async code
|
||||
// see: http://webreflection.blogspot.co.uk/2012/03/tweet-sized-queue-system.html
|
||||
// or: http://webreflection.blogspot.co.uk/2012/06/working-with-queues.html
|
||||
function Queue(args, f) {
|
||||
setTimeout(args.next = function next() {
|
||||
return (f = args.shift()) ? !!f(args) || !0 : !1;
|
||||
}, 0);
|
||||
return args;
|
||||
}
|
||||
|
||||
// main task
|
||||
Queue([
|
||||
|
||||
// will populate assets arrays
|
||||
function grabAllAssets(q) {
|
||||
console.log('analyzing all assets ... ');
|
||||
// per each path/folder
|
||||
Object.keys(assets).forEach(function (path, i, paths) {
|
||||
// grab all files in that folder
|
||||
fs.readdir(file(path), function (err, files) {
|
||||
// and add them to the assets path
|
||||
assets[path].push.apply(
|
||||
assets[path],
|
||||
files.map(upperCaseWithoutExtension)
|
||||
);
|
||||
// once all assets arrays have been populated
|
||||
if (paths.reduce(completed, true)) {
|
||||
console.log('[INFO] assets contains ' + assets[path].length + ' emoji.');
|
||||
q.next();
|
||||
}
|
||||
});
|
||||
});
|
||||
// drop extension + uppercase
|
||||
function upperCaseWithoutExtension(file) {
|
||||
return file.slice(0, file.lastIndexOf('.')).toUpperCase();
|
||||
}
|
||||
// returns true if all assets have been populated
|
||||
function completed(p, c) {
|
||||
return p && assets[c].length;
|
||||
}
|
||||
},
|
||||
|
||||
// will fetch and store all emoji from unicode.org
|
||||
function fetchEmojiSources(q) {
|
||||
console.log('fetching EmojiSources.txt ... ');
|
||||
// grab all emoji and test them against them
|
||||
http.get("http://www.unicode.org/Public/UNIDATA/EmojiSources.txt", function (res) {
|
||||
var chunks = [];
|
||||
// if all good ...
|
||||
if (res.statusCode === 200) {
|
||||
// grab all data
|
||||
res.on('data', chunks.push.bind(chunks));
|
||||
// once done ...
|
||||
res.on('end', function () {
|
||||
console.log('analyzing EmojiSources VS our assets ... ');
|
||||
// store all missing assets in one object
|
||||
var missing = {};
|
||||
// will be used to store an array with all missing
|
||||
var missingGrouped = {};
|
||||
|
||||
// will be needed later on
|
||||
// parse it, clean it, and store it once
|
||||
q.emojiSource = chunks
|
||||
.join('')
|
||||
.split(/\r\n|\r|\n/)
|
||||
// filter once
|
||||
.filter(function (line) {
|
||||
return this.test(line);
|
||||
}, /^[0-9A-F]/)
|
||||
// take only emoji info
|
||||
.map(function (codePoint) {
|
||||
return codePoint
|
||||
.slice(0, codePoint.indexOf(';'))
|
||||
.toUpperCase()
|
||||
// drop spaces
|
||||
.replace(/\s+/g, '-')
|
||||
// drop 0 padded prefixes
|
||||
.replace(/^0+/g, '');
|
||||
});
|
||||
|
||||
console.log('[INFO] parsed ' + q.emojiSource.length + ' standard emoji.');
|
||||
|
||||
// find out which one is missing from our assets
|
||||
q.emojiSource.forEach(
|
||||
function (emoji) {
|
||||
// do not loop for emoji we know we should ignore
|
||||
if (ignoreMissing.indexOf(emoji) < 0) {
|
||||
// verify all others per each folder
|
||||
this.forEach(function (path) {
|
||||
if (assets[path].indexOf(emoji) < 0) {
|
||||
(missing[path] || (missing[path] = [])).push(emoji);
|
||||
missingGrouped[emoji] = true;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
},
|
||||
// and per each folder
|
||||
Object.keys(assets)
|
||||
);
|
||||
|
||||
// if some missing emoji has been found
|
||||
if (Object.keys(missing).length) {
|
||||
// warn and show which one is missing
|
||||
console.warn('[WARNING] missing assets for:');
|
||||
console.log(missing);
|
||||
}
|
||||
// create the array of all emoji we should ignore
|
||||
q.ignore = ignoreMissing.concat(Object.keys(missingGrouped));
|
||||
|
||||
q.next();
|
||||
});
|
||||
} else {
|
||||
console.error('[ERROR] unable to fetch emoji at unicode.org');
|
||||
process.exit(1);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// grab the list of emoji that behave differently when
|
||||
// variants such \uFE0E and \uFE0F are in place
|
||||
function grabStandardVariants(q) {
|
||||
console.log('fetching StandardizedVariants.txt ... ');
|
||||
http.get(
|
||||
"http://unicode.org/Public/UNIDATA/StandardizedVariants.txt",
|
||||
function(res) {
|
||||
var chunks = [];
|
||||
if (res.statusCode == 200) {
|
||||
res.on('data', chunks.push.bind(chunks));
|
||||
res.on('end', function () {
|
||||
// cleaning up parsing sensitive emoji
|
||||
q.variantsSensitive = chunks
|
||||
.join('') // all content
|
||||
.split(/\r\n|\r|\n/) // split in lines
|
||||
.filter(function (line) { // containing FE0E; info
|
||||
return this.test(line); // avoiding duplicated with FE0F
|
||||
}, / FE0E; text style/)
|
||||
.map(function (line) { // cleaned up to grab
|
||||
return line.replace(this, '$1') // only first unicode
|
||||
.toUpperCase(); // normalized as uppercase
|
||||
}, /^([0-9A-F]{4,}) FE0E;.+$/) // sensitive char
|
||||
;
|
||||
|
||||
// iOS keyboard allows U+002A U+FE0F U+20E3 even though not a standardized variant (yet?)
|
||||
q.variantsSensitive.push('002A');
|
||||
// iOS keyboard allows U+2639 U+FE0F even though not a standardized variant (yet?)
|
||||
q.variantsSensitive.push('2639');
|
||||
|
||||
console.log('[INFO] parsed ' + q.variantsSensitive.length + ' variant sensitive emoji.');
|
||||
q.next();
|
||||
|
||||
});
|
||||
} else {
|
||||
console.error('[ERROR] unable to fetch standard variants at unicode.org');
|
||||
process.exit(1);
|
||||
}
|
||||
}
|
||||
);
|
||||
},
|
||||
|
||||
// add our own assets that are not part of the Unicode standard
|
||||
function addMissingEmoji(q) {
|
||||
q.nonStandard = [];
|
||||
Object.keys(assets).forEach(function (path, i) {
|
||||
assets[path].forEach(function (emoji) {
|
||||
if (
|
||||
q.emojiSource.indexOf(emoji) < 0 &&
|
||||
q.nonStandard.indexOf(emoji) < 0
|
||||
) {
|
||||
q.nonStandard.push(emoji);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
if (q.nonStandard.length) {
|
||||
console.warn('[WARNING] assets contain ' + q.nonStandard.length + ' non standard emoji:');
|
||||
// console.log(q.nonStandard.join(', '));
|
||||
}
|
||||
|
||||
q.emojiSource = q.emojiSource.concat(q.nonStandard)
|
||||
q.next();
|
||||
},
|
||||
|
||||
// detect complete sets of five skin tones and a base
|
||||
function detectDiversityEmoji(q) {
|
||||
var isPresent = {};
|
||||
q.emojiSource.forEach(function (codePoints) {
|
||||
isPresent[codePoints] = true;
|
||||
});
|
||||
q.diversityBase = q.emojiSource.filter(function (codePoints) {
|
||||
// Start with the set of Emoji with the light skin tone
|
||||
return /-1F3FB$/.test(codePoints);
|
||||
}).map(function (codePoints) {
|
||||
// Take the skin tone off
|
||||
return codePoints.replace(/-1F3FB$/, '');
|
||||
}).filter(function (baseCodePoints) {
|
||||
// Verify that all other skin tones + no skin tone are present
|
||||
return ['-1F3FC', '-1F3FD', '-1F3FE', '-1F3FF', ''].every(function (suffix) {
|
||||
return isPresent[baseCodePoints + suffix];
|
||||
});
|
||||
});
|
||||
console.log('[INFO] parsed ' + q.diversityBase.length + ' diversity emoji.');
|
||||
q.next();
|
||||
},
|
||||
|
||||
// with all info, generate a RegExp that will catch
|
||||
// only standard emoji that are present in our assets
|
||||
function generateRegExp(q) {
|
||||
console.log('generating a RegExp for available assets');
|
||||
var zwj = [];
|
||||
var diversity = [];
|
||||
var sensitive = [];
|
||||
var sensitiveKeycaps = [];
|
||||
var diversitySensitive = [];
|
||||
var skinToneOptions = [
|
||||
'\\ud83c\\udffb',
|
||||
'\\ud83c\\udffc',
|
||||
'\\ud83c\\udffd',
|
||||
'\\ud83c\\udffe',
|
||||
'\\ud83c\\udfff'
|
||||
];
|
||||
var regular = [];
|
||||
q.emojiSource.forEach(function (codePoints) {
|
||||
var u;
|
||||
var codePointsWithoutKeycap;
|
||||
codePoints = codePoints.replace(/\b[A-F0-9]+\b/g, function (hex) {
|
||||
// Pad all hex numbers to have at least 4 digits to match variantsSensitive
|
||||
return hex.length < 4 ? ('000' + hex).slice(-4) : hex;
|
||||
});
|
||||
if (q.ignore.indexOf(codePoints) < 0) {
|
||||
u = toJSON(codePoints);
|
||||
codePointsWithoutKeycap = codePoints.replace(/-20E3$/, '');
|
||||
if (codePoints.indexOf('200D') >= 0) {
|
||||
zwj.push(u);
|
||||
} else if (codePoints != codePointsWithoutKeycap && q.variantsSensitive.indexOf(codePointsWithoutKeycap) >= 0) {
|
||||
sensitiveKeycaps.push(toJSON(codePointsWithoutKeycap));
|
||||
} else if (q.diversityBase.indexOf(codePoints.replace(/-1F3F[B-F]$/, '')) >= 0) {
|
||||
// This is a diversity Emoji with or without a skin tone modifier
|
||||
// Add it to the regex if this is the base without the modifier
|
||||
if (q.diversityBase.indexOf(codePoints) >= 0) {
|
||||
if (q.variantsSensitive.indexOf(codePoints) < 0) {
|
||||
diversity.push(u);
|
||||
} else {
|
||||
diversitySensitive.push(u);
|
||||
}
|
||||
}
|
||||
} else if (q.variantsSensitive.indexOf(codePoints) < 0) {
|
||||
regular.push(u);
|
||||
} else {
|
||||
sensitive.push(u);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
q.re = '';
|
||||
|
||||
// The Zero-width joiner Emojis, if present, need to come first
|
||||
if (zwj.length) {
|
||||
q.re += generateRegexPartial(zwj) + '|';
|
||||
}
|
||||
|
||||
// Group the variant sensitive keycaps
|
||||
if (sensitiveKeycaps.length) {
|
||||
q.re += '(?:' + generateRegexPartial(sensitiveKeycaps) + ')\\ufe0f?\\u20e3|';
|
||||
}
|
||||
|
||||
// Next, add the diversity enabled Emoji that may include a skin tone suffix
|
||||
if (diversity.length + diversitySensitive.length) {
|
||||
q.re += '(?:';
|
||||
if (diversitySensitive.length) {
|
||||
// Some diversity are sensitive to variants
|
||||
q.re += '(?:' + generateRegexPartial(diversitySensitive) + ')(?:\\ufe0f|(?!\\ufe0e))';
|
||||
if (diversity.length) {
|
||||
q.re += '|';
|
||||
}
|
||||
}
|
||||
q.re += generateRegexPartial(diversity) + ')(?:' + generateRegexPartial(skinToneOptions) + '|)|';
|
||||
}
|
||||
|
||||
// Next, the normal Emoji
|
||||
q.re += generateRegexPartial(regular) + '|';
|
||||
|
||||
// Finally, add the rest of the sensitive ones that may be followed by U+FE0F but not U+FE0E
|
||||
q.re += '(?:' + generateRegexPartial(sensitive) + ')(?:\\ufe0f|(?!\\ufe0e))';
|
||||
q.next();
|
||||
|
||||
// basic utilities to convert codepoints to JSON strings
|
||||
function toJSON(codePoints) {
|
||||
return codePoints.split('-').map(function (point) {
|
||||
return UTF162JSON(fromCodePoint(point));
|
||||
}).join('');
|
||||
}
|
||||
function fromCodePoint(codepoint) {
|
||||
var code = typeof codepoint === 'string' ?
|
||||
parseInt(codepoint, 16) : codepoint;
|
||||
if (code < 0x10000) {
|
||||
return String.fromCharCode(code);
|
||||
}
|
||||
code -= 0x10000;
|
||||
return String.fromCharCode(
|
||||
0xD800 + (code >> 10),
|
||||
0xDC00 + (code & 0x3FF)
|
||||
);
|
||||
}
|
||||
function UTF162JSON(text) {
|
||||
for (var i = 0, r = []; i < text.length; i++) {
|
||||
r.push('\\u' + ('000' + text.charCodeAt(i).toString(16)).slice(-4));
|
||||
}
|
||||
return r.join('');
|
||||
}
|
||||
|
||||
// Items is an array of unicode sequences with \u escaping, like ["\u2963\ufe0f", "\u263a\ufe0f"]
|
||||
// items get sorted by length (long to short), then unicode hex values (high to low)
|
||||
// output is "or" ed together using | for regex
|
||||
// ouput also combines adjacent items using character classes with ranges when they have common prefixes
|
||||
// Example: "aab", "aac", "aad", "aag", "ba" becomes "aa[b-dg]|ba"
|
||||
function generateRegexPartial(items) {
|
||||
var currentPrefix = null;
|
||||
var result = [];
|
||||
var charClass = [];
|
||||
var charRange = [];
|
||||
items.map(function (item) {
|
||||
// Convert from "\u2963\ufe0f" into ["2963", "fe0f"]
|
||||
return item.split('\\u').slice(1);
|
||||
}).sort(sortMethod).forEach(function (itemParts) {
|
||||
var prefix = itemParts.slice(0, -1).join('\\u');
|
||||
if (prefix) {
|
||||
prefix = '\\u' + prefix;
|
||||
}
|
||||
var suffix = itemParts.slice(-1);
|
||||
if (prefix !== currentPrefix) {
|
||||
flushCharClass();
|
||||
}
|
||||
currentPrefix = prefix;
|
||||
var suffixMinusOne = UTF162JSON(String.fromCharCode(parseInt(suffix, 16) - 1));
|
||||
|
||||
if (charRange.length && charRange.slice(-1)[0] !== suffixMinusOne) {
|
||||
flushCharRange();
|
||||
}
|
||||
charRange.push('\\u' + suffix);
|
||||
});
|
||||
|
||||
flushCharClass();
|
||||
return result.join('|');
|
||||
|
||||
// a and b are arrays of hex UCS-2 units
|
||||
function sortMethod(a, b) {
|
||||
return !a.length ? 0 :
|
||||
b.length - a.length ||
|
||||
parseInt(b[0], 16) - parseInt(a[0], 16) ||
|
||||
sortMethod(b.slice(1), a.slice(1)
|
||||
);
|
||||
}
|
||||
|
||||
function flushCharRange() {
|
||||
charClass = charClass.concat((charRange.length < 3) ?
|
||||
charRange :
|
||||
[ charRange[0], '-', charRange.slice(-1)[0] ]
|
||||
);
|
||||
charRange = [];
|
||||
}
|
||||
|
||||
function flushCharClass() {
|
||||
flushCharRange();
|
||||
if (charClass.length) {
|
||||
result.push(currentPrefix + (charClass.length == 1 ?
|
||||
charClass[0] :
|
||||
'[' + charClass.join('') + ']'
|
||||
));
|
||||
}
|
||||
charClass = [];
|
||||
currentPrefix = null;
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
function generateFile(q) {
|
||||
console.log('generating ./twemoji.js');
|
||||
createTwemoji(q.re);
|
||||
require('./create-dist');
|
||||
}
|
||||
|
||||
]);
|
||||
|
||||
|
||||
|
||||
function createTwemoji(re) {
|
||||
fs.writeFileSync(
|
||||
file('1/twemoji.js'),
|
||||
'/*jslint indent: 2, browser: true, bitwise: true, plusplus: true */\n' +
|
||||
'var twemoji = (' +
|
||||
function (
|
||||
/*! Copyright Twitter Inc. and other contributors. Licensed under MIT *//*
|
||||
https://github.com/twitter/twemoji/blob/gh-pages/LICENSE
|
||||
*/
|
||||
|
||||
// WARNING: this file is generated automatically via
|
||||
// `node twemoji-generator.js`
|
||||
// please update its `createTwemoji` function
|
||||
// at the bottom of the same file instead.
|
||||
|
||||
) {
|
||||
'use strict';
|
||||
|
||||
/*jshint maxparams:4 */
|
||||
|
||||
var
|
||||
// the exported module object
|
||||
twemoji = {
|
||||
|
||||
|
||||
/////////////////////////
|
||||
// properties //
|
||||
/////////////////////////
|
||||
|
||||
// default assets url, by default will be Twitter Inc. CDN
|
||||
base: 'https://twemoji.maxcdn.com/1/',
|
||||
|
||||
// default assets file extensions, by default '.png'
|
||||
ext: '.png',
|
||||
|
||||
// default assets/folder size, by default "72x72"
|
||||
// available via Twitter CDN: 72
|
||||
size: '72x72',
|
||||
|
||||
// default class name, by default 'emoji'
|
||||
className: 'emoji',
|
||||
|
||||
// basic utilities / helpers to convert code points
|
||||
// to JavaScript surrogates and vice versa
|
||||
convert: {
|
||||
|
||||
/**
|
||||
* Given an HEX codepoint, returns UTF16 surrogate pairs.
|
||||
*
|
||||
* @param string generic codepoint, i.e. '1F4A9'
|
||||
* @return string codepoint transformed into utf16 surrogates pair,
|
||||
* i.e. \uD83D\uDCA9
|
||||
*
|
||||
* @example
|
||||
* twemoji.convert.fromCodePoint('1f1e8');
|
||||
* // "\ud83c\udde8"
|
||||
*
|
||||
* '1f1e8-1f1f3'.split('-').map(twemoji.convert.fromCodePoint).join('')
|
||||
* // "\ud83c\udde8\ud83c\uddf3"
|
||||
*/
|
||||
fromCodePoint: fromCodePoint,
|
||||
|
||||
/**
|
||||
* Given UTF16 surrogate pairs, returns the equivalent HEX codepoint.
|
||||
*
|
||||
* @param string generic utf16 surrogates pair, i.e. \uD83D\uDCA9
|
||||
* @param string optional separator for double code points, default='-'
|
||||
* @return string utf16 transformed into codepoint, i.e. '1F4A9'
|
||||
*
|
||||
* @example
|
||||
* twemoji.convert.toCodePoint('\ud83c\udde8\ud83c\uddf3');
|
||||
* // "1f1e8-1f1f3"
|
||||
*
|
||||
* twemoji.convert.toCodePoint('\ud83c\udde8\ud83c\uddf3', '~');
|
||||
* // "1f1e8~1f1f3"
|
||||
*/
|
||||
toCodePoint: toCodePoint
|
||||
},
|
||||
|
||||
|
||||
/////////////////////////
|
||||
// methods //
|
||||
/////////////////////////
|
||||
|
||||
/**
|
||||
* User first: used to remove missing images
|
||||
* preserving the original text intent when
|
||||
* a fallback for network problems is desired.
|
||||
* Automatically added to Image nodes via DOM
|
||||
* It could be recycled for string operations via:
|
||||
* $('img.emoji').on('error', twemoji.onerror)
|
||||
*/
|
||||
onerror: function onerror() {
|
||||
if (this.parentNode) {
|
||||
this.parentNode.replaceChild(createText(this.alt), this);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Main method/logic to generate either <img> tags or HTMLImage nodes.
|
||||
* "emojify" a generic text or DOM Element.
|
||||
*
|
||||
* @overloads
|
||||
*
|
||||
* String replacement for `innerHTML` or server side operations
|
||||
* twemoji.parse(string);
|
||||
* twemoji.parse(string, Function);
|
||||
* twemoji.parse(string, Object);
|
||||
*
|
||||
* HTMLElement tree parsing for safer operations over existing DOM
|
||||
* twemoji.parse(HTMLElement);
|
||||
* twemoji.parse(HTMLElement, Function);
|
||||
* twemoji.parse(HTMLElement, Object);
|
||||
*
|
||||
* @param string|HTMLElement the source to parse and enrich with emoji.
|
||||
*
|
||||
* string replace emoji matches with <img> tags.
|
||||
* Mainly used to inject emoji via `innerHTML`
|
||||
* It does **not** parse the string or validate it,
|
||||
* it simply replaces found emoji with a tag.
|
||||
* NOTE: be sure this won't affect security.
|
||||
*
|
||||
* HTMLElement walk through the DOM tree and find emoji
|
||||
* that are inside **text node only** (nodeType === 3)
|
||||
* Mainly used to put emoji in already generated DOM
|
||||
* without compromising surrounding nodes and
|
||||
* **avoiding** the usage of `innerHTML`.
|
||||
* NOTE: Using DOM elements instead of strings should
|
||||
* improve security without compromising too much
|
||||
* performance compared with a less safe `innerHTML`.
|
||||
*
|
||||
* @param Function|Object [optional]
|
||||
* either the callback that will be invoked or an object
|
||||
* with all properties to use per each found emoji.
|
||||
*
|
||||
* Function if specified, this will be invoked per each emoji
|
||||
* that has been found through the RegExp except
|
||||
* those follwed by the invariant \uFE0E ("as text").
|
||||
* Once invoked, parameters will be:
|
||||
*
|
||||
* iconId:string the lower case HEX code point
|
||||
* i.e. "1f4a9"
|
||||
*
|
||||
* options:Object all info for this parsing operation
|
||||
*
|
||||
* variant:char the optional \uFE0F ("as image")
|
||||
* variant, in case this info
|
||||
* is anyhow meaningful.
|
||||
* By default this is ignored.
|
||||
*
|
||||
* If such callback will return a falsy value instead
|
||||
* of a valid `src` to use for the image, nothing will
|
||||
* actually change for that specific emoji.
|
||||
*
|
||||
*
|
||||
* Object if specified, an object containing the following properties
|
||||
*
|
||||
* callback Function the callback to invoke per each found emoji.
|
||||
* base string the base url, by default twemoji.base
|
||||
* ext string the image extension, by default twemoji.ext
|
||||
* size string the assets size, by default twemoji.size
|
||||
*
|
||||
* @example
|
||||
*
|
||||
* twemoji.parse("I \u2764\uFE0F emoji!");
|
||||
* // I <img class="emoji" draggable="false" alt="❤️" src="/assets/2764.gif"> emoji!
|
||||
*
|
||||
*
|
||||
* twemoji.parse("I \u2764\uFE0F emoji!", function(iconId, options) {
|
||||
* return '/assets/' + iconId + '.gif';
|
||||
* });
|
||||
* // I <img class="emoji" draggable="false" alt="❤️" src="/assets/2764.gif"> emoji!
|
||||
*
|
||||
*
|
||||
* twemoji.parse("I \u2764\uFE0F emoji!", {
|
||||
* size: 72,
|
||||
* callback: function(iconId, options) {
|
||||
* return '/assets/' + options.size + '/' + iconId + options.ext;
|
||||
* }
|
||||
* });
|
||||
* // I <img class="emoji" draggable="false" alt="❤️" src="/assets/72x72/2764.png"> emoji!
|
||||
*
|
||||
*/
|
||||
parse: parse,
|
||||
|
||||
/**
|
||||
* Given a string, invokes the callback argument
|
||||
* per each emoji found in such string.
|
||||
* This is the most raw version used by
|
||||
* the .parse(string) method itself.
|
||||
*
|
||||
* @param string generic string to parse
|
||||
* @param Function a generic callback that will be
|
||||
* invoked to replace the content.
|
||||
* This calback wil receive standard
|
||||
* String.prototype.replace(str, callback)
|
||||
* arguments such:
|
||||
* callback(
|
||||
* rawText, // the emoji match
|
||||
* );
|
||||
*
|
||||
* and others commonly received via replace.
|
||||
*/
|
||||
replace: replace,
|
||||
|
||||
/**
|
||||
* Simplify string tests against emoji.
|
||||
*
|
||||
* @param string some text that might contain emoji
|
||||
* @return boolean true if any emoji was found, false otherwise.
|
||||
*
|
||||
* @example
|
||||
*
|
||||
* if (twemoji.test(someContent)) {
|
||||
* console.log("emoji All The Things!");
|
||||
* }
|
||||
*/
|
||||
test: test
|
||||
},
|
||||
|
||||
// used to escape HTML special chars in attributes
|
||||
escaper = {
|
||||
'&': '&',
|
||||
'<': '<',
|
||||
'>': '>',
|
||||
"'": ''',
|
||||
'"': '"'
|
||||
},
|
||||
|
||||
// RegExp based on emoji's official Unicode standards
|
||||
// http://www.unicode.org/Public/UNIDATA/EmojiSources.txt
|
||||
re = /twemoji/,
|
||||
|
||||
// avoid runtime RegExp creation for not so smart,
|
||||
// not JIT based, and old browsers / engines
|
||||
UFE0Fg = /\uFE0F/g,
|
||||
|
||||
// avoid using a string literal like '\u200D' here because minifiers expand it inline
|
||||
U200D = String.fromCharCode(0x200D),
|
||||
|
||||
// used to find HTML special chars in attributes
|
||||
rescaper = /[&<>'"]/g,
|
||||
|
||||
// nodes with type 1 which should **not** be parsed (including lower case svg)
|
||||
shouldntBeParsed = /IFRAME|NOFRAMES|NOSCRIPT|SCRIPT|SELECT|STYLE|TEXTAREA|[a-z]/,
|
||||
|
||||
// just a private shortcut
|
||||
fromCharCode = String.fromCharCode;
|
||||
|
||||
return twemoji;
|
||||
|
||||
|
||||
/////////////////////////
|
||||
// private functions //
|
||||
// declaration //
|
||||
/////////////////////////
|
||||
|
||||
/**
|
||||
* Shortcut to create text nodes
|
||||
* @param string text used to create DOM text node
|
||||
* @return Node a DOM node with that text
|
||||
*/
|
||||
function createText(text) {
|
||||
return document.createTextNode(text);
|
||||
}
|
||||
|
||||
/**
|
||||
* Utility function to escape html attribute text
|
||||
* @param string text use in HTML attribute
|
||||
* @return string text encoded to use in HTML attribute
|
||||
*/
|
||||
function escapeHTML(s) {
|
||||
return s.replace(rescaper, replacer);
|
||||
}
|
||||
|
||||
/**
|
||||
* Default callback used to generate emoji src
|
||||
* based on Twitter CDN
|
||||
* @param string the emoji codepoint string
|
||||
* @param string the default size to use, i.e. "36x36"
|
||||
* @return string the image source to use
|
||||
*/
|
||||
function defaultImageSrcGenerator(icon, options) {
|
||||
return ''.concat(options.base, options.size, '/', icon, options.ext);
|
||||
}
|
||||
|
||||
/**
|
||||
* Given a generic DOM nodeType 1, walk through all children
|
||||
* and store every nodeType 3 (#text) found in the tree.
|
||||
* @param Element a DOM Element with probably some text in it
|
||||
* @param Array the list of previously discovered text nodes
|
||||
* @return Array same list with new discovered nodes, if any
|
||||
*/
|
||||
function grabAllTextNodes(node, allText) {
|
||||
var
|
||||
childNodes = node.childNodes,
|
||||
length = childNodes.length,
|
||||
subnode,
|
||||
nodeType;
|
||||
while (length--) {
|
||||
subnode = childNodes[length];
|
||||
nodeType = subnode.nodeType;
|
||||
// parse emoji only in text nodes
|
||||
if (nodeType === 3) {
|
||||
// collect them to process emoji later
|
||||
allText.push(subnode);
|
||||
}
|
||||
// ignore all nodes that are not type 1 or that
|
||||
// should not be parsed as script, style, and others
|
||||
else if (nodeType === 1 && !shouldntBeParsed.test(subnode.nodeName)) {
|
||||
grabAllTextNodes(subnode, allText);
|
||||
}
|
||||
}
|
||||
return allText;
|
||||
}
|
||||
|
||||
/**
|
||||
* Used to both remove the possible variant
|
||||
* and to convert utf16 into code points.
|
||||
* If there is a zero-width-joiner (U+200D), leave the variants in.
|
||||
* @param string the raw text of the emoji match
|
||||
*/
|
||||
function grabTheRightIcon(rawText) {
|
||||
// if variant is present as \uFE0F
|
||||
return toCodePoint(rawText.indexOf(U200D) < 0 ?
|
||||
rawText.replace(UFE0Fg, '') :
|
||||
rawText
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* DOM version of the same logic / parser:
|
||||
* emojify all found sub-text nodes placing images node instead.
|
||||
* @param Element generic DOM node with some text in some child node
|
||||
* @param Object options containing info about how to parse
|
||||
*
|
||||
* .callback Function the callback to invoke per each found emoji.
|
||||
* .base string the base url, by default twemoji.base
|
||||
* .ext string the image extension, by default twemoji.ext
|
||||
* .size string the assets size, by default twemoji.size
|
||||
*
|
||||
* @return Element same generic node with emoji in place, if any.
|
||||
*/
|
||||
function parseNode(node, options) {
|
||||
var
|
||||
allText = grabAllTextNodes(node, []),
|
||||
length = allText.length,
|
||||
attrib,
|
||||
attrname,
|
||||
modified,
|
||||
fragment,
|
||||
subnode,
|
||||
text,
|
||||
match,
|
||||
i,
|
||||
index,
|
||||
img,
|
||||
rawText,
|
||||
iconId,
|
||||
src;
|
||||
while (length--) {
|
||||
modified = false;
|
||||
fragment = document.createDocumentFragment();
|
||||
subnode = allText[length];
|
||||
text = subnode.nodeValue;
|
||||
i = 0;
|
||||
while ((match = re.exec(text))) {
|
||||
index = match.index;
|
||||
if (index !== i) {
|
||||
fragment.appendChild(
|
||||
createText(text.slice(i, index))
|
||||
);
|
||||
}
|
||||
rawText = match[0];
|
||||
iconId = grabTheRightIcon(rawText);
|
||||
i = index + rawText.length;
|
||||
src = options.callback(iconId, options);
|
||||
if (src) {
|
||||
img = new Image();
|
||||
img.onerror = options.onerror;
|
||||
img.setAttribute('draggable', 'false');
|
||||
attrib = options.attributes(rawText, iconId);
|
||||
for (attrname in attrib) {
|
||||
if (
|
||||
attrib.hasOwnProperty(attrname) &&
|
||||
// don't allow any handlers to be set + don't allow overrides
|
||||
attrname.indexOf('on') !== 0 &&
|
||||
!img.hasAttribute(attrname)
|
||||
) {
|
||||
img.setAttribute(attrname, attrib[attrname]);
|
||||
}
|
||||
}
|
||||
img.className = options.className;
|
||||
img.alt = rawText;
|
||||
img.src = src;
|
||||
modified = true;
|
||||
fragment.appendChild(img);
|
||||
}
|
||||
if (!img) fragment.appendChild(createText(rawText));
|
||||
img = null;
|
||||
}
|
||||
// is there actually anything to replace in here ?
|
||||
if (modified) {
|
||||
// any text left to be added ?
|
||||
if (i < text.length) {
|
||||
fragment.appendChild(
|
||||
createText(text.slice(i))
|
||||
);
|
||||
}
|
||||
// replace the text node only, leave intact
|
||||
// anything else surrounding such text
|
||||
subnode.parentNode.replaceChild(fragment, subnode);
|
||||
}
|
||||
}
|
||||
return node;
|
||||
}
|
||||
|
||||
/**
|
||||
* String/HTML version of the same logic / parser:
|
||||
* emojify a generic text placing images tags instead of surrogates pair.
|
||||
* @param string generic string with possibly some emoji in it
|
||||
* @param Object options containing info about how to parse
|
||||
*
|
||||
* .callback Function the callback to invoke per each found emoji.
|
||||
* .base string the base url, by default twemoji.base
|
||||
* .ext string the image extension, by default twemoji.ext
|
||||
* .size string the assets size, by default twemoji.size
|
||||
*
|
||||
* @return the string with <img tags> replacing all found and parsed emoji
|
||||
*/
|
||||
function parseString(str, options) {
|
||||
return replace(str, function (rawText) {
|
||||
var
|
||||
ret = rawText,
|
||||
iconId = grabTheRightIcon(rawText),
|
||||
src = options.callback(iconId, options),
|
||||
attrib,
|
||||
attrname;
|
||||
if (src) {
|
||||
// recycle the match string replacing the emoji
|
||||
// with its image counter part
|
||||
ret = '<img '.concat(
|
||||
'class="', options.className, '" ',
|
||||
'draggable="false" ',
|
||||
// needs to preserve user original intent
|
||||
// when variants should be copied and pasted too
|
||||
'alt="',
|
||||
rawText,
|
||||
'"',
|
||||
' src="',
|
||||
src,
|
||||
'"'
|
||||
);
|
||||
attrib = options.attributes(rawText, iconId);
|
||||
for (attrname in attrib) {
|
||||
if (
|
||||
attrib.hasOwnProperty(attrname) &&
|
||||
// don't allow any handlers to be set + don't allow overrides
|
||||
attrname.indexOf('on') !== 0 &&
|
||||
ret.indexOf(' ' + attrname + '=') === -1
|
||||
) {
|
||||
ret = ret.concat(' ', attrname, '="', escapeHTML(attrib[attrname]), '"');
|
||||
}
|
||||
}
|
||||
ret = ret.concat('>');
|
||||
}
|
||||
return ret;
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Function used to actually replace HTML special chars
|
||||
* @param string HTML special char
|
||||
* @return string encoded HTML special char
|
||||
*/
|
||||
function replacer(m) {
|
||||
return escaper[m];
|
||||
}
|
||||
|
||||
/**
|
||||
* Default options.attribute callback
|
||||
* @return null
|
||||
*/
|
||||
function returnNull() {
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Given a generic value, creates its squared counterpart if it's a number.
|
||||
* As example, number 36 will return '36x36'.
|
||||
* @param any a generic value.
|
||||
* @return any a string representing asset size, i.e. "36x36"
|
||||
* only in case the value was a number.
|
||||
* Returns initial value otherwise.
|
||||
*/
|
||||
function toSizeSquaredAsset(value) {
|
||||
return typeof value === 'number' ?
|
||||
value + 'x' + value :
|
||||
value;
|
||||
}
|
||||
|
||||
|
||||
/////////////////////////
|
||||
// exported functions //
|
||||
// declaration //
|
||||
/////////////////////////
|
||||
|
||||
function fromCodePoint(codepoint) {
|
||||
var code = typeof codepoint === 'string' ?
|
||||
parseInt(codepoint, 16) : codepoint;
|
||||
if (code < 0x10000) {
|
||||
return fromCharCode(code);
|
||||
}
|
||||
code -= 0x10000;
|
||||
return fromCharCode(
|
||||
0xD800 + (code >> 10),
|
||||
0xDC00 + (code & 0x3FF)
|
||||
);
|
||||
}
|
||||
|
||||
function parse(what, how) {
|
||||
if (!how || typeof how === 'function') {
|
||||
how = {callback: how};
|
||||
}
|
||||
// if first argument is string, inject html <img> tags
|
||||
// otherwise use the DOM tree and parse text nodes only
|
||||
return (typeof what === 'string' ? parseString : parseNode)(what, {
|
||||
callback: how.callback || defaultImageSrcGenerator,
|
||||
attributes: typeof how.attributes === 'function' ? how.attributes : returnNull,
|
||||
base: typeof how.base === 'string' ? how.base : twemoji.base,
|
||||
ext: how.ext || twemoji.ext,
|
||||
size: how.folder || toSizeSquaredAsset(how.size || twemoji.size),
|
||||
className: how.className || twemoji.className,
|
||||
onerror: how.onerror || twemoji.onerror
|
||||
});
|
||||
}
|
||||
|
||||
function replace(text, callback) {
|
||||
return String(text).replace(re, callback);
|
||||
}
|
||||
|
||||
function test(text) {
|
||||
// IE6 needs a reset before too
|
||||
re.lastIndex = 0;
|
||||
var result = re.test(text);
|
||||
re.lastIndex = 0;
|
||||
return result;
|
||||
}
|
||||
|
||||
function toCodePoint(unicodeSurrogates, sep) {
|
||||
var
|
||||
r = [],
|
||||
c = 0,
|
||||
p = 0,
|
||||
i = 0;
|
||||
while (i < unicodeSurrogates.length) {
|
||||
c = unicodeSurrogates.charCodeAt(i++);
|
||||
if (p) {
|
||||
r.push((0x10000 + ((p - 0xD800) << 10) + (c - 0xDC00)).toString(16));
|
||||
p = 0;
|
||||
} else if (0xD800 <= c && c <= 0xDBFF) {
|
||||
p = c;
|
||||
} else {
|
||||
r.push(c.toString(16));
|
||||
}
|
||||
}
|
||||
return r.join(sep || '-');
|
||||
}
|
||||
|
||||
}.toString()
|
||||
// drop current indentation
|
||||
.replace(/^ /gm, '')
|
||||
// add the RegExp in the right place
|
||||
.replace('re = /twemoji/', 're = /' + re + '/g')
|
||||
// add the full license
|
||||
.replace('/*! (C) Twitter Inc. */',
|
||||
'/*! (C) Twitter Inc. *//*\n' +
|
||||
fs.readFileSync(path.join(__dirname, '../../', 'LICENSE')).toString().replace(
|
||||
/^./gm, ' '
|
||||
) +
|
||||
'\n */'
|
||||
) + '());');
|
||||
}
|
||||
44
1/utils/preview
Executable file
44
1/utils/preview
Executable file
|
|
@ -0,0 +1,44 @@
|
|||
#!/usr/bin/env node
|
||||
|
||||
/*! Copyright Twitter Inc. and other contributors. Licensed under MIT *//*
|
||||
https://github.com/twitter/twemoji/blob/gh-pages/LICENSE
|
||||
*/
|
||||
|
||||
// dependencies
|
||||
var fs = require('fs');
|
||||
var path = require('path');
|
||||
|
||||
function file(which) {
|
||||
return path.join(__dirname, '..', which);
|
||||
}
|
||||
|
||||
fs.readdir(file('../assets'), function (err, files) {
|
||||
var page = fs.readFileSync(file('templates/preview.html')).toString().replace(
|
||||
'{{emoji-list}}',
|
||||
'<li>' + files.map(function (file) {
|
||||
return file.replace('.ai', '').split('-').map(function (hex) {
|
||||
return '&#x' + hex.toUpperCase() + ';';
|
||||
}).join('');
|
||||
}).join('</li>\n <li>')+ '</li>'
|
||||
);
|
||||
fs.writeFileSync(
|
||||
file('test/preview.html'),
|
||||
page.replace(
|
||||
'{{emoji-options}}',
|
||||
JSON.stringify({
|
||||
size: 72
|
||||
})
|
||||
)
|
||||
);
|
||||
fs.writeFileSync(
|
||||
file('test/preview-svg.html'),
|
||||
page.replace(
|
||||
'{{emoji-options}}',
|
||||
JSON.stringify({
|
||||
folder: '../svg',
|
||||
ext: '.svg',
|
||||
base: ''
|
||||
})
|
||||
)
|
||||
);
|
||||
});
|
||||
6
1/utils/size
Executable file
6
1/utils/size
Executable file
|
|
@ -0,0 +1,6 @@
|
|||
#!/usr/bin/env bash
|
||||
|
||||
echo "twemoji.js $(cat 1/twemoji.js | wc -c)"
|
||||
echo "twemoji.js gzipped $(gzip -c 1/twemoji.js | wc -c)"
|
||||
echo "twemoji.min.js $(cat 1/twemoji.min.js | wc -c)"
|
||||
echo "twemoji.min.js gzipped $(gzip -c 1/twemoji.min.js | wc -c)"
|
||||
Loading…
Reference in New Issue
Block a user