Change padding into a percentage

This commit is contained in:
linguist
2021-01-02 13:05:07 +01:00
parent a13b903122
commit f55176f7b9
3 changed files with 10 additions and 6 deletions

View File

@@ -52,11 +52,11 @@ inputs:
description: Enable or disable SVG animations description: Enable or disable SVG animations
default: yes default: yes
# Add bottom padding # Add bottom padding (percentage)
# This can used to add padding if generated image is cropped or on the contrary, remove empty space # This can used to add padding if generated image is cropped or on the contrary, remove empty space
config_padding: config_padding:
description: Configure bottom padding description: Configure bottom padding
default: 20 default: 2%
# Number of repositories to use for metrics # Number of repositories to use for metrics
# A high number increase metrics accuracy, but will consume additional API requests when using plugins # A high number increase metrics accuracy, but will consume additional API requests when using plugins

View File

@@ -113,7 +113,7 @@
"config.timezone":input.string("config_timezone"), "config.timezone":input.string("config_timezone"),
"config.output":input.string("config_output"), "config.output":input.string("config_output"),
"config.animations":input.bool("config_animations"), "config.animations":input.bool("config_animations"),
"config.padding":input.number("config_padding"), "config.padding":input.string("config_padding"),
} }
info("Timezone", config["config.timezone"] ?? "(system default)") info("Timezone", config["config.timezone"] ?? "(system default)")
info("Convert SVG", config["config.output"] ?? "(no)") info("Convert SVG", config["config.output"] ?? "(no)")

View File

@@ -84,7 +84,7 @@
console.debug(`metrics/compute/${login} > render`) console.debug(`metrics/compute/${login} > render`)
let rendered = await ejs.render(image, {...data, s, style, fonts}, {async:true}) let rendered = await ejs.render(image, {...data, s, style, fonts}, {async:true})
//Apply resizing //Apply resizing
const {resized, mime} = await svgresize(rendered, {padding:"config.padding" in q ? Number(q["config.padding"]) : undefined, convert}) const {resized, mime} = await svgresize(rendered, {padding:q["config.padding"], convert})
rendered = resized rendered = resized
//Additional SVG transformations //Additional SVG transformations
@@ -180,12 +180,16 @@
} }
/** Render svg */ /** Render svg */
async function svgresize(svg, {padding = 20, convert} = {}) { async function svgresize(svg, {padding = "2%", convert} = {}) {
//Instantiate browser if needed //Instantiate browser if needed
if (!svgresize.browser) { if (!svgresize.browser) {
svgresize.browser = await puppeteer.launch({headless:true, executablePath:process.env.PUPPETEER_BROWSER_PATH, args:["--no-sandbox", "--disable-extensions", "--disable-setuid-sandbox", "--disable-dev-shm-usage"]}) svgresize.browser = await puppeteer.launch({headless:true, executablePath:process.env.PUPPETEER_BROWSER_PATH, args:["--no-sandbox", "--disable-extensions", "--disable-setuid-sandbox", "--disable-dev-shm-usage"]})
console.debug(`metrics/svgresize > started ${await svgresize.browser.version()}`) console.debug(`metrics/svgresize > started ${await svgresize.browser.version()}`)
} }
//Format padding
padding = ((Number(`${padding}`.substring(0, padding.length-1))||0)/100)
console.debug(`metrics/svgresize > padding ${(100*padding).toFixed(2)}%`)
padding += 1
//Render through browser and resize height //Render through browser and resize height
const page = await svgresize.browser.newPage() const page = await svgresize.browser.newPage()
await page.setContent(svg, {waitUntil:"load"}) await page.setContent(svg, {waitUntil:"load"})
@@ -197,7 +201,7 @@
document.querySelector("svg").classList.add("no-animations") document.querySelector("svg").classList.add("no-animations")
//Get bounds and resize //Get bounds and resize
let {y:height, width} = document.querySelector("svg #metrics-end").getBoundingClientRect() let {y:height, width} = document.querySelector("svg #metrics-end").getBoundingClientRect()
height = Math.ceil(height + padding) height = Math.ceil(height*padding)
width = Math.ceil(width) width = Math.ceil(width)
//Resize svg //Resize svg
document.querySelector("svg").setAttribute("height", height) document.querySelector("svg").setAttribute("height", height)