New, updated version of web. Might contain customizations

This commit is contained in:
2019-08-21 15:44:49 +02:00
parent c3850b6e19
commit 47326ed774
11 changed files with 600 additions and 536 deletions

56
web/templates/status_admin.html Normal file → Executable file
View File

@@ -4,19 +4,35 @@
<div class="col"></div>
<main class="pt-4 col-10">
<h1>Status Dashboard</h1>
<h5>{timestamp} UTC</h5>
<h5 id="timestamp">{timestamp} UTC</h5>
<p>Up since: {_uptime}</p>
<section class="row text-center placeholders">
<div class="col placeholder">
<img src="{sol_icon}" width="20" class="img-fluid" alt="ISS solar irradiation">
<h3>{sol_value}</h3>
<h3 id="sol_val">{_sol_value}</h3>
<div class="text-muted">[V]</div>
</div>
<div class="col placeholder">
<img src="{cap_icon}" width="20" class="img-fluid" alt="ISS Capacitor state">
<h3>{cap_value}</h3>
<h3 id="cap_val">{_cap_value}</h3>
<div class="text-muted">[V]</div>
</div>
<div class="col placeholder">
<img src="{cpu_icon}" width="20" class="img-fluid" alt="CPU %">
<h3 id="cpu_val">{_cpu}</h3>
<div class="text-muted">[%]</div>
</div>
<div class="col placeholder">
<img src="{mem_icon}" width="20" class="img-fluid" alt="Mem / Disk %">
<h3><span id="mem">{_mem}</span> / <span id="disk">{_disk}</span></h3>
<div class="text-muted">[%]</div>
</div>
<div class="col placeholder">
<img src="{network_icon}" width="20" class="img-fluid" alt="RasPI network">
<h3><span id="net_in">{_net_in}</span> / <span id="net_out">{_net_out}</span></h3>
<div class="text-muted">IN [kB/s] / OUT [kB/s]</div>
</div>
</section>
<section class="row text-center placeholders">
<div class="col">
@@ -31,6 +47,7 @@
<button type="button" class="btn btn-secondary btn-sm" onclick="setHours('4320','solcap_monitor')">6Mo</button>
<button type="button" class="btn btn-secondary btn-sm" onclick="setHours('8640','solcap_monitor')">Year</button>
<button type="button" class="btn btn-secondary" onclick="setForth('solcap_monitor')">&gt;&gt;</button>
<h6><span id="graph_timestamp">{timestamp}</span> UTC</h6>
</div>
</section>
<section class="row text-center placeholders">
@@ -47,8 +64,39 @@
<button type="button" class="btn btn-secondary btn-sm" onclick="setHours('4320','cpumem_monitor')">6Mo</button>
<button type="button" class="btn btn-secondary btn-sm" onclick="setHours('8640','cpumem_monitor')">Year</button>
<button type="button" class="btn btn-secondary" onclick="setForth('cpumem_monitor')">&gt;&gt;</button>
<h6><span id="graph_timestamp">{timestamp}</span> UTC</h6>
</div>
<script type="text/javascript" src="../static/js/solcap_graph.js"></script>
</section>
<section class="row text-center placeholders">
<div class="col">
<div id="network_labels"></div>
<div id="network" class="container-fluid" style="width:100%;height:200px;"></div>
<button type="button" class="btn btn-secondary" onclick="setBack('network_monitor')">&lt;&lt;</button>
<button type="button" class="btn btn-secondary btn-sm" onclick="setHours('1','network_monitor')">1h</button>
<button type="button" class="btn btn-secondary btn-sm" onclick="setHours('6','network_monitor')">6h</button>
<button type="button" class="btn btn-secondary btn-sm" onclick="setHours('12','network_monitor')">12h</button>
<button type="button" class="btn btn-secondary btn-sm" onclick="setHours('24','network_monitor')">24h</button>
<button type="button" class="btn btn-secondary btn-sm" onclick="setHours('168','network_monitor')">Week</button>
<button type="button" class="btn btn-secondary btn-sm" onclick="setHours('720','network_monitor')">Month</button>
<button type="button" class="btn btn-secondary btn-sm" onclick="setHours('4320','network_monitor')">6Mo</button>
<button type="button" class="btn btn-secondary btn-sm" onclick="setHours('8640','network_monitor')">Year</button>
<button type="button" class="btn btn-secondary" onclick="setForth('network_monitor')">&gt;&gt;</button>
<h6><span id="graph_timestamp">{timestamp}</span> UTC</h6>
</div>
</section>
<section class="row text-center placeholders">
<div class="col">
<div id="esp_battery_labels"></div>
<div id="esp_battery" class="container-fluid" style="width:100%;height:200px;"></div>
<button type="button" class="btn btn-secondary" onclick="setBack('esp_battery_monitor')">&lt;&lt;</button>
<button type="button" class="btn btn-secondary btn-sm" onclick="setHours('168','esp_battery_monitor')">Week</button>
<button type="button" class="btn btn-secondary btn-sm" onclick="setHours('720','esp_battery_monitor')">Month</button>
<button type="button" class="btn btn-secondary btn-sm" onclick="setHours('4320','esp_battery_monitor')">6Mo</button>
<button type="button" class="btn btn-secondary btn-sm" onclick="setHours('8640','esp_battery_monitor')">Year</button>
<button type="button" class="btn btn-secondary" onclick="setForth('esp_battery_monitor')">&gt;&gt;</button>
<h6><span id="graph_timestamp">{timestamp}</span> UTC</h6>
</div>
<script type="text/javascript" src="../static/js/status_graph.js"></script>
</section>
</main>
<div class="col"></div>