feat(plugins/stargazers): add plugin_stargazers_charts

source/plugins/stargazers/index.mjs

@@ -7,7 +7,7 @@ export default async function({login, graphql, data, imports, q, queries, accoun
       return null
 
     //Load inputs
-    let {"charts.type": _charts, worldmap: _worldmap, "worldmap.sample": _worldmap_sample} = imports.metadata.plugins.stargazers.inputs({data, account, q})
+    let {charts: _charts, "charts.type": _charts_type, worldmap: _worldmap, "worldmap.sample": _worldmap_sample} = imports.metadata.plugins.stargazers.inputs({data, account, q})
 
     //Retrieve stargazers from graphql api
     console.debug(`metrics/compute/${login}/plugins > stargazers > querying api`)
@@ -60,8 +60,8 @@ export default async function({login, graphql, data, imports, q, queries, accoun
     const months = ["", "Jan.", "Feb.", "Mar.", "Apr.", "May", "June", "July", "Aug.", "Sep.", "Oct.", "Nov.", "Dec."]
 
     //Generating charts
-    let charts = null
+    let charts = _charts ? true : null
-    if ((_charts === "chartist") && (imports.metadata.plugins.stargazers.extras("charts.type", {extras}))) {
+    if ((_charts_type === "chartist") && (imports.metadata.plugins.stargazers.extras("charts.type", {extras}))) {
       console.debug(`metrics/compute/${login}/plugins > stargazers > generating charts`)
       charts = await Promise.all([{data: total, low: total.min, high: total.max}, {data: increments, ref: 0, low: increments.min, high: increments.max, sign: true}].map(({data: {dates: set}, high, low, ref, sign = false}) =>
         imports.chartist("line", {

source/plugins/stargazers/metadata.yml

@@ -21,6 +21,14 @@ inputs:
     type: boolean
     default: no
 
+  plugin_stargazers_charts:
+    description: |
+      Charts
+
+      It includes total number of stargazers evolution, along with the number of new stars per day over the last two weeks.
+    type: boolean
+    default: yes
+
   plugin_stargazers_charts_type:
     description: |
       Charts display type

source/templates/classic/partials/stargazers.ejs

@@ -10,46 +10,48 @@
         <%= plugins.stargazers.error.message %>
       </div>
     <% } else { %>
-      <div class="row margin-bottom">
+      <% if (plugins.stargazers.charts) { %>
-        <section class="column chart chartist">
+        <div class="row margin-bottom">
-          <h3>Total stargazers</h3>
+          <section class="column chart chartist">
-          <% if (plugins.stargazers.charts) { %>
+            <h3>Total stargazers</h3>
-            <%- plugins.stargazers.charts[0] %>
+            <% if (Array.isArray(plugins.stargazers.charts)) { %>
-          <% } else { %>
+              <%- plugins.stargazers.charts[0] %>
-            <div class="chart-bars">
+            <% } else { %>
-              <% { let previous = null; for (const [date, value] of Object.entries(plugins.stargazers.total.dates)) { const p = 0.05+0.95*(value-plugins.stargazers.total.min)/(plugins.stargazers.total.max-plugins.stargazers.total.min || 1); const [y, m, d] = date.split("-").map(Number) %>
+              <div class="chart-bars">
-                <div class="entry">
+                <% { let previous = null; for (const [date, value] of Object.entries(plugins.stargazers.total.dates)) { const p = 0.05+0.95*(value-plugins.stargazers.total.min)/(plugins.stargazers.total.max-plugins.stargazers.total.min || 1); const [y, m, d] = date.split("-").map(Number) %>
-                  <span class="value"><%= (value-(previous ?? 0)) ? f(value) : "" %></span>
+                  <div class="entry">
-                  <div class="bar" style="height: <%= p*50 %>px; background-color: var(--color-calendar-graph-day-L<%= Math.ceil(p/0.25) %>-bg)"></div>
+                    <span class="value"><%= (value-(previous ?? 0)) ? f(value) : "" %></span>
-                  <%= d %>
+                    <div class="bar" style="height: <%= p*50 %>px; background-color: var(--color-calendar-graph-day-L<%= Math.ceil(p/0.25) %>-bg)"></div>
-                  <% if ((previous === null)||(d === 1)) { %>
+                    <%= d %>
+                    <% if ((previous === null)||(d === 1)) { %>
+                      <div class="bottom"><%= plugins.stargazers.months[m] %></div>
+                    <% } %>
+                  </div>
+                <% previous = value } } %>
+              </div>
+            <% } %>
+          </section>
+          <section class="column chart chartist">
+            <h3>New stargazers per day</h3>
+            <% if (Array.isArray(plugins.stargazers.charts)) { %>
+              <%- plugins.stargazers.charts[1] %>
+            <% } else { %>
+              <div class="chart-bars">
+                <% { let previous = null; for (const [date, value] of Object.entries(plugins.stargazers.increments.dates)) { const p = value/(plugins.stargazers.increments.max || 1); const [y, m, d] = date.split("-").map(Number) %>
+                  <div class="entry">
+                    <span class="value"><%= value != 0 ? f(value, {sign:true}) : "" %></span>
+                    <div class="bar" style="height: <%= p*50 %>px; background-color: var(--color-calendar-graph-day-L<%= Math.ceil(p/0.25) %>-bg)"></div>
+                    <%= d %>
+                    <% if ((previous === null)||(d === 1)) { %>
                     <div class="bottom"><%= plugins.stargazers.months[m] %></div>
-                  <% } %>
+                    <% } %>
-                </div>
+                  </div>
-              <% previous = value } } %>
+                <% previous = value } } %>
-            </div>
+              </div>
-          <% } %>
+            <% } %>
-        </section>
+          </section>
-        <section class="column chart chartist">
+        </div>
-          <h3>New stargazers per day</h3>
+      <% } %>
-          <% if (plugins.stargazers.charts) { %>
-            <%- plugins.stargazers.charts[1] %>
-          <% } else { %>
-            <div class="chart-bars">
-              <% { let previous = null; for (const [date, value] of Object.entries(plugins.stargazers.increments.dates)) { const p = value/(plugins.stargazers.increments.max || 1); const [y, m, d] = date.split("-").map(Number) %>
-                <div class="entry">
-                  <span class="value"><%= value != 0 ? f(value, {sign:true}) : "" %></span>
-                  <div class="bar" style="height: <%= p*50 %>px; background-color: var(--color-calendar-graph-day-L<%= Math.ceil(p/0.25) %>-bg)"></div>
-                  <%= d %>
-                  <% if ((previous === null)||(d === 1)) { %>
-                  <div class="bottom"><%= plugins.stargazers.months[m] %></div>
-                  <% } %>
-                </div>
-              <% previous = value } } %>
-            </div>
-          <% } %>
-        </section>
-      </div>
       <% if (plugins.stargazers.worldmap) { %>
       <div class="row margin-bottom">
         <h3 class="margin-lr-auto">Stargazers origins</h3>