32 lines
1.5 KiB
Plaintext
32 lines
1.5 KiB
Plaintext
<% if (plugins.poopmap) { %>
|
|
<section>
|
|
<div class="row">
|
|
<% if (plugins.poopmap.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.poopmap.error.message %>
|
|
</div>
|
|
</section>
|
|
<% } else { %>
|
|
<section class="column chart largeable">
|
|
<h3>Poops per hour of day</h3>
|
|
<small>over the last <%- plugins.poopmap.days %> days</small>
|
|
<div class="chart-bars">
|
|
<% let displayedValues = []; %>
|
|
<% let poops = plugins.poopmap.poops %>
|
|
<% for (let h = 0; h < 24; h++) { displayedValues.push([h, (poops[h] || 0)/(poops.max || 1), poops[h]]) } %>
|
|
|
|
<% for(const [h, percentage, value] of displayedValues) { %>
|
|
<div class="entry">
|
|
<span class="value"><%= value %></span>
|
|
<div class="bar" style="height: <%= percentage*50 %>px; background-color: var(--color-calendar-graph-day-L<%= Math.ceil(percentage/0.25) %>-bg)"></div>
|
|
<%= `${h}`.padStart(2, 0) %>
|
|
</div>
|
|
<% } %>
|
|
</div>
|
|
</section>
|
|
<% } %>
|
|
</div>
|
|
</section>
|
|
<% } %> |