{% extends "base.html" %}
{% block title %}{{ run.display_name }}{% endblock %}
{% block body %}
<section class="section-head">
  <div><h1>{{ run.display_name }}</h1><p><a href="{{ url_for('plane_mirror_detail', mirror_id=run.mirror_id) }}">{{ run.mirror_name }}</a> · {{ run.created_at }}</p></div>
  <div class="actions">
    <a class="button" href="{{ url_for('plane_mirror_runs') }}">Manage plane-mirror runs</a>
    {% if run.status in ['queued','running','aborting'] %}<form method="post" action="{{ url_for('plane_mirror_run_abort', run_id=run.id) }}"><button class="button danger" type="submit">Abort</button></form>{% endif %}
    {% if run.status in ['aborted','error','failed','completed'] %}
      <form method="post" action="{{ url_for('plane_mirror_run_resume', run_id=run.id) }}"><button class="button primary" type="submit">Resume</button></form>
      <form method="post" action="{{ url_for('plane_mirror_run_restart', run_id=run.id) }}"><button class="button" type="submit">Restart</button></form>
    {% endif %}
  </div>
</section>
<section class="notice" data-mirror-run-status data-status-url="{{ url_for('plane_mirror_run_status', run_id=run.id) }}">
  <strong>{{ run.status }}</strong> · <span>{{ run.completed_points }} / {{ run.total_points }} variations</span>
  {% if run.error_text %}<p class="notice-error">{{ run.error_text }}</p>{% endif %}
</section>
{% if run.scan_details %}
<section>
  <h2>Scan settings</h2>
  <dl class="plane-mirror-parameter-list">
    {% for label, value in run.scan_details %}<dt>{{ label }}</dt><dd>{{ value }}</dd>{% endfor %}
  </dl>
</section>
{% endif %}
{% if run.completed_points %}<section class="preview-panel"><h2>Results</h2><img class="plane-mirror-result-plot" src="{{ url_for('data_file', filename='runs/' ~ run.id ~ '/plot.png', v=run.completed_points) }}" alt="Plane-mirror scan results"></section>{% endif %}
{% if results %}
<section><h2>Variation results</h2><div class="run-compare-table-wrap"><table class="run-compare-table"><thead><tr><th>Case</th><th>Parameters</th><th>Scan</th></tr></thead><tbody>
{% for result in results %}<tr><td>{{ result.index }}</td><td>{% if result.parameters %}{% for key, value in result.parameters.items() %}<div>{{ key }} = {{ value }}</div>{% endfor %}{% else %}Base settings{% endif %}</td><td>{{ result.mode }} · {{ result.x|length }} samples</td></tr>{% endfor %}
</tbody></table></div></section>
{% endif %}
<script>
(() => {
  const box = document.querySelector('[data-mirror-run-status]');
  if (!box) return;
  const refresh = async () => {
    try {
      const response = await fetch(box.dataset.statusUrl, {cache: 'no-store'});
      const state = await response.json();
      const heading = document.createElement('strong');
      heading.textContent = state.status;
      const count = document.createElement('span');
      count.textContent = ` · ${state.completed_points} / ${state.total_points} variations`;
      box.replaceChildren(heading, count);
      if (state.error_text) {
        const error = document.createElement('p');
        error.className = 'notice-error';
        error.textContent = state.error_text;
        box.append(error);
      }
      if (['queued', 'running', 'aborting'].includes(state.status)) setTimeout(refresh, 1500);
      else location.reload();
    } catch {
      setTimeout(refresh, 3000);
    }
  };
  if (['queued', 'running', 'aborting'].includes({{ run.status|tojson }})) setTimeout(refresh, 1200);
})();
</script>
{% endblock %}