modular icon pack

This commit is contained in:
Klemek
2019-07-16 10:13:00 +02:00
parent 1d0b7f25c6
commit e56e13f10a
5 changed files with 58 additions and 36 deletions
+1 -1
View File
@@ -2,4 +2,4 @@
/node_modules /node_modules
/coverage /coverage
/build /build
/svg_list.json /resources.json
+18 -11
View File
@@ -61,15 +61,15 @@ svn.commands.checkout(FA_SVG_FOLDER_URL, svgDir, (err) => {
console.log('\tReading SVGs...'); console.log('\tReading SVGs...');
getFileTree(svgDir, (err, list) => { getFileTree(svgDir, (err, files) => {
if (err) if (err)
throw err; throw err;
const svgs = {}; const list = {};
let count = 0; let count = 0;
list.filter(x => /\.svg$/.test(x)).forEach(svgFile => { files.filter(x => /\.svg$/.test(x)).forEach(svgFile => {
const data = fs.readFileSync(svgFile, {encoding: 'utf8'}); const data = fs.readFileSync(svgFile, {encoding: 'utf8'});
const match1 = data.match(/viewBox="0 0 (\d+) 512"/); const match1 = data.match(/viewBox="0 0 (\d+) 512"/);
if (!match1) if (!match1)
@@ -81,10 +81,10 @@ svn.commands.checkout(FA_SVG_FOLDER_URL, svgDir, (err) => {
const type = path.basename(path.dirname(svgFile)); const type = path.basename(path.dirname(svgFile));
const name = path.basename(svgFile, '.svg'); const name = path.basename(svgFile, '.svg');
if (!svgs[type]) if (!list[type])
svgs[type] = {}; list[type] = {};
svgs[type][name] = { list[type][name] = {
path: match2[1], path: match2[1],
width: parseInt(match1[1]) width: parseInt(match1[1])
}; };
@@ -93,14 +93,21 @@ svn.commands.checkout(FA_SVG_FOLDER_URL, svgDir, (err) => {
}); });
console.log(`\t${count} SVGs loaded`); console.log(`\t${count} SVGs loaded`);
Object.keys(svgs).forEach(type => { Object.keys(list).forEach(type => {
console.log(`\t\t${type}: ${Object.keys(svgs[type]).length} SVGs`); console.log(`\t\t${type}: ${Object.keys(list[type]).length} SVGs`);
}); });
const output = path.join(__dirname, 'svg_list.json'); const out = {
name: 'font-awesome',
height: 512,
index: ['solid', 'regular', 'brands'],
icons: list
};
fs.writeFileSync(output, JSON.stringify(svgs, null, 4), {encoding: 'utf8'}); const outputFile = path.join(__dirname, 'resources.json');
console.log(`\tSVG list saved at "${output}"`);
fs.writeFileSync(outputFile, JSON.stringify(out, null, 4), {encoding: 'utf8'});
console.log(`\tSVG resources saved at "${outputFile}"`);
}); });
}); });
+2 -2
View File
@@ -6,12 +6,12 @@
"files": [ "files": [
"/src", "/src",
"/dist", "/dist",
"/svg_list.json", "/resources.json",
"/build.js" "/build.js"
], ],
"scripts": { "scripts": {
"test": "jest --silent", "test": "jest --silent",
"prepublishOnly": "browserify --require ./svg_list.json:../svg_list.json -o dist/fa-diagrams-data.js && browserify --exclude ../svg_list.json src/index.js -o dist/fa-diagrams.js && uglifyjs -m -c -o dist/fa-diagrams.min.js -- dist/fa-diagrams.js && uglifyjs -m -c -o dist/fa-diagrams-data.min.js -- dist/fa-diagrams-data.js" "prepublishOnly": "browserify --require ./resources.json:../resources.json -o dist/fa-diagrams-data.js && browserify --exclude ../resources.json src/index.js -o dist/fa-diagrams.js && uglifyjs -m -c -o dist/fa-diagrams.min.js -- dist/fa-diagrams.js && uglifyjs -m -c -o dist/fa-diagrams-data.min.js -- dist/fa-diagrams-data.js"
}, },
"repository": { "repository": {
"type": "git", "type": "git",
+36 -21
View File
@@ -1,11 +1,23 @@
const convert = require('xml-js'); const convert = require('xml-js');
const utils = require('./utils'); const utils = require('./utils');
let list = {}; let resources = {
name: 'error',
height: 512,
index: [],
links: {
'arrow-head': {},
'arrow-head-reverse': {},
'line-start': {},
'line-end': {},
'dashed-step': {}
},
icons: {}
};
try { try {
list = require('../svg_list.json'); resources = require('../resources.json');
} catch (err) { } catch (err) {
console.error('fa-diagrams: SVG list could not be loaded', err); console.error('fa-diagrams: SVG resources could not be loaded', err);
} }
/** /**
@@ -80,6 +92,14 @@ const DEFAULT_OPTIONS = {
} }
}; };
const SUBSTITUTES = {
'font-awesome': {
'fas': 'solid',
'far': 'regular',
'fab': 'brands'
}
};
const DEFAULT_SCALE = 0.4; const DEFAULT_SCALE = 0.4;
const LINK_MARGIN = (1 - DEFAULT_SCALE) / 2; const LINK_MARGIN = (1 - DEFAULT_SCALE) / 2;
@@ -98,29 +118,24 @@ module.exports = (options) => {
if (!name || !name.trim()) if (!name || !name.trim())
return null; return null;
let search = ['solid', 'regular', 'brands']; let search = utils.ezClone(resources.index);
const spl = name.trim().split(' ').map(t => t.indexOf('fa-') === 0 ? t.substr(3) : t); const spl = name.trim().split(' ').map(t => t.indexOf('fa-') === 0 ? t.substr(3) : t);
const checkType = (type, keywords) => { for (let i = 0; i < spl.length; i++) {
if (search.length > 1) // else it's already found //replace fas by regular for example
keywords.forEach(kw => { if (Object.keys(SUBSTITUTES[resources.name] || {}).includes(spl[i])) {
const i = spl.indexOf(kw); spl[i] = SUBSTITUTES[resources.name][spl[i]];
if (i >= 0) { }
spl.splice(i, 1); if (resources.index.includes(spl[i])) {
search = [type]; search = [spl.splice(i, 1)];
} }
}); }
};
checkType('solid', ['fas', 'solid']);
checkType('regular', ['far', 'regular']);
checkType('brands', ['fab', 'brands']);
name = spl[0]; name = spl[0];
for (let i = 0; i < search.length; i++) { for (let i = 0; i < search.length; i++) {
if (list[search[i]] && list[search[i]][name]) { if (resources.icons[search[i]] && resources.icons[search[i]][name]) {
return list[search[i]][name]; return resources.icons[search[i]][name];
} }
} }
@@ -143,7 +158,7 @@ module.exports = (options) => {
case 'none': case 'none':
return null; return null;
default: default:
return `M12 216${lineStart}h${width * 512 - 146.059}${arrowHead}z`; return `M12 216${resources.links['arrow-head'].path}h${width * 512 - 146.059}${arrowHead}z`;
case 'line': case 'line':
return `M12 216${lineStart}h${width * 512 - 24}${lineEnd}z`; return `M12 216${lineStart}h${width * 512 - 24}${lineEnd}z`;
case 'double': case 'double':
+1 -1
View File
@@ -62,7 +62,7 @@ describe('getIcon', () => {
test('double type', () => { test('double type', () => {
const res = rendering().getIcon('circle far solid'); const res = rendering().getIcon('circle far solid');
expect(res).toEqual({ expect(res).toEqual({
path: solidCirclePath, path: regularCirclePath,
width: 512 width: 512
}); });
}); });