Add config_display option to support regular and large renders (#310)

This commit is contained in:
Simon Lecoq
2021-05-18 22:31:53 +02:00
committed by GitHub
parent 04bf1f0316
commit ed0da41973
36 changed files with 586 additions and 402 deletions

View File

@@ -33,7 +33,7 @@ export default async function({login, q, imports, data, rest, graphql, queries,
console.debug(`metrics/compute/${login}/plugins > contributors > no more page to load`)
break
}
commits.push(...loaded)
commits.push(...loaded.filter(commit => commit?.author?.login))
}
catch (error) {
if (/Git Repository is empty/.test(error))

View File

@@ -140,6 +140,21 @@ It may increase filesize since it replace unicode characters by SVG images.
config_twemoji: yes
```
### ↔️ Controlling display size
Some templates like `classic` and `repositories` support different output display size:
- `regular` (default) will render a medium-sized image, which is suitable for both desktop and mobile displays and is preferable when using data-intensive metrics (since text may be scaled down on small devices)
- `large` will render a large-sized image, which may be more suitable for some plugins (like displaying topics icons, repository contributors, etc.)
#### Examples workflows
```yaml
- uses: lowlighter/metrics@latest
with:
# ... other options
config_display: large
```
### 🎞️ SVG CSS Animations
As rendered metrics use HTML and CSS, some templates have animations.

View File

@@ -6,7 +6,7 @@
//Setup
export default async function({login, q}, {conf, data, rest, graphql, plugins, queries, account, convert, template}, {pending, imports}) {
//Load inputs
const {"config.animations":animations, "config.timezone":_timezone, "debug.flags":dflags} = imports.metadata.plugins.core.inputs({data, account, q})
const {"config.animations":animations, "config.display":display, "config.timezone":_timezone, "debug.flags":dflags} = imports.metadata.plugins.core.inputs({data, account, q})
imports.metadata.templates[template].check({q, account, format:convert})
//Init
@@ -29,6 +29,9 @@ export default async function({login, q}, {conf, data, rest, graphql, plugins, q
}
}
//Display
data.large = display === "large"
//Animations
data.animated = animations
console.debug(`metrics/compute/${login} > animations ${data.animated ? "enabled" : "disabled"}`)

View File

@@ -167,6 +167,15 @@ inputs:
type: boolean
default: yes
# Render display width
config_display:
description: Render display width
type: string
default: regular
values:
- regular # 480px width
- large # 960px width (may not be supported by all templates)
# Enable SVG CSS animations
config_animations:
description: SVG CSS animations

View File

@@ -57,7 +57,7 @@ export default async function({login, q, imports, data, graphql, queries, accoun
//Spawn licensed process
console.debug(`metrics/compute/${login}/plugins > licenses > running licensed`)
JSON.parse(await imports.run("licensed list --format=json --licenses", {cwd:path})).apps
.map(({sources}) => sources?.flatMap(source => source.dependencies.map(({dependency, license}) => {
.map(({sources}) => sources?.flatMap(source => source.dependencies?.map(({dependency, license}) => {
used[license] = (used[license] ?? 0) + 1
result.dependencies.push(dependency)
result.known += (license in licenses)

View File

@@ -28,7 +28,7 @@ export default async function({login, q, imports, data, account}, {enabled = fal
}, selector)
console.debug(`metrics/compute/${login}/plugins > screenshot > coordinates ${JSON.stringify(clip)}`)
const [buffer] = await imports.record({page, ...clip, frames:1, background})
const screenshot = await (await imports.jimp.read(Buffer.from(buffer.split(",").pop(), "base64"))).resize(Math.min(454, clip.width), imports.jimp.AUTO)
const screenshot = await (await imports.jimp.read(Buffer.from(buffer.split(",").pop(), "base64"))).resize(Math.min(454 * (1 + data.large), clip.width), imports.jimp.AUTO)
await browser.close()
//Results

View File

@@ -12,7 +12,7 @@ export default async function({login, q, imports, data, account}, {enabled = fal
year = new Date().getFullYear()
console.debug(`metrics/compute/${login}/plugins > skyline > year set to ${year}`)
}
const width = 454
const width = 454 * (1 + data.large)
const height = 284
//Start puppeteer and navigate to skyline.github.com

View File

@@ -31,7 +31,7 @@ export default async function({login, graphql, data, imports, q, queries, accoun
console.debug(`metrics/compute/${login}/plugins > stargazers > loaded ${dates.length} stargazers in total`)
//Compute stargazers increments
const days = 14
const days = 14 * (1 + data.large/2)
const increments = {dates:Object.fromEntries([...new Array(days).fill(null).map((_, i) => [new Date(Date.now() - i * 24 * 60 * 60 * 1000).toISOString().slice(0, 10), 0]).reverse()]), max:NaN, min:NaN}
dates
.map(date => date.toISOString().slice(0, 10))

View File

@@ -32,7 +32,7 @@ export default async function({login, q, imports, data, account}, {enabled = fal
//Generating chart
console.debug(`metrics/compute/${login}/plugins > stock > generating chart`)
const chart = await imports.chartist("line", {
width:480,
width:480 * (1 + data.large),
height:160,
showPoint:false,
axisX:{showGrid:false, labelInterpolationFnc:(value, index) => index % Math.floor(close.length / 4) === 0 ? value : null},