update sbot status page and add live data retrieval
This commit is contained in:
parent
b7ec1a42be
commit
e718889485
|
|
@ -1,17 +1,98 @@
|
|||
{%- extends "nav" -%}
|
||||
{%- block card %}
|
||||
{# ASSIGN VARIABLES #}
|
||||
{# ---------------- #}
|
||||
{%- if sbot_stats.memory -%}
|
||||
{% set mem = sbot_stats.memory / 1024 / 1024 | round -%}
|
||||
{%- else -%}
|
||||
{% set mem = "X" -%}
|
||||
{%- endif -%}
|
||||
<!-- SCUTTLEBUTT STATUS -->
|
||||
<div class="card center">
|
||||
<div class="card-container">
|
||||
<p>Network key: </p>
|
||||
<p>Replication hops: </p>
|
||||
<p>Sbot version: </p>
|
||||
<p>Process status: </p>
|
||||
<p>Process uptime: </p>
|
||||
<!-- SBOT INFO BOX -->
|
||||
<div class="capsule capsule-container {% if sbot_stats.state == "active" %}success-border{% else %}warning-border{% endif %}">
|
||||
<!-- SBOT STATUS GRID -->
|
||||
<div class="two-grid" title="go-sbot process state">
|
||||
<!-- top-right config icon -->
|
||||
<a class="link two-grid-top-right" href="/settings/scuttlebutt" title="Configure Scuttlebutt settings">
|
||||
<img id="configureNetworking" class="icon-small" src="/icons/cog.svg" alt="Configure">
|
||||
</a>
|
||||
<!-- left column -->
|
||||
<!-- go-sbot state icon with label -->
|
||||
<div class="grid-column-1">
|
||||
<img id="sbotStateIcon" class="center icon {% if sbot_stats.state == "inactive" %}icon-inactive{% endif %}" src="/icons/hermies.svg" alt="Hermies">
|
||||
<label id="sbotStateLabel" for="sbotStateIcon" class="center label-small font-gray" style="margin-top: 0.5rem;" title="Sbot state">{{ sbot_stats.state | upper }}</label>
|
||||
</div>
|
||||
<!-- right column -->
|
||||
<!-- go-sbot version and uptime / downtime with labels -->
|
||||
<div class="grid-column-2">
|
||||
<label class="label-small font-gray" for="sbotVersion" title="go-sbot version">VERSION</label>
|
||||
<p id="sbotVersion" class="card-text" title="Version">1.1.0-alpha</p>
|
||||
{% if sbot_stats.state == "active" %}
|
||||
<label class="label-small font-gray" for="sbotUptime" title="go-sbot uptime" style="margin-top: 0.5rem;">UPTIME</label>
|
||||
<p id="sbotUptime" class="card-text" title="Uptime">{{ sbot_stats.uptime }}</p>
|
||||
{%- else -%}
|
||||
<label class="label-small font-gray" for="sbotDowntime" title="go-sbot downtime" style="margin-top: 0.5rem;">DOWNTIME</label>
|
||||
<p id="sbotDowntime" class="card-text" title="Downtime">{{ sbot_stats.downtime }}</p>
|
||||
{%- endif -%}
|
||||
</div>
|
||||
</div>
|
||||
<hr style="color: var(--light-gray);">
|
||||
<div id="middleSection" style="margin-top: 1rem;">
|
||||
<div id="ssbSocialCounts" class="center" style="display: flex; justify-content: space-between; width: 90%;">
|
||||
<div style="display: flex; align-items: last baseline;">
|
||||
<label class="card-text" style="margin-right: 2px;">21</label>
|
||||
<label class="label-small font-gray">Friends</label>
|
||||
</div>
|
||||
<div style="display: flex; align-items: last baseline;">
|
||||
<label class="card-text" style="margin-right: 2px;">5</label>
|
||||
<label class="label-small font-gray">Follows</label>
|
||||
</div>
|
||||
<div style="display: flex; align-items: last baseline;">
|
||||
<label class="card-text" style="margin-right: 2px;">38</label>
|
||||
<label class="label-small font-gray">Followers</label>
|
||||
</div>
|
||||
<div style="display: flex; align-items: last baseline;">
|
||||
<label class="card-text" style="margin-right: 2px;">2</label>
|
||||
<label class="label-small font-gray">Blocks</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--
|
||||
not implemented yet:
|
||||
<p class="card-text">Latest sequence number: </p>
|
||||
<p class="card-text">Network key: </p>
|
||||
<p>Blobstore size: </p>
|
||||
<p>Latest sequence number: </p>
|
||||
<p>Last time you visited this page, latest sequence was x ... now it's y</p>
|
||||
<p>Number of follows / followers / friends / blocks</p>
|
||||
-->
|
||||
<hr style="color: var(--light-gray);">
|
||||
<!-- THREE-ACROSS STACK -->
|
||||
<div class="three-grid card-container" style="margin-top: 1rem;">
|
||||
<div class="stack">
|
||||
<img class="icon" title="Hops" src="/icons/orbits.png">
|
||||
<div class="flex-grid" style="padding-top: 0.5rem;">
|
||||
<label class="label-medium" style="padding-right: 3px;" title="Replication hops">2</label>
|
||||
</div>
|
||||
<label class="label-small font-gray">HOPS</label>
|
||||
</div>
|
||||
<div class="stack">
|
||||
<img class="icon" title="Blobs" src="/icons/image-file.png">
|
||||
<div class="flex-grid" style="padding-top: 0.5rem;">
|
||||
<label class="label-medium" style="padding-right: 3px;" title="Blobstore size in MB">163</label>
|
||||
<label class="label-small font-near-black">MB</label>
|
||||
</div>
|
||||
<label class="label-small font-gray">BLOBSTORE</label>
|
||||
</div>
|
||||
<div class="stack">
|
||||
<img class="icon{% if not sbot_stats.memory %} icon-inactive{% endif %}" title="Memory" src="/icons/ram.png">
|
||||
<div class="flex-grid" style="padding-top: 0.5rem;">
|
||||
<label class="label-medium" style="padding-right: 3px;" title="Memory usage of the go-sbot process in MB">{{ mem }}</label>
|
||||
<label class="label-small font-near-black">MB</label>
|
||||
</div>
|
||||
<label class="label-small font-gray">MEMORY</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{%- endblock card -%}
|
||||
|
|
|
|||
Loading…
Reference in New Issue