Skip to content

Commit

Permalink
fix lint
Browse files Browse the repository at this point in the history
  • Loading branch information
@mzaremski
mzaremski committed Apr 24, 2019
1 parent 1e655f5 commit 203f9f5
Show file tree
Hide file tree
Showing 3 changed files with 174 additions and 182 deletions.
20 changes: 12 additions & 8 deletions scripts/createBuildDir.js
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,15 @@
const fs = require('fs');

const catalogs = ["build", "build/inline", "build/sprite"]
const catalogs = ['build', 'build/inline', 'build/sprite'];

catalogs.forEach((src)=>{
fs.access(src, fs.constants.F_OK, (err) => {
if (err) {
fs.mkdirSync(src, (err)=>{if (err){console.error(err)}});
}
});
})
catalogs.forEach((src) => {
fs.access(src, fs.constants.F_OK, (e) => {
if (e) {
fs.mkdirSync(src, (error) => {
if (error) {
console.error(error);
}
});
}
});
});
120 changes: 58 additions & 62 deletions scripts/createSvgSpritesheet.js
View file
Original file line number Diff line number Diff line change
@@ -1,85 +1,81 @@
"use strict";
const fs = require('fs');
const xmldom = require('xmldom');

const fs = require("fs");
const xmldom = require("xmldom");
const DOMParser = xmldom.DOMParser;
const XMLSerializer = xmldom.XMLSerializer;
const { DOMParser } = xmldom;
const { XMLSerializer } = xmldom;

module.exports = (params) => {
const args = params || parseArgv(process.argv);
const options = Object.assign(args, {
spriteDistName: args.spriteDistName || 'ikonate.svg',
spriteDistCatalog: args.spriteDistCatalog || './build/sprite/',
spriteTemplateSrc: args.spriteTemplateSrc || './templates/ikonate-template.svg',
iconsCatalogSrc: args.iconsCatalogSrc || './icons',
});

module.exports = (params)=>{
const args = params || parseArgv(process.argv)
const options = Object.assign(args, {
spriteDistName: args.spriteDistName || "ikonate.svg",
spriteDistCatalog: args.spriteDistCatalog || "./build/sprite/",
spriteTemplateSrc: args.spriteTemplateSrc || "./templates/ikonate-template.svg",
iconsCatalogSrc: args.iconsCatalogSrc || "./icons"
})
const DocumentTemplate = new DOMParser().parseFromString(
fs.readFileSync(options.spriteTemplateSrc).toString('utf-8')
);
const DocumentTemplateSvgTag = DocumentTemplate.getElementsByTagName('svg')['0'];

const DocumentTemplate = new DOMParser().parseFromString(
fs.readFileSync(options.spriteTemplateSrc).toString("utf-8")
);
const DocumentTemplateSvgTag = DocumentTemplate.getElementsByTagName("svg")["0"]

const selectedSvgs = options.selectedSvgs || fs.readdirSync("./icons");
const selectedSvgs = options.selectedSvgs || fs.readdirSync('./icons');

selectedSvgs
.filter((i) => i.includes('.svg'))
.forEach((name)=>{
DocumentTemplateSvgTag.appendChild(
.forEach((name) => {
DocumentTemplateSvgTag.appendChild(
createSymbolElement(options, name, DocumentTemplate)
)
})

if(options.save){
fs.writeFileSync(
options.spriteDistCatalog + options.spriteDistName,
new XMLSerializer().serializeToString(DocumentTemplate)
);
);
});

return options.spriteDistCatalog + options.spriteDistName
}
if (options.save) {
fs.writeFileSync(
options.spriteDistCatalog + options.spriteDistName,
new XMLSerializer().serializeToString(DocumentTemplate)
);

return new XMLSerializer().serializeToString(DocumentTemplate)
}
return options.spriteDistCatalog + options.spriteDistName;
}

return new XMLSerializer().serializeToString(DocumentTemplate);
};


