From ee8efaee4df18be42485b4e3eb6eadc4ebffe0b6 Mon Sep 17 00:00:00 2001 From: Guillaume Grossetie Date: Tue, 1 Oct 2019 17:31:23 +0200 Subject: [PATCH] Add Octicons SVG set --- examples/document/basic-example.adoc | 8 ++-- lib/document/templates.js | 63 ++++++++++++++++------------ package-lock.json | 11 ++++- package.json | 1 + test/templates_test.js | 7 ++++ 5 files changed, 57 insertions(+), 33 deletions(-) diff --git a/examples/document/basic-example.adoc b/examples/document/basic-example.adoc index 7c61b790..c34573b5 100644 --- a/examples/document/basic-example.adoc +++ b/examples/document/basic-example.adoc @@ -65,11 +65,11 @@ icon:flag[rotate=270] + icon:flag[flip=horizontal] + icon:flag[flip=vertical] -.Roles -icon:heart[role=is-primary] icon:heart[role=is-success] icon:heart[role=is-warning] icon:heart[role=is-danger] +.Octicons +You can icon:repo-forked[set=octicons] me on icon:mark-github[set=octicons]... bip bip bop icon:hubot@octicons[] -.Set -icon:address-book[set=far] icon:address-book[] icon:chrome@fab[] +.FontAwesome solid (default), regular and brand +icon:address-book[] icon:address-book[set=far] icon:chrome@fab[] == Conclusion diff --git a/lib/document/templates.js b/lib/document/templates.js index 3d2fdab8..823fd5e1 100644 --- a/lib/document/templates.js +++ b/lib/document/templates.js @@ -2,6 +2,7 @@ const fs = require('fs') const path = require('path') const stemContent = require('./stem') +const octicons = require('@primer/octicons') const faLibrary = require('@fortawesome/fontawesome-svg-core').library const faIcon = require('@fortawesome/fontawesome-svg-core').icon const faDom = require('@fortawesome/fontawesome-svg-core').dom @@ -185,30 +186,6 @@ ${syntaxHighlighterFooter(node, syntaxHighlighter, { cdn_base_url: cdnBaseUrl, l }, inline_image: (node, baseConverter) => { if (node.getType() === 'icon' && isSvgIconEnabled(node)) { - const transform = {} - if (node.hasAttribute('rotate')) { - transform.rotate = node.getAttribute('rotate') - } - if (node.hasAttribute('flip')) { - const flip = node.getAttribute('flip') - if (flip === 'vertical' || flip === 'y' || flip === 'v') { - transform.flipY = true - } else { - transform.flipX = true - } - } - const options = {} - options.transform = transform - if (node.hasAttribute('title')) { - options.title = node.getAttribute('title') - } - options.classes = [] - if (node.hasAttribute('size')) { - options.classes.push(`fa-${node.getAttribute('size')}`) - } - if (node.getRoles() && node.getRoles().length > 0) { - options.classes = options.classes.concat(node.getRoles().map(value => value.trim())) - } const meta = {} const target = node.getTarget() let iconName = target @@ -220,9 +197,41 @@ ${syntaxHighlighterFooter(node, syntaxHighlighter, { cdn_base_url: cdnBaseUrl, l meta.prefix = parts[1] } meta.iconName = iconName - const icon = faIcon(meta, options) - if (icon) { - return icon.html + if (meta.prefix === 'octicons') { + const icon = octicons[meta.iconName] + if (icon) { + return icon.toSVG() + } + } else { + // FontAwesome + const transform = {} + if (node.hasAttribute('rotate')) { + transform.rotate = node.getAttribute('rotate') + } + if (node.hasAttribute('flip')) { + const flip = node.getAttribute('flip') + if (flip === 'vertical' || flip === 'y' || flip === 'v') { + transform.flipY = true + } else { + transform.flipX = true + } + } + const options = {} + options.transform = transform + if (node.hasAttribute('title')) { + options.title = node.getAttribute('title') + } + options.classes = [] + if (node.hasAttribute('size')) { + options.classes.push(`fa-${node.getAttribute('size')}`) + } + if (node.getRoles() && node.getRoles().length > 0) { + options.classes = options.classes.concat(node.getRoles().map(value => value.trim())) + } + const icon = faIcon(meta, options) + if (icon) { + return icon.html + } } } else { return baseConverter.$convert_inline_image(node) diff --git a/package-lock.json b/package-lock.json index 99525e98..0173bd56 100644 --- a/package-lock.json +++ b/package-lock.json @@ -96,6 +96,14 @@ "@fortawesome/fontawesome-common-types": "^0.2.25" } }, + "@primer/octicons": { + "version": "9.1.1", + "resolved": "https://registry.npmjs.org/@primer/octicons/-/octicons-9.1.1.tgz", + "integrity": "sha512-7EGM0+Kx39bIgaYr9bTCzFvBCxm+fqh/YJIoSns8zfCwss32ZJ2GDP3024UH709VQtM5cKFU4JcIYPHyGdSfIg==", + "requires": { + "object-assign": "^4.1.1" + } + }, "@types/node": { "version": "12.7.3", "resolved": "https://registry.npmjs.org/@types/node/-/node-12.7.3.tgz", @@ -2920,8 +2928,7 @@ "object-assign": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", - "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=", - "dev": true + "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=" }, "object-copy": { "version": "0.1.0", diff --git a/package.json b/package.json index bc862ec6..a0047e86 100644 --- a/package.json +++ b/package.json @@ -36,6 +36,7 @@ "@fortawesome/free-brands-svg-icons": "5.11.2", "@fortawesome/free-regular-svg-icons": "5.11.2", "@fortawesome/free-solid-svg-icons": "5.11.2", + "@primer/octicons": "^9.1.1", "chokidar": "2.0.4", "fs-extra": "7.0.1", "pagedjs": "0.1.34", diff --git a/test/templates_test.js b/test/templates_test.js index 98296862..caee5f43 100644 --- a/test/templates_test.js +++ b/test/templates_test.js @@ -113,5 +113,12 @@ icon:chrome@fab[]`) const $ = cheerio.load(doc.convert()) expect($('svg[data-prefix=\'fab\'][data-icon=\'chrome\']').html()).to.equal('') }) + it('should render an Octicons SVG icon', () => { + const doc = asciidoctor.load(`:icontype: svg + +icon:hubot@octicons[]`) + const $ = cheerio.load(doc.convert()) + expect($('svg.octicon.octicon-hubot').html()).to.equal('') + }) }) })