65 lines
2.5 KiB
HTML
65 lines
2.5 KiB
HTML
{# HTMX fragment — included in both /ping/ page and dashboard widget #}
|
|
{% macro pill_bg(p) %}
|
|
{%- if p is none or p.status.value == 'down' or p.response_time_ms is none -%}
|
|
#6a1515
|
|
{%- elif p.response_time_ms <= good_ms -%}
|
|
#1a6632
|
|
{%- elif p.response_time_ms <= warn_ms -%}
|
|
#6b5c00
|
|
{%- else -%}
|
|
#7a3800
|
|
{%- endif -%}
|
|
{% endmacro %}
|
|
{% macro pill_title(p) %}
|
|
{%- if p is none -%}No data
|
|
{%- elif p.status.value == 'down' -%}Down — {{ p.probed_at.strftime('%H:%M:%S') }} UTC
|
|
{%- else -%}{{ "%.1f"|format(p.response_time_ms) }} ms — {{ p.probed_at.strftime('%H:%M:%S') }} UTC
|
|
{%- endif -%}
|
|
{% endmacro %}
|
|
{% if hosts %}
|
|
{% for host in hosts %}
|
|
{% set host_pings = pings_by_host.get(host.id, []) %}
|
|
{% set last = host_pings[-1] if host_pings else none %}
|
|
<div class="ping-row">
|
|
<div class="ping-meta">
|
|
<span class="ping-name">{{ host.name }}</span>
|
|
<span class="ping-addr">{{ host.address }}</span>
|
|
</div>
|
|
<div class="ping-pills">
|
|
{% for _ in range([30 - host_pings|length, 0]|max) %}
|
|
<span class="pill pill-empty" title="No data"></span>
|
|
{% endfor %}
|
|
{% for p in host_pings %}
|
|
<span class="pill" style="background:{{ pill_bg(p) }};" title="{{ pill_title(p) }}"></span>
|
|
{% endfor %}
|
|
</div>
|
|
<div class="ping-cur">
|
|
{% if last is none %}
|
|
<span class="ping-cur-nd">—</span>
|
|
{% elif last.status.value == 'down' or last.response_time_ms is none %}
|
|
<span class="ping-cur-down">DOWN</span>
|
|
{% elif last.response_time_ms <= good_ms %}
|
|
<span class="ping-cur-good">{{ "%.1f"|format(last.response_time_ms) }} ms</span>
|
|
{% elif last.response_time_ms <= warn_ms %}
|
|
<span class="ping-cur-warn">{{ "%.1f"|format(last.response_time_ms) }} ms</span>
|
|
{% else %}
|
|
<span class="ping-cur-bad">{{ "%.1f"|format(last.response_time_ms) }} ms</span>
|
|
{% endif %}
|
|
</div>
|
|
{% if uptime_pcts is defined %}
|
|
{% set pct = uptime_pcts.get(host.id) %}
|
|
<div style="min-width:4.5rem;text-align:right;font-size:0.78rem;font-variant-numeric:tabular-nums;color:
|
|
{% if pct is none %}var(--text-dim)
|
|
{% elif pct >= 99 %}var(--green)
|
|
{% elif pct >= 95 %}var(--yellow)
|
|
{% else %}var(--red){% endif %};">
|
|
{% if pct is not none %}{{ "%.1f"|format(pct) }}%{% else %}—{% endif %}
|
|
<span style="color:var(--text-dim);font-size:0.7rem;margin-left:0.15rem;">{{ range_key }}</span>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
{% endfor %}
|
|
{% else %}
|
|
<p style="color:#505070;font-size:0.85rem;padding:0.5rem 0;">No ping-enabled hosts. <a href="/hosts/" style="color:#7070c0;">Add hosts →</a></p>
|
|
{% endif %}
|