{% extends "base.html" %}
{% import "repo_tabs.html" as m %}
{% block title %}{{ report.title }} · Reports · {{ repo.owner }}/{{ repo.name }}{% endblock %}
{% block tabs %}{% call m::tabs(repo, "reports") %}{% endblock %}
{% block content %}
<section class="cov-hero">
  <div class="cov-hero-head">
    <div>
      <div class="small"><a href="{{ repo.url }}/reports">Reports</a> /</div>
      <h1>{{ report.title }} <span class="tag rep-kind rep-{{ report.kind }}">{{ report.kind }}</span></h1>
      <div class="cov-sub">{% if bookmarks.len() > 1 %}<form class="inline" method="get" action="{{ repo.url }}/reports/{{ report.name }}"><label for="rep-bm" class="mute">bookmark</label> <select id="rep-bm" name="bookmark" onchange="this.form.submit()">{% for b in bookmarks %}<option value="{{ b }}"{% if b.as_str() == report.bookmark.as_str() %} selected{% endif %}>{{ b }}</option>{% endfor %}</select> <noscript><button>Show</button></noscript></form>{% else %}<span class="mute">on</span> <strong>{{ report.bookmark }}</strong>{% endif %}
        {% if let Some(n) = report.run_number %}· <a href="{{ repo.url }}/flow/{{ n }}">run #{{ n }}</a>{% endif %} · job {{ report.job }} · <time title="{{ report.created_ms|when_i }}">{{ report.created_ms|ago_i }}</time> · {{ report.files }} files, {{ report.bytes|bytes }} · <a href="{{ files_base }}/report.toml" target="_blank" rel="noopener">report.toml</a></div>
      {% if !report.summary.is_empty() %}<p class="rep-summary">{{ report.summary }}</p>{% endif %}
    </div>
  </div>
</section>

{% if timeline.len() > 1 %}
<section class="rep-timeline" data-timeline{% if let Some(p) = play %} data-play="{{ p }}"{% endif %}>
  <div class="rep-tl-bar">
    <button type="button" class="rep-tl-btn" data-tl-play aria-label="{% if play.is_some() %}Stop playing{% else %}Play through the runs{% endif %}">{% if play.is_some() %}■ Stop{% else %}▶ Play{% endif %}</button>
    <label class="small mute">every <select data-tl-speed aria-label="Seconds per run">{% for s in [1u32, 2, 3, 5, 10] %}<option value="{{ s }}"{% if play.unwrap_or(2) == *s %} selected{% endif %}>{{ s }} s</option>{% endfor %}</select></label>
    <form class="inline small" method="get" action="{{ repo.url }}/reports/{{ report.name }}">
      <input type="hidden" name="id" value="{{ report.id }}">
      <label class="mute">compare with <select name="compare" onchange="this.form.submit()" aria-label="Run to compare with"><option value="">none</option>{% for t in timeline %}{% if !t.current %}<option value="{{ t.id }}"{% if t.compared %} selected{% endif %}>{{ t.label }}</option>{% endif %}{% endfor %}</select></label>
      <noscript><button>Compare</button></noscript>
    </form>
    <span class="small mute rep-tl-keys">← → step through runs</span>
  </div>
  <ol class="rep-tl-stops">
    {% for t in timeline %}<li><a href="{{ t.href }}" class="rep-tl-stop{% if t.current %} on{% endif %}{% if t.compared %} cmp{% endif %}" title="{{ t.tip }}"{% if t.current %} aria-current="true"{% endif %} data-tl-stop><span class="sr">{{ t.label }}</span></a></li>{% endfor %}
  </ol>
  <div class="rep-tl-ends small mute"><span>{% if let Some(f) = timeline.first() %}{{ f.label }}{% endif %}</span><span>{% if let Some(l) = timeline.last() %}{{ l.label }}{% endif %}</span></div>
</section>
{% endif %}

