generate symbols file from svg emojis

.gitignore

@@ -1,3 +1,5 @@
 .DS_Store
 node_modules/
 build
+symbols.svg
+symbols.html

gen-symbols.js

@@ -0,0 +1,99 @@
+var fs = require('fs');
+var path = require('path');
+
+var async = require('async');
+var SVGO = require('svgo');
+var cheerio = require('cheerio');
+
+function findFiles(callback) {
+  fs.readdir('svg', function (err, files) {
+    if (err) {
+      callback(err);
+    } else {
+      callback(null, files.filter(function (filename) {
+        return /\.svg$/.test(filename);
+      }).map(function (filename) {
+        return path.resolve('svg', filename);
+      }));
+    }
+  });
+}
+
+function readFile(filename, callback) {
+  fs.readFile(filename, 'utf-8', function (err, content) {
+    if (err) {
+      callback(err);
+    } else {
+      callback(null, {
+        filename: filename,
+        content: content
+      });
+    }
+  });
+}
+
+function readFiles(files, callback) {
+  async.mapLimit(files, 10, readFile, callback);
+}
+
+function optimizeFile(data, callback) {
+  var svgo = new SVGO();
+  svgo.optimize(data.content, function (result) {
+    setImmediate(function() {
+      callback(null, {
+        filename: data.filename,
+        content: result.data
+      });
+    });
+  });
+}
+
+function optimizeFiles(files, callback) {
+  async.mapSeries(files, optimizeFile, callback);
+}
+
+function createSymbols(files, callback) {
+  var doc = cheerio('<svg xmlns="http://www.w3.org/2000/svg"/>');
+  var names = [];
+  files.forEach(function (file) {
+    var name = path.basename(file.filename, '.svg');
+    var svg = cheerio(file.content);
+    var symbol = cheerio('<symbol/>');
+    symbol.attr('viewBox', svg.attr('viewbox'));
+    symbol.attr('id', name);
+    symbol.append(svg.children());
+    doc.append(symbol);
+    names.push(name);
+  });
+  callback(null, {
+    svg: doc.toString(),
+    names: names
+  });
+}
+
+function writeSymbolsFile(data, callback) {
+  async.parallel([
+    function (callback) {
+      fs.writeFile('symbols.svg', data.svg, callback);
+    },
+    function (callback) {
+      var html = '';
+      data.names.forEach(function (name) {
+        html += '<svg style="width: 30px; height: 30px;"><use xlink:href="symbols.svg#' + name + '"></svg>';
+      });
+      fs.writeFile('symbols.html', html, callback);
+    }
+  ], callback);
+}
+
+async.waterfall([
+  findFiles,
+  readFiles,
+  optimizeFiles,
+  createSymbols,
+  writeSymbolsFile
+], function (err) {
+  if (err) {
+    console.error('fail: ', err);
+  }
+});

package.json

@@ -17,8 +17,10 @@
     "unicode"
   ],
   "devDependencies": {
-    "uglify-js": "2.6.2",
+    "async": "^2.4.1",
-    "phantomjs-prebuilt": "2.1.4"
+    "phantomjs-prebuilt": "2.1.4",
+    "svgo": "^0.7.2",
+    "uglify-js": "2.6.2"
   },
   "author": {
     "name": "Twitter, Inc.",