diff --git a/helpers/add-background.js b/helpers/add-background.js new file mode 100644 index 000000000..515c44b78 --- /dev/null +++ b/helpers/add-background.js @@ -0,0 +1,65 @@ +#!/usr/bin/env node + + +const path = require('path'); +const fs = require('fs'); +const SVGO = require('svgo'); + +const openmojis = require("../data/openmoji.json"); + +const { + createDoc +} = require('../test/utils/utils'); + +svgo = new SVGO(); + +openmojis.forEach(emoji => { + const svgFile = path.join("src", emoji.group, emoji.subgroups, emoji.hexcode + '.svg') + const doc = createDoc(emoji); + + const root = doc.querySelector("#emoji") + + // create background and insert it + const backgroundGroup = doc.createElement('g') + backgroundGroup.setAttribute('id', "white-padding") + backgroundGroup.setAttribute('stroke-linecap', "round") + backgroundGroup.setAttribute('stroke-miterlimit', "10") + backgroundGroup.setAttribute('stroke-width', "6") + backgroundGroup.setAttribute('stroke', "#fff") + backgroundGroup.setAttribute('fill', "none") + backgroundGroup.setAttribute('stroke-linejoin', "round") + + const beforeNode = doc.querySelector("#grid").nextSibling + root.insertBefore(backgroundGroup, beforeNode) + + + // duplicate all but grid + var nongrid = doc.querySelectorAll('svg > :not(#grid):not(#white-padding)'); + console.log(nongrid.length); + for (var value of nongrid.values()) { + console.log(value.id); + + backgroundGroup.appendChild(value.cloneNode(true)) + } + + // remove fill and stroke attributes + var items = backgroundGroup.getElementsByTagName("*"); + for (let item of items) { + item.removeAttribute("fill"); + item.removeAttribute("stroke"); + item.removeAttribute("stroke-linecap"); + item.removeAttribute("stroke-linejoin"); + item.removeAttribute("stroke-miterlimit"); + item.removeAttribute("stroke-width"); + } + + svgo.optimize(doc.documentElement.querySelector("svg").outerHTML).then(function (result) { + svgo.optimize(result.data).then(function (result) { + + fs.writeFile(svgFile, result.data, function (err) { + if (err) return console.log(err); + console.log('Successful'); + }); + }); + }); +}) \ No newline at end of file diff --git a/package.json b/package.json index e0e767a15..e0038a3c4 100644 --- a/package.json +++ b/package.json @@ -32,7 +32,8 @@ "generate": "./helpers/generate.sh", "generate-font": "./helpers/generate-fonts.sh", "cache-clear": "for ref in export-png-618 export-png-72 export-svg-color export-svg-skintones pretty-src-svg; do git update-ref -d refs/memos/$ref; done", - "cc": "npm run cache-clear" + "cc": "npm run cache-clear", + "add-background": "node helpers/add-background.js --openmoji-src-folder $PWD/src" }, "engines": { "node": "8.x"