From fa4092203da012fae69d58da987c091fe3946cea Mon Sep 17 00:00:00 2001 From: kevinkace Date: Wed, 1 Mar 2017 09:12:03 -0800 Subject: [PATCH] Don't add symbols to (version bump), update readme, and code comments --- README.md | 21 ++++++------ debug.log | 2 -- lib/index.js | 55 +++++++++++++++++-------------- package.json | 2 +- test/fixtures/output.svg | 2 -- test/fixtures/output/expected.svg | 2 -- 6 files changed, 42 insertions(+), 42 deletions(-) delete mode 100644 debug.log diff --git a/README.md b/README.md index df807a4..062a45a 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,8 @@ # svg-spritzer +*Note:* I made this before finding out about [svgstore](https://github.com/svgstore/svgstore), (this is why you put a delimiter between identifyers!). +It has more features, support, and likely a better future. + ![](https://media.giphy.com/media/3orif3jbFCSDlr9G3m/giphy.gif) Sprite SVGs into a single SVG like this: @@ -8,16 +11,14 @@ Sprite SVGs into a single SVG like this: - - - icon1 - - - - icon2 - - - + + icon1 + + + + icon2 + + ``` diff --git a/debug.log b/debug.log deleted file mode 100644 index 16ee2c1..0000000 --- a/debug.log +++ /dev/null @@ -1,2 +0,0 @@ -[0203/131446:ERROR:tcp_listen_socket.cc(76)] Could not bind socket to 127.0.0.1:6004 -[0203/131446:ERROR:node_debugger.cc(86)] Cannot start debugger server diff --git a/lib/index.js b/lib/index.js index d7d6ea1..918b56c 100644 --- a/lib/index.js +++ b/lib/index.js @@ -1,33 +1,32 @@ "use strict"; -const path = require("path"), +const path = require("path"), fsp = require("fs-promise"), globule = require("globule"), parser = require("svg-parser"), - eol = require("os").EOL, + eol = "\n", doubleLine = new RegExp(eol + eol, "g"); + +// input: array of SVG objects (`[{ name : "svg", attributes : {}, children : [] }, {}]) +// output: the sprited SVG object (same format as the input), all input SVGs within a `` function sprite(svgObjs) { const svg = { - name : "svg", - children : [], - attributes : { - style : "position: absolute; width: 0; height: 0;", - width : 0, - height : 0, - version : "1.1", - xmlns : "http://www.w3.org/2000/svg", - "xmlns:xlink" : "http://www.w3.org/1999/xlink" - } - }, - defs = { - name : "defs", - children : [] - }; - - // create a symbol for each icon, and push to defs.children + name : "svg", + children : [], + attributes : { + style : "position: absolute; width: 0; height: 0;", + width : 0, + height : 0, + version : "1.1", + xmlns : "http://www.w3.org/2000/svg", + "xmlns:xlink" : "http://www.w3.org/1999/xlink" + } + }; + + // create a symbol for each icon, and push to svg.children svgObjs.forEach((svgObj) => { let children = [{ name : "title", @@ -44,15 +43,16 @@ function sprite(svgObjs) { } }; - defs.children.push(symbol); + // add symbol to svg + svg.children.push(symbol); }); - // add defs to svg - svg.children.push(defs); - return svg; } + +// input: tag object +// output: SVG string of tag object, is called recursively on children function render(el) { let rendered = "", renderedChildren = ""; @@ -65,8 +65,7 @@ function render(el) { rendered += `<${el.name}`; // attrs - // eslint-disable-next-line keyword-spacing - for(let attribute in (el.attributes || {})) { + for(let attribute in (el.attributes || {})) { // eslint-disable-line keyword-spacing rendered += ` ${attribute}="${el.attributes[attribute]}"`; } @@ -90,6 +89,9 @@ function render(el) { return rendered.replace(doubleLine, eol); } + +// input: opts specifying file path, svg the SVG string +// output: promise of writing the file function saveFile(opts, svg) { if(!opts || !opts.output) { return svg; @@ -98,6 +100,9 @@ function saveFile(opts, svg) { return fsp.writeFile(opts.output, svg); } + +// input: glob where to find SVGs to sprite, opts for where to write file +// output: promise of processing SVGs module.exports = function(glob, opts) { return Promise.all( // read and parse all files found with glob diff --git a/package.json b/package.json index f9ff8a1..05eddfd 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "svg-spritzer", - "version": "0.1.0", + "version": "0.2.0", "description": "SVG spriting the way I want it.", "main": "index.js", "scripts": { diff --git a/test/fixtures/output.svg b/test/fixtures/output.svg index d4bc72b..b02e11b 100644 --- a/test/fixtures/output.svg +++ b/test/fixtures/output.svg @@ -1,5 +1,4 @@ - folder-upload @@ -12,5 +11,4 @@ ticket - diff --git a/test/fixtures/output/expected.svg b/test/fixtures/output/expected.svg index d4bc72b..b02e11b 100644 --- a/test/fixtures/output/expected.svg +++ b/test/fixtures/output/expected.svg @@ -1,5 +1,4 @@ - folder-upload @@ -12,5 +11,4 @@ ticket -