sudacode/metrics
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Add support to generate charts in habits plugin (#26)

Browse Source 
* Add charts to habits plugin
* Dockerfile update
* Add support for dflags
This commit is contained in:
Simon Lecoq
2020-12-23 00:10:46 +01:00
committed by GitHub
parent 5335ef69a1
commit 25a82b319b
13 changed files with 341 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
src/templates/classic/image.svg
View File

@@ -6,7 +6,7 @@
+ ((!!base.repositories)*((!!plugins.traffic)||(!!plugins.lines)))*16
+ (!!plugins.followup)*68
+ (!!plugins.pagespeed)*126 + (plugins.pagespeed?.detailed ?? 0)*6*20
+ (!!plugins.habits)*68
+ (!!plugins.habits)*28 + (!!plugins.habits?.facts)*58 + (!!plugins.habits?.charts)*226
+ (!!plugins.languages)*96
+ (!!plugins.music)*64 + (plugins.music?.tracks?.length ? 14+Math.max(0, plugins.music.tracks.length-1)*36 : 0)
+ (!!plugins.posts)*64 + (plugins.posts?.list?.length ?? 0)*40
@@ -504,28 +504,81 @@
<section>
<h2 class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M8 1.5c-2.363 0-4 1.69-4 3.75 0 .984.424 1.625.984 2.304l.214.253c.223.264.47.556.673.848.284.411.537.896.621 1.49a.75.75 0 01-1.484.211c-.04-.282-.163-.547-.37-.847a8.695 8.695 0 00-.542-.68c-.084-.1-.173-.205-.268-.32C3.201 7.75 2.5 6.766 2.5 5.25 2.5 2.31 4.863 0 8 0s5.5 2.31 5.5 5.25c0 1.516-.701 2.5-1.328 3.259-.095.115-.184.22-.268.319-.207.245-.383.453-.541.681-.208.3-.33.565-.37.847a.75.75 0 01-1.485-.212c.084-.593.337-1.078.621-1.489.203-.292.45-.584.673-.848.075-.088.147-.173.213-.253.561-.679.985-1.32.985-2.304 0-2.06-1.637-3.75-4-3.75zM6 15.25a.75.75 0 01.75-.75h2.5a.75.75 0 010 1.5h-2.5a.75.75 0 01-.75-.75zM5.75 12a.75.75 0 000 1.5h4.5a.75.75 0 000-1.5h-4.5z"></path></svg>
Coding habits
Coding habits and recent activity
</h2>
<% if (plugins.habits.facts) { %>
<div class="row">
<% if (plugins.habits.error) { %>
<section>
<div class="field error">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2.343 13.657A8 8 0 1113.657 2.343 8 8 0 012.343 13.657zM6.03 4.97a.75.75 0 00-1.06 1.06L6.94 8 4.97 9.97a.75.75 0 101.06 1.06L8 9.06l1.97 1.97a.75.75 0 101.06-1.06L9.06 8l1.97-1.97a.75.75 0 10-1.06-1.06L8 6.94 6.03 4.97z"></path></svg>
<%= plugins.habits.error.message %>
</div>
</section>
<% } else { %>
<ul class="habits">
<% if (plugins.habits.indents.style) { %>
<li>Use <%= plugins.habits.indents.style %> for indents</li>
<% } %>
<% if (!Number.isNaN(plugins.habits.commits.hour)) { %>
<li>Mostly push code around <%= plugins.habits.commits.hour %>:00</li>
<% } %>
<% if (plugins.habits.commits.day) { %>
<li>Mostly active on <%= plugins.habits.commits.day.toLocaleLowerCase() %></li>
<% } %>
</ul>
<% } %>
</div>
<% } %>
</section>
<% if (plugins.habits.charts) { %>
<% if (!Number.isNaN(plugins.habits.commits.hour)) { %>
<section class="column chart">
<h3>Commit activity per time of the day</h3>
<div class="chart-bars">
<% for (let h = 0; h < 24; h++) { const p = (plugins.habits.commits.hours[h]??0)/(plugins.habits.commits.hours.max??1); %>
<div class="entry">
<span class="value"><%= plugins.habits.commits.hours[h] %></span>
<div class="bar" style="height: <%= p*50 %>px; background-color: var(--color-calendar-graph-day-L<%= Math.ceil(p/0.25) %>-bg)"></div>
<%= `${h}`.padStart(2, 0) %>
</div>
<% } %>
</div>
</section>
<% } %>
<div class="row">
<% if (plugins.habits.error) { %>
<section>
<div class="field error">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2.343 13.657A8 8 0 1113.657 2.343 8 8 0 012.343 13.657zM6.03 4.97a.75.75 0 00-1.06 1.06L6.94 8 4.97 9.97a.75.75 0 101.06 1.06L8 9.06l1.97 1.97a.75.75 0 101.06-1.06L9.06 8l1.97-1.97a.75.75 0 10-1.06-1.06L8 6.94 6.03 4.97z"></path></svg>
<%= plugins.habits.error.message %>
<% if (!Number.isNaN(plugins.habits.commits.day)) { %>
<section class="column chart">
<h3>Commit activity per day</h3>
<div class="chart-bars">
<% for (let d = 0; d < 7; d++) { const p = (plugins.habits.commits.days[d]??0)/(plugins.habits.commits.days.max??1); %>
<div class="entry">
<span class="value"><%= plugins.habits.commits.days[d] %></span>
<div class="bar" style="height: <%= p*50 %>px; background-color: var(--color-calendar-graph-day-L<%= Math.ceil(p/0.25) %>-bg)"></div>
<%= ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"][d] %>
</div>
<% } %>
</div>
</section>
<% } %>
<% if (plugins.habits.linguist.available) { %>
<section class="column chart">
<h3>Language activity</h3>
<div class="chart-bars horizontal">
<% for (const [language, p] of plugins.habits.linguist.ordered) { %>
<div class="entry">
<span class="name"><%= language %></span>
<div class="bar" style="width: <%= p*80 %>%; background-color: var(--color-calendar-graph-day-L<%= Math.ceil(p/0.25) %>-bg)"></div>
<span class="value"><%= Math.round(100*p) %>%</span>
</div>
<% } %>
</div>
</section>
<% } else { %>
<ul class="habits">
<% if (plugins.habits.indents.style) { %>
<li>Use <%= plugins.habits.indents.style %> for indents</li>
<% } %>
<% if (!Number.isNaN(plugins.habits.commits.hour)) { %>
<li>Mostly push code around <%= plugins.habits.commits.hour %>:00</li>
<% } %>
</ul>
<% } %>
</div>
</section>
<% } %>
<% } %>
<% if (plugins.topics) { %>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 70 KiB

After

Width:  |  Height:  |  Size: 73 KiB

57
src/templates/classic/style.css
View File

@@ -304,6 +304,63 @@
color: #666666;
}
/* Charts and graphs */
.chart {
padding: 0 8px;
}
.chart-bars {
display: flex;
justify-content: space-between;
align-items: flex-end;
width: 100%;
margin: 8px 0 4px;
}
.chart-bars .entry {
flex: 1 1 0;
display: flex;
flex-direction: column;
align-items: center;
font-size: 10px;
color: #666666;
}
.chart-bars .entry .value {
font-size: 9px;
}
.chart-bars .bar {
width: 7px;
background-color: var(--color-calendar-graph-day-bg);
border: 1px solid var(--color-calendar-graph-day-border);
border-radius: 5px;
}
.chart-bars.horizontal {
flex-direction: column;
align-items: space-between;
height: 100%;
}
.chart-bars.horizontal .entry {
align-items: center;
flex-direction: row;
width: 100%;
}
.chart-bars.horizontal .entry .name {
flex-shrink: 0;
text-align: right;
min-width: 30%;
}
.chart-bars.horizontal .bar {
height: 7px;
width: auto;
margin: 0 6px;
}
/* Fade animation */
.af {
opacity: 0;

12
src/templates/common.mjs
View File

@@ -1,5 +1,5 @@
/** Template common processor */
export default async function ({login, q}, {conf, data, rest, graphql, plugins}, {s, pending, imports}) {
export default async function ({login, q, dflags}, {conf, data, rest, graphql, plugins}, {s, pending, imports}) {
//Init
const computed = data.computed = {commits:0, sponsorships:0, licenses:{favorite:"", used:{}}, token:{}, repositories:{watchers:0, stargazers:0, issues_open:0, issues_closed:0, pr_open:0, pr_merged:0, forks:0, releases:0}}
@@ -61,4 +61,14 @@
//Meta
data.meta = {version:conf.package.version, author:conf.package.author}
//Debug flags
if (dflags.includes("--cakeday")||q["dflag.cakeday"]) {
console.debug(`metrics/compute/${login} > applying dflag --cakeday`)
computed.cakeday = true
}
if (dflags.includes("--hireable")||q["dflag.hireable"]) {
console.debug(`metrics/compute/${login} > applying dflag --hireable`)
data.user.isHireable = true
}
}