function createSymbolElement(options, name, DocumentTemplate){
const svgDoc = new DOMParser().parseFromString(
fs.readFileSync(options.iconsCatalogSrc + "/" + name).toString("utf-8"),
"text/xml"
).childNodes["0"];
function createSymbolElement(options, name, DocumentTemplate) {
const svgDoc = new DOMParser().parseFromString(
fs.readFileSync(`${options.iconsCatalogSrc}/${name}`).toString('utf-8'),
'text/xml'
).childNodes['0'];

const symbol = DocumentTemplate.createElement("symbol")
const viewBoxAtt = svgDoc.getAttribute("viewBox")//Get value of viewBox attribute of SVG tag
symbol.setAttribute("viewBox", viewBoxAtt)
const symbol = DocumentTemplate.createElement('symbol');
const viewBoxAtt = svgDoc.getAttribute('viewBox');// Get value of viewBox attribute of SVG tag
symbol.setAttribute('viewBox', viewBoxAtt);

symbol.setAttribute("id", name.replace(".svg", ""))
symbol.setAttribute('id', name.replace('.svg', ''));

Object.keys(svgDoc.childNodes).forEach((i)=>{
const tagName = svgDoc.childNodes[i].tagName
const isLabelTag = (tagName === "title" || tagName === "desc")
Object.keys(svgDoc.childNodes).forEach((i) => {
const { tagName } = svgDoc.childNodes[i];
const isLabelTag = (tagName === 'title' || tagName === 'desc');

if( tagName && !isLabelTag){
symbol.appendChild(svgDoc.childNodes[i])
}
})
if (tagName && !isLabelTag) {
symbol.appendChild(svgDoc.childNodes[i]);
}
});

return symbol
return symbol;
}

function parseArgv(args) {
const obj = {};

function parseArgv(args){
const obj = {}

args.forEach(i => {
if(i.includes("=")){
const param = i.split("=")
obj[param[0]] = param[1]
}else{
obj[i] = true;
}
})
args.forEach(i => {
if (i.includes('=')) {
const param = i.split('=');
obj[param[0]] = param[1];
} else {
obj[i] = true;
}
});

return obj
return obj;
}
216 changes: 104 additions & 112 deletions scripts/generateHTML.js
View file
Original file line number Diff line number Diff line change
@@ -1,122 +1,114 @@
"use strict";

const fs = require("fs");
const pretty = require("pretty");
const jsdom = require("jsdom");
const JSDOM = jsdom.JSDOM;
const fs = require('fs');
const pretty = require('pretty');
const jsdom = require('jsdom');

const { JSDOM } = jsdom;

module.exports = (params) => {
const args = params || parseArgv(process.argv)
const options = Object.assign(args, {
templateSrc: args.templateSrc || "./templates/index-template.html",
iconsCatalogSrc: args.iconsCatalogSrc || "./icons",
saveCatalog: args.saveCatalog || "demo",
saveName: args.saveName || "index.html",
xLinkHref: args.xLinkHref || "./ikonate.svg"
})

const DOM = new JSDOM(fs.readFileSync(options.templateSrc).toString("utf-8"));
const Document = DOM.window.document;

const iconsToRender = options.icons || fs.readdirSync(options.iconsCatalogSrc)

if(options.inline)
generateInline(options, iconsToRender, Document)
if(options.sprite)
generateSprite(options, iconsToRender, Document)

const DOMstring = pretty(DOM.serialize())

if(options.save){
fs.mkdir(options.saveCatalog, () => {
fs.writeFile(options.saveCatalog + "/" + options.saveName, DOMstring, err => {
if (err) {
console.log(err);
}
});
});
}

return DOMstring
const args = params || parseArgv(process.argv);
const options = Object.assign(args, {
templateSrc: args.templateSrc || './templates/index-template.html',
iconsCatalogSrc: args.iconsCatalogSrc || './icons',
saveCatalog: args.saveCatalog || 'demo',
saveName: args.saveName || 'index.html',
xLinkHref: args.xLinkHref || './ikonate.svg',
});

const DOM = new JSDOM(fs.readFileSync(options.templateSrc).toString('utf-8'));
const Document = DOM.window.document;

const iconsToRender = options.icons || fs.readdirSync(options.iconsCatalogSrc);

if (options.inline) generateInline(options, iconsToRender, Document);
if (options.sprite) generateSprite(options, iconsToRender, Document);

const DOMstring = pretty(DOM.serialize());

if (options.save) {
fs.mkdir(options.saveCatalog, () => {
fs.writeFile(`${options.saveCatalog}/${options.saveName}`, DOMstring, err => {
if (err) {
console.log(err);
}
});
});
}

return DOMstring;
};

function generateInline(options, icons, Document) {
// <div class="container__grid-item">
// <svg role="img" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" aria-labelledby="lockAltOpenIconTitle lockAltOpenIconDesc">
// <title id="lockAltOpenIconTitle">Lock</title>
// <desc id="lockAltOpenIconDesc">Icon of an opened lock</desc>
// <path d="M7,7.625 L7,7 C7,4.23857625 9.23857625,2 12,2 L12,2 C14.7614237,2 17,4.23857625 17,7 L17,11"></path>
// <rect width="14" height="10" x="5" y="11"></rect>
// <circle cx="12" cy="16" r="1"></circle>
// </svg>
// </div>

icons.map(function (item) {
const svgFile = new JSDOM(
fs.readFileSync(`${options.iconsCatalogSrc}/${item}`).toString('utf-8')
).window.document.getElementsByTagName('svg')['0'];

const keywordsTag = svgFile.getElementsByTagName('keywords')['0'];

if (keywordsTag) svgFile.removeChild(keywordsTag);

const div = Document.createElement('div');
div.classList.add('main__item');

div.appendChild(svgFile);
Document.getElementsByClassName('main')['0'].appendChild(div);
});
}


function generateInline(options, icons, Document){
// <div class="container__grid-item">
// <svg role="img" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" aria-labelledby="lockAltOpenIconTitle lockAltOpenIconDesc">
// <title id="lockAltOpenIconTitle">Lock</title>
// <desc id="lockAltOpenIconDesc">Icon of an opened lock</desc>
// <path d="M7,7.625 L7,7 C7,4.23857625 9.23857625,2 12,2 L12,2 C14.7614237,2 17,4.23857625 17,7 L17,11"></path>
// <rect width="14" height="10" x="5" y="11"></rect>
// <circle cx="12" cy="16" r="1"></circle>
// </svg>
// </div>

icons.map(item => {
const svgFile = new JSDOM(
fs.readFileSync(options.iconsCatalogSrc + "/" + item).toString("utf-8")
).window.document.getElementsByTagName("svg")["0"];

const keywordsTag = svgFile.getElementsByTagName("keywords")["0"]

if(keywordsTag)
svgFile.removeChild(keywordsTag)

const div = Document.createElement("div");
div.classList.add("main__item");

div.appendChild(svgFile);
Document.getElementsByClassName("main")["0"].appendChild(div);
});
function generateSprite(options, icons, Document) {
// <div class="container__grid-item">
// <svg class="ikonate">
// <title id="lockAltOpenIconTitle">Lock</title>
// <desc id="lockAltOpenIconDesc">Icon of an opened lock</desc>
// <use xlink:href="./ikonate.svg#lock-alt-open"></use>
// </svg>
// </div>

icons.map(function (item) {
const svgFile = new JSDOM(
fs.readFileSync(`${options.iconsCatalogSrc}/${item}`).toString('utf-8')
).window.document.getElementsByTagName('svg')['0'];

const titleTag = svgFile.getElementsByTagName('title')['0'];
const descTag = svgFile.getElementsByTagName('desc')['0'];

const div = Document.createElement('div');
div.classList.add('main__item');

const svg = Document.createElement('svg');

const use = Document.createElement('use');
use.setAttribute('xlink:href', `${options.xLinkHref}#${item.replace('.svg', '')}`);

svg.appendChild(titleTag);
svg.appendChild(descTag);
svg.appendChild(use);
div.appendChild(svg);
Document.getElementsByClassName('main')['0'].appendChild(div);
});
}

function parseArgv(args) {
const obj = {};

function generateSprite(options, icons, Document){
// <div class="container__grid-item">
// <svg class="ikonate">
// <title id="lockAltOpenIconTitle">Lock</title>
// <desc id="lockAltOpenIconDesc">Icon of an opened lock</desc>
// <use xlink:href="./ikonate.svg#lock-alt-open"></use>
// </svg>
// </div>

icons.map(item => {
const svgFile = new JSDOM(
fs.readFileSync(options.iconsCatalogSrc + "/" + item).toString("utf-8")
).window.document.getElementsByTagName("svg")["0"];

const titleTag = svgFile.getElementsByTagName("title")["0"]
const descTag = svgFile.getElementsByTagName("desc")["0"]

const div = Document.createElement("div");
div.classList.add("main__item");

const svg = Document.createElement("svg");

const use = Document.createElement("use");
use.setAttribute("xlink:href", options.xLinkHref + "#" + item.replace(".svg", ""))

svg.appendChild(titleTag);
svg.appendChild(descTag);
svg.appendChild(use);
div.appendChild(svg);
Document.getElementsByClassName("main")["0"].appendChild(div);
});
}


function parseArgv(args){
const obj = {}

args.forEach(i => {
if(i.includes("=")){
const param = i.split("=")
obj[param[0]] = param[1]
}else{
obj[i] = true;
}
})
args.forEach(i => {
if (i.includes('=')) {
const param = i.split('=');
obj[param[0]] = param[1];
} else {
obj[i] = true;
}
});

return obj
return obj;
}

0 comments on commit 203f9f5

Please sign in to comment.