{% extends "base.html" %}
{% block content %}
<div style="display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:1rem;margin-bottom:1.5rem;">
  <h1 style="margin:0;">Analysis Results</h1>
  <div style="display:flex;gap:0.75rem;align-items:center;flex-wrap:wrap;">
    <a href="/">&larr; Upload another file</a>
    {% if saved_analysis_id %}
      <a href="{{ url_for('analyses.detail', analysis_id=saved_analysis_id) }}"
         style="font-size:0.9rem;color:#1f77b4;">View saved report &rarr;</a>
    {% endif %}
    <a href="data:application/pdf;base64,{{ pdf_b64 }}"
       download="ballistic_report.pdf"
       style="background:#1f77b4;color:#fff;border-radius:4px;padding:0.5rem 1.1rem;font-size:0.9rem;text-decoration:none;">
      &#8659; Download PDF report
    </a>
  </div>
</div>

<h2>Overall Statistics</h2>
<table>
  <thead>
    <tr>
      <th>Metric</th>
      <th>Value</th>
    </tr>
  </thead>
  <tbody>
    <tr><td>Total shots</td><td>{{ overall.count }}</td></tr>
    <tr><td>Min speed</td><td>{{ "%.4f"|format(overall.min_speed) }}</td></tr>
    <tr><td>Max speed</td><td>{{ "%.4f"|format(overall.max_speed) }}</td></tr>
    <tr><td>Mean speed</td><td>{{ "%.4f"|format(overall.mean_speed) }}</td></tr>
    <tr>
      <td>Std dev (speed)</td>
      <td>
        {% if overall.std_speed is not none %}
          {{ "%.4f"|format(overall.std_speed) }}
        {% else %}
          &ndash;
        {% endif %}
      </td>
    </tr>
  </tbody>
</table>

<img class="chart-img" src="data:image/png;base64,{{ overview_chart }}"
     alt="Avg speed and std dev per group" style="max-width:600px;margin:1rem 0 1.5rem;">

<h2>Groups &mdash; {{ groups_display|length }} group(s) detected</h2>

{% for stat, chart_b64 in groups_display %}
<div class="group-section">
  <h3>Group {{ stat.group_index }}</h3>
  <div class="group-meta">
    {{ stat.time_start }} &ndash; {{ stat.time_end }} &nbsp;|&nbsp; {{ stat.count }} shot(s)
  </div>
  <table>
    <thead>
      <tr>
        <th>Metric</th>
        <th>Value</th>
      </tr>
    </thead>
    <tbody>
      <tr><td>Min speed</td><td>{{ "%.4f"|format(stat.min_speed) }}</td></tr>
      <tr><td>Max speed</td><td>{{ "%.4f"|format(stat.max_speed) }}</td></tr>
      <tr><td>Mean speed</td><td>{{ "%.4f"|format(stat.mean_speed) }}</td></tr>
      <tr>
        <td>Std dev (speed)</td>
        <td>
          {% if stat.std_speed is not none %}
            {{ "%.4f"|format(stat.std_speed) }}
          {% else %}
            &ndash;
          {% endif %}
        </td>
      </tr>
    </tbody>
  </table>
  <img class="chart-img" src="data:image/png;base64,{{ chart_b64 }}" alt="Speed chart for group {{ stat.group_index }}">
</div>
{% endfor %}
{% endblock %}