Add config_display option to support regular and large renders (#310)
This commit is contained in:
@@ -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))
|
||||
|
||||
@@ -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.
|
||||
|
||||
@@ -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"}`)
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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)
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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))
|
||||
|
||||
@@ -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},
|
||||
|
||||
Reference in New Issue
Block a user