{% if let Some((other, rows, _)) = compare %}
<section class="panel">
  <h2 class="rep-cmp-h">This run against {% if let Some(n) = other.run_number %}run #{{ n }}{% else %}an upload{% endif %} <a class="small" href="{{ repo.url }}/reports/{{ report.name }}?id={{ report.id }}">stop comparing</a></h2>
  <table class="rep-table">
    <thead><tr><th>Metric</th><th class="num">{% if let Some(n) = report.run_number %}run #{{ n }}{% else %}this{% endif %}</th><th class="num">{% if let Some(n) = other.run_number %}run #{{ n }}{% else %}that{% endif %}</th><th class="num">Difference</th></tr></thead>
    <tbody>
    {% for c in rows %}
      <tr><td><code>{{ c.key }}</code></td><td class="num"><strong>{{ c.here }}</strong>{% if !c.unit.is_empty() %} <small class="mute">{{ c.unit }}</small>{% endif %}</td><td class="num">{{ c.there }}</td><td class="num">{% if !c.delta.is_empty() %}<span class="rep-delta {{ c.trend }}">{{ c.delta }}</span>{% else %}<span class="mute">–</span>{% endif %}</td></tr>
    {% endfor %}
    </tbody>
  </table>
</section>
{% endif %}

{% if !metrics.is_empty() && compare.is_none() %}
<section class="panel">
  <table class="rep-table">
    <thead><tr><th>Metric</th><th class="num">Value</th><th class="num">Change</th><th>Across runs</th><th>Threshold</th></tr></thead>
    <tbody>
    {% for v in metrics %}
      <tr class="{% if v.failing %}rep-failing{% endif %}">
        <td><code>{{ v.key }}</code></td>
        <td class="num"><strong>{{ v.value }}</strong>{% if !v.unit.is_empty() %} <small class="mute">{{ v.unit }}</small>{% endif %}</td>
        <td class="num">{% if !v.delta.is_empty() %}<span class="rep-delta {{ v.trend }}">{{ v.delta }}</span>{% else %}<span class="mute">–</span>{% endif %}</td>
        <td>{{ v.spark|safe }}</td>
        <td class="small">{% if v.failing %}<span class="error">{{ v.threshold }}: failing</span>{% else %}<span class="mute">{{ v.threshold }}</span>{% endif %}</td>
      </tr>
    {% endfor %}
    </tbody>
  </table>
</section>
{% endif %}

{% if let Some(src) = frame %}
<section class="rep-frame-wrap{% if let Some((_, _, Some(_))) = compare %} rep-side{% endif %}">
  <iframe class="rep-frame" src="{{ src }}" sandbox="allow-scripts" referrerpolicy="no-referrer" loading="lazy" title="{{ report.title }}" data-report-runs="{{ runs_json }}" data-report-current="{{ report.id }}"></iframe>
  {% if let Some((other, _, Some(osrc))) = compare %}<iframe class="rep-frame" src="{{ osrc }}" sandbox="allow-scripts" referrerpolicy="no-referrer" loading="lazy" title="{{ report.title }}, {% if let Some(n) = other.run_number %}run #{{ n }}{% else %}upload{% endif %}" data-report-runs="{{ runs_json }}" data-report-current="{{ other.id }}"></iframe>{% endif %}
  <p class="small mute">The report's own page, in a sandbox: its scripts run with no access to your session or this hub. <a href="{{ src }}" target="_blank" rel="noopener">Open it alone</a>.</p>
</section>
{% endif %}

<div class="cov-grid">
  {% if !context.is_empty() %}
  <section class="panel cov-card">
    <h2>Context</h2>
    <dl class="rep-context">{% for (k, v) in context %}<dt>{{ k }}</dt><dd>{{ v }}</dd>{% endfor %}</dl>
  </section>
  {% endif %}
  <section class="panel cov-card">
    <h2>Runs on {{ report.bookmark }}</h2>
    <ul class="rep-runs">
    {% for r in runs.iter().take(15) %}
      <li{% if r.id == report.id %} class="on"{% endif %}><a href="{{ repo.url }}/reports/{{ report.name }}?id={{ r.id }}">{% if let Some(n) = r.run_number %}run #{{ n }}{% else %}upload{% endif %}</a> <span class="mute small"><time title="{{ r.created_ms|when_i }}">{{ r.created_ms|ago_i }}</time>{% if !r.summary.is_empty() %} · {{ r.summary }}{% endif %}</span></li>
    {% endfor %}
    </ul>
  </section>
</div>
{% endblock %}