build.js 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611
  1. #!/usr/bin/env node
  2. /*! Copyright Twitter Inc. and other contributors. Licensed under MIT *//*
  3. https://github.com/twitter/twemoji/blob/gh-pages/LICENSE
  4. */
  5. // dependencies
  6. var fs = require('fs');
  7. var http = require('http');
  8. var path = require('path');
  9. var Utils = require('./utils');
  10. var regex = require('twemoji-parser/dist/lib/regex').default;
  11. var { version } = require('../package.json');
  12. function file(which) {
  13. return path.join(__dirname, '..', which);
  14. }
  15. function createTwemoji() {
  16. fs.mkdirSync('dist/',{ recursive: true })
  17. fs.writeFileSync(
  18. file('dist/twemoji.js'),
  19. '/*jslint indent: 2, browser: true, bitwise: true, plusplus: true */\n' +
  20. 'var twemoji = (' +
  21. function (
  22. /*! Copyright Twitter Inc. and other contributors. Licensed under MIT *//*
  23. https://github.com/twitter/twemoji/blob/gh-pages/LICENSE
  24. */
  25. // WARNING: this file is generated automatically via
  26. // `node scripts/build.js`
  27. // please update its `createTwemoji` function
  28. // at the bottom of the same file instead.
  29. ) {
  30. 'use strict';
  31. /*jshint maxparams:4 */
  32. var
  33. // the exported module object
  34. twemoji = {
  35. /////////////////////////
  36. // properties //
  37. /////////////////////////
  38. // default assets url, by default will be Twitter Inc. CDN
  39. base: 'https://cdnjs.cloudflare.com/ajax/libs/twemoji/$VERSION/',
  40. // default assets file extensions, by default '.png'
  41. ext: '.png',
  42. // default assets/folder size, by default "72x72"
  43. // available via Twitter CDN: 72
  44. size: '72x72',
  45. // default class name, by default 'emoji'
  46. className: 'emoji',
  47. // basic utilities / helpers to convert code points
  48. // to JavaScript surrogates and vice versa
  49. convert: {
  50. /**
  51. * Given an HEX codepoint, returns UTF16 surrogate pairs.
  52. *
  53. * @param string generic codepoint, i.e. '1F4A9'
  54. * @return string codepoint transformed into utf16 surrogates pair,
  55. * i.e. \uD83D\uDCA9
  56. *
  57. * @example
  58. * twemoji.convert.fromCodePoint('1f1e8');
  59. * // "\ud83c\udde8"
  60. *
  61. * '1f1e8-1f1f3'.split('-').map(twemoji.convert.fromCodePoint).join('')
  62. * // "\ud83c\udde8\ud83c\uddf3"
  63. */
  64. fromCodePoint: fromCodePoint,
  65. /**
  66. * Given UTF16 surrogate pairs, returns the equivalent HEX codepoint.
  67. *
  68. * @param string generic utf16 surrogates pair, i.e. \uD83D\uDCA9
  69. * @param string optional separator for double code points, default='-'
  70. * @return string utf16 transformed into codepoint, i.e. '1F4A9'
  71. *
  72. * @example
  73. * twemoji.convert.toCodePoint('\ud83c\udde8\ud83c\uddf3');
  74. * // "1f1e8-1f1f3"
  75. *
  76. * twemoji.convert.toCodePoint('\ud83c\udde8\ud83c\uddf3', '~');
  77. * // "1f1e8~1f1f3"
  78. */
  79. toCodePoint: toCodePoint
  80. },
  81. /////////////////////////
  82. // methods //
  83. /////////////////////////
  84. /**
  85. * User first: used to remove missing images
  86. * preserving the original text intent when
  87. * a fallback for network problems is desired.
  88. * Automatically added to Image nodes via DOM
  89. * It could be recycled for string operations via:
  90. * $('img.emoji').on('error', twemoji.onerror)
  91. */
  92. onerror: function onerror() {
  93. if (this.parentNode) {
  94. this.parentNode.replaceChild(createText(this.alt, false), this);
  95. }
  96. },
  97. /**
  98. * Main method/logic to generate either <img> tags or HTMLImage nodes.
  99. * "emojify" a generic text or DOM Element.
  100. *
  101. * @overloads
  102. *
  103. * String replacement for `innerHTML` or server side operations
  104. * twemoji.parse(string);
  105. * twemoji.parse(string, Function);
  106. * twemoji.parse(string, Object);
  107. *
  108. * HTMLElement tree parsing for safer operations over existing DOM
  109. * twemoji.parse(HTMLElement);
  110. * twemoji.parse(HTMLElement, Function);
  111. * twemoji.parse(HTMLElement, Object);
  112. *
  113. * @param string|HTMLElement the source to parse and enrich with emoji.
  114. *
  115. * string replace emoji matches with <img> tags.
  116. * Mainly used to inject emoji via `innerHTML`
  117. * It does **not** parse the string or validate it,
  118. * it simply replaces found emoji with a tag.
  119. * NOTE: be sure this won't affect security.
  120. *
  121. * HTMLElement walk through the DOM tree and find emoji
  122. * that are inside **text node only** (nodeType === 3)
  123. * Mainly used to put emoji in already generated DOM
  124. * without compromising surrounding nodes and
  125. * **avoiding** the usage of `innerHTML`.
  126. * NOTE: Using DOM elements instead of strings should
  127. * improve security without compromising too much
  128. * performance compared with a less safe `innerHTML`.
  129. *
  130. * @param Function|Object [optional]
  131. * either the callback that will be invoked or an object
  132. * with all properties to use per each found emoji.
  133. *
  134. * Function if specified, this will be invoked per each emoji
  135. * that has been found through the RegExp except
  136. * those follwed by the invariant \uFE0E ("as text").
  137. * Once invoked, parameters will be:
  138. *
  139. * iconId:string the lower case HEX code point
  140. * i.e. "1f4a9"
  141. *
  142. * options:Object all info for this parsing operation
  143. *
  144. * variant:char the optional \uFE0F ("as image")
  145. * variant, in case this info
  146. * is anyhow meaningful.
  147. * By default this is ignored.
  148. *
  149. * If such callback will return a falsy value instead
  150. * of a valid `src` to use for the image, nothing will
  151. * actually change for that specific emoji.
  152. *
  153. *
  154. * Object if specified, an object containing the following properties
  155. *
  156. * callback Function the callback to invoke per each found emoji.
  157. * base string the base url, by default twemoji.base
  158. * ext string the image extension, by default twemoji.ext
  159. * size string the assets size, by default twemoji.size
  160. *
  161. * @example
  162. *
  163. * twemoji.parse("I \u2764\uFE0F emoji!");
  164. * // I <img class="emoji" draggable="false" alt="❤️" src="/assets/2764.gif"/> emoji!
  165. *
  166. *
  167. * twemoji.parse("I \u2764\uFE0F emoji!", function(iconId, options) {
  168. * return '/assets/' + iconId + '.gif';
  169. * });
  170. * // I <img class="emoji" draggable="false" alt="❤️" src="/assets/2764.gif"/> emoji!
  171. *
  172. *
  173. * twemoji.parse("I \u2764\uFE0F emoji!", {
  174. * size: 72,
  175. * callback: function(iconId, options) {
  176. * return '/assets/' + options.size + '/' + iconId + options.ext;
  177. * }
  178. * });
  179. * // I <img class="emoji" draggable="false" alt="❤️" src="/assets/72x72/2764.png"/> emoji!
  180. *
  181. */
  182. parse: parse,
  183. /**
  184. * Given a string, invokes the callback argument
  185. * per each emoji found in such string.
  186. * This is the most raw version used by
  187. * the .parse(string) method itself.
  188. *
  189. * @param string generic string to parse
  190. * @param Function a generic callback that will be
  191. * invoked to replace the content.
  192. * This callback will receive standard
  193. * String.prototype.replace(str, callback)
  194. * arguments such:
  195. * callback(
  196. * rawText, // the emoji match
  197. * );
  198. *
  199. * and others commonly received via replace.
  200. */
  201. replace: replace,
  202. /**
  203. * Simplify string tests against emoji.
  204. *
  205. * @param string some text that might contain emoji
  206. * @return boolean true if any emoji was found, false otherwise.
  207. *
  208. * @example
  209. *
  210. * if (twemoji.test(someContent)) {
  211. * console.log("emoji All The Things!");
  212. * }
  213. */
  214. test: test
  215. },
  216. // used to escape HTML special chars in attributes
  217. escaper = {
  218. '&': '&amp;',
  219. '<': '&lt;',
  220. '>': '&gt;',
  221. "'": '&#39;',
  222. '"': '&quot;'
  223. },
  224. // RegExp based on emoji's official Unicode standards
  225. // http://www.unicode.org/Public/UNIDATA/EmojiSources.txt
  226. re = /twemoji/,
  227. // avoid runtime RegExp creation for not so smart,
  228. // not JIT based, and old browsers / engines
  229. UFE0Fg = /\uFE0F/g,
  230. // avoid using a string literal like '\u200D' here because minifiers expand it inline
  231. U200D = String.fromCharCode(0x200D),
  232. // used to find HTML special chars in attributes
  233. rescaper = /[&<>'"]/g,
  234. // nodes with type 1 which should **not** be parsed
  235. shouldntBeParsed = /^(?:iframe|noframes|noscript|script|select|style|textarea)$/,
  236. // just a private shortcut
  237. fromCharCode = String.fromCharCode;
  238. return twemoji;
  239. /////////////////////////
  240. // private functions //
  241. // declaration //
  242. /////////////////////////
  243. /**
  244. * Shortcut to create text nodes
  245. * @param string text used to create DOM text node
  246. * @return Node a DOM node with that text
  247. */
  248. function createText(text, clean) {
  249. return document.createTextNode(clean ? text.replace(UFE0Fg, '') : text);
  250. }
  251. /**
  252. * Utility function to escape html attribute text
  253. * @param string text use in HTML attribute
  254. * @return string text encoded to use in HTML attribute
  255. */
  256. function escapeHTML(s) {
  257. return s.replace(rescaper, replacer);
  258. }
  259. /**
  260. * Default callback used to generate emoji src
  261. * based on Twitter CDN
  262. * @param string the emoji codepoint string
  263. * @param string the default size to use, i.e. "36x36"
  264. * @return string the image source to use
  265. */
  266. function defaultImageSrcGenerator(icon, options) {
  267. return ''.concat(options.base, options.size, '/', icon, options.ext);
  268. }
  269. /**
  270. * Given a generic DOM nodeType 1, walk through all children
  271. * and store every nodeType 3 (#text) found in the tree.
  272. * @param Element a DOM Element with probably some text in it
  273. * @param Array the list of previously discovered text nodes
  274. * @return Array same list with new discovered nodes, if any
  275. */
  276. function grabAllTextNodes(node, allText) {
  277. var
  278. childNodes = node.childNodes,
  279. length = childNodes.length,
  280. subnode,
  281. nodeType;
  282. while (length--) {
  283. subnode = childNodes[length];
  284. nodeType = subnode.nodeType;
  285. // parse emoji only in text nodes
  286. if (nodeType === 3) {
  287. // collect them to process emoji later
  288. allText.push(subnode);
  289. }
  290. // ignore all nodes that are not type 1, that are svg, or that
  291. // should not be parsed as script, style, and others
  292. else if (nodeType === 1 && !('ownerSVGElement' in subnode) &&
  293. !shouldntBeParsed.test(subnode.nodeName.toLowerCase())) {
  294. grabAllTextNodes(subnode, allText);
  295. }
  296. }
  297. return allText;
  298. }
  299. /**
  300. * Used to both remove the possible variant
  301. * and to convert utf16 into code points.
  302. * If there is a zero-width-joiner (U+200D), leave the variants in.
  303. * @param string the raw text of the emoji match
  304. * @return string the code point
  305. */
  306. function grabTheRightIcon(rawText) {
  307. // if variant is present as \uFE0F
  308. return toCodePoint(rawText.indexOf(U200D) < 0 ?
  309. rawText.replace(UFE0Fg, '') :
  310. rawText
  311. );
  312. }
  313. /**
  314. * DOM version of the same logic / parser:
  315. * emojify all found sub-text nodes placing images node instead.
  316. * @param Element generic DOM node with some text in some child node
  317. * @param Object options containing info about how to parse
  318. *
  319. * .callback Function the callback to invoke per each found emoji.
  320. * .base string the base url, by default twemoji.base
  321. * .ext string the image extension, by default twemoji.ext
  322. * .size string the assets size, by default twemoji.size
  323. *
  324. * @return Element same generic node with emoji in place, if any.
  325. */
  326. function parseNode(node, options) {
  327. var
  328. allText = grabAllTextNodes(node, []),
  329. length = allText.length,
  330. attrib,
  331. attrname,
  332. modified,
  333. fragment,
  334. subnode,
  335. text,
  336. match,
  337. i,
  338. index,
  339. img,
  340. rawText,
  341. iconId,
  342. src;
  343. while (length--) {
  344. modified = false;
  345. fragment = document.createDocumentFragment();
  346. subnode = allText[length];
  347. text = subnode.nodeValue;
  348. i = 0;
  349. while ((match = re.exec(text))) {
  350. index = match.index;
  351. if (index !== i) {
  352. fragment.appendChild(
  353. createText(text.slice(i, index), true)
  354. );
  355. }
  356. rawText = match[0];
  357. iconId = grabTheRightIcon(rawText);
  358. i = index + rawText.length;
  359. src = options.callback(iconId, options);
  360. if (iconId && src) {
  361. img = new Image();
  362. img.onerror = options.onerror;
  363. img.setAttribute('draggable', 'false');
  364. attrib = options.attributes(rawText, iconId);
  365. for (attrname in attrib) {
  366. if (
  367. attrib.hasOwnProperty(attrname) &&
  368. // don't allow any handlers to be set + don't allow overrides
  369. attrname.indexOf('on') !== 0 &&
  370. !img.hasAttribute(attrname)
  371. ) {
  372. img.setAttribute(attrname, attrib[attrname]);
  373. }
  374. }
  375. img.className = options.className;
  376. img.alt = rawText;
  377. img.src = src;
  378. modified = true;
  379. fragment.appendChild(img);
  380. }
  381. if (!img) fragment.appendChild(createText(rawText, false));
  382. img = null;
  383. }
  384. // is there actually anything to replace in here ?
  385. if (modified) {
  386. // any text left to be added ?
  387. if (i < text.length) {
  388. fragment.appendChild(
  389. createText(text.slice(i), true)
  390. );
  391. }
  392. // replace the text node only, leave intact
  393. // anything else surrounding such text
  394. subnode.parentNode.replaceChild(fragment, subnode);
  395. }
  396. }
  397. return node;
  398. }
  399. /**
  400. * String/HTML version of the same logic / parser:
  401. * emojify a generic text placing images tags instead of surrogates pair.
  402. * @param string generic string with possibly some emoji in it
  403. * @param Object options containing info about how to parse
  404. *
  405. * .callback Function the callback to invoke per each found emoji.
  406. * .base string the base url, by default twemoji.base
  407. * .ext string the image extension, by default twemoji.ext
  408. * .size string the assets size, by default twemoji.size
  409. *
  410. * @return the string with <img tags> replacing all found and parsed emoji
  411. */
  412. function parseString(str, options) {
  413. return replace(str, function (rawText) {
  414. var
  415. ret = rawText,
  416. iconId = grabTheRightIcon(rawText),
  417. src = options.callback(iconId, options),
  418. attrib,
  419. attrname;
  420. if (iconId && src) {
  421. // recycle the match string replacing the emoji
  422. // with its image counter part
  423. ret = '<img '.concat(
  424. 'class="', options.className, '" ',
  425. 'draggable="false" ',
  426. // needs to preserve user original intent
  427. // when variants should be copied and pasted too
  428. 'alt="',
  429. rawText,
  430. '"',
  431. ' src="',
  432. src,
  433. '"'
  434. );
  435. attrib = options.attributes(rawText, iconId);
  436. for (attrname in attrib) {
  437. if (
  438. attrib.hasOwnProperty(attrname) &&
  439. // don't allow any handlers to be set + don't allow overrides
  440. attrname.indexOf('on') !== 0 &&
  441. ret.indexOf(' ' + attrname + '=') === -1
  442. ) {
  443. ret = ret.concat(' ', attrname, '="', escapeHTML(attrib[attrname]), '"');
  444. }
  445. }
  446. ret = ret.concat('/>');
  447. }
  448. return ret;
  449. });
  450. }
  451. /**
  452. * Function used to actually replace HTML special chars
  453. * @param string HTML special char
  454. * @return string encoded HTML special char
  455. */
  456. function replacer(m) {
  457. return escaper[m];
  458. }
  459. /**
  460. * Default options.attribute callback
  461. * @return null
  462. */
  463. function returnNull() {
  464. return null;
  465. }
  466. /**
  467. * Given a generic value, creates its squared counterpart if it's a number.
  468. * As example, number 36 will return '36x36'.
  469. * @param any a generic value.
  470. * @return any a string representing asset size, i.e. "36x36"
  471. * only in case the value was a number.
  472. * Returns initial value otherwise.
  473. */
  474. function toSizeSquaredAsset(value) {
  475. return typeof value === 'number' ?
  476. value + 'x' + value :
  477. value;
  478. }
  479. /////////////////////////
  480. // exported functions //
  481. // declaration //
  482. /////////////////////////
  483. function fromCodePoint(codepoint) {
  484. var code = typeof codepoint === 'string' ?
  485. parseInt(codepoint, 16) : codepoint;
  486. if (code < 0x10000) {
  487. return fromCharCode(code);
  488. }
  489. code -= 0x10000;
  490. return fromCharCode(
  491. 0xD800 + (code >> 10),
  492. 0xDC00 + (code & 0x3FF)
  493. );
  494. }
  495. function parse(what, how) {
  496. if (!how || typeof how === 'function') {
  497. how = {callback: how};
  498. }
  499. // if first argument is string, inject html <img> tags
  500. // otherwise use the DOM tree and parse text nodes only
  501. return (typeof what === 'string' ? parseString : parseNode)(what, {
  502. callback: how.callback || defaultImageSrcGenerator,
  503. attributes: typeof how.attributes === 'function' ? how.attributes : returnNull,
  504. base: typeof how.base === 'string' ? how.base : twemoji.base,
  505. ext: how.ext || twemoji.ext,
  506. size: how.folder || toSizeSquaredAsset(how.size || twemoji.size),
  507. className: how.className || twemoji.className,
  508. onerror: how.onerror || twemoji.onerror
  509. });
  510. }
  511. function replace(text, callback) {
  512. return String(text).replace(re, callback);
  513. }
  514. function test(text) {
  515. // IE6 needs a reset before too
  516. re.lastIndex = 0;
  517. var result = re.test(text);
  518. re.lastIndex = 0;
  519. return result;
  520. }
  521. function toCodePoint(unicodeSurrogates, sep) {
  522. var
  523. r = [],
  524. c = 0,
  525. p = 0,
  526. i = 0;
  527. while (i < unicodeSurrogates.length) {
  528. c = unicodeSurrogates.charCodeAt(i++);
  529. if (p) {
  530. r.push((0x10000 + ((p - 0xD800) << 10) + (c - 0xDC00)).toString(16));
  531. p = 0;
  532. } else if (0xD800 <= c && c <= 0xDBFF) {
  533. p = c;
  534. } else {
  535. r.push(c.toString(16));
  536. }
  537. }
  538. return r.join(sep || '-');
  539. }
  540. }.toString()
  541. // drop current indentation
  542. .replace(/^ /gm, '')
  543. // add the RegExp in the right place
  544. .replace('re = /twemoji/', `re = ${regex.toString()}`)
  545. .replace('$VERSION', version)
  546. // add the full license
  547. .replace('/*! (C) Twitter Inc. */',
  548. '/*! (C) Twitter Inc. *//*\n' +
  549. fs.readFileSync(file('LICENSE')).toString().replace(
  550. /^./gm, ' '
  551. ) +
  552. '\n */'
  553. ) + '());');
  554. }
  555. createTwemoji();
  556. require('./create-dist');
  557. require('./preview');