feat: support iconWidth config

pull/6/head
Amio 2018-07-28 18:09:29 +08:00
rodzic dce85e7c70
commit 903860f6db
1 zmienionych plików z 11 dodań i 13 usunięć

Wyświetl plik

@ -1,14 +1,14 @@
const calcWidth = require('./calc-text-width.js').Verdana11
const colorPresets = require('./color-presets.js')
module.exports = function ({subject, status, color, style, emoji, icon}) {
module.exports = function ({subject, status, color, style, emoji, icon, iconWidth = 13}) {
typeAssert(typeof subject === 'string', '<subject> must be string')
typeAssert(typeof status === 'string', '<status> must be string')
color = colorPresets[color] || color || colorPresets['blue']
const iconSpanWidth = icon ? (subject.length ? iconWidth + 4 : iconWidth - 1.5) : 0
const stTextWidth = calcWidth(status, emoji)
const sbRectWidth = calcWidth(subject, emoji) + 10 + (icon ? 15 : 0)
const sbRectWidth = calcWidth(subject, emoji) + 10 + iconSpanWidth
const stRectWidth = stTextWidth + 10
const width = sbRectWidth + stRectWidth
@ -20,11 +20,12 @@ module.exports = function ({subject, status, color, style, emoji, icon}) {
<rect x="${sbRectWidth}" width="${stRectWidth}" height="20" fill="#${color}"/>
</g>
<g fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="11">
<text x="${icon ? '21.6' : '6'}" y="14.8" fill="#000" opacity="0.1">${subject}</text>
<text x="${icon ? '20.6' : '5'}" y="13.8">${subject}</text>
<text x="${icon ? '22.5' : '6'}" y="14.8" fill="#000" opacity="0.1">${subject}</text>
<text x="${icon ? '21.5' : '5'}" y="13.8">${subject}</text>
<text x="${sbRectWidth + 5.5}" y="14.8" fill="#000" opacity="0.1" textLength="${stTextWidth}">${status}</text>
<text x="${sbRectWidth + 4.5}" y="13.8" textLength="${stTextWidth}">${status}</text>
</g>${icon ? genIconMarkup(icon) : ''}
</g>
${icon ? `<image x="3.8" y="3.4" width="${iconWidth}" height="13.2" xlink:href="${icon}"/>` : ''}
</svg>
`
}
@ -42,19 +43,16 @@ module.exports = function ({subject, status, color, style, emoji, icon}) {
<rect width="${width}" height="20" fill="url(#a)"/>
</g>
<g fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="11">
<text x="${icon ? '21.6' : '6'}" y="14.8" fill="#000" opacity="0.25">${subject}</text>
<text x="${icon ? '20.6' : '5'}" y="13.8">${subject}</text>
<text x="${icon ? '22.5' : '6'}" y="14.8" fill="#000" opacity="0.25">${subject}</text>
<text x="${icon ? '21.5' : '5'}" y="13.8">${subject}</text>
<text x="${sbRectWidth + 5.5}" y="14.8" fill="#000" opacity="0.25" textLength="${stTextWidth}">${status}</text>
<text x="${sbRectWidth + 4.5}" y="13.8" textLength="${stTextWidth}">${status}</text>
</g>${icon ? genIconMarkup(icon) : ''}
</g>
${icon ? `<image x="3.9" y="3.5" width="${iconWidth}" height="13" xlink:href="${icon}"/>` : ''}
</svg>
`
}
function genIconMarkup (iconB64) {
return `<image x="3.8" y="3.4" width="13.2" height="13.2" xlink:href="${iconB64}"/>`
}
function typeAssert (assertion, message) {
if (!assertion) throw new TypeError(message)
}