{% extends "base.html" %}
{% block title %}Plot {{ plot.id }}{% endblock %}
{% block body %}
<section class="section-head">
  <div>
    <h1>{{ plot.name or plot.title }}</h1>
    <p>{{ plot.created_at }}</p>
  </div>
  <div class="actions">
    {% if plot.plot_config and selected_runs | selectattr('available', 'equalto', false) | list | length == 0 %}<a class="button" href="{{ url_for('plot_edit', plot_id=plot.id) }}">Edit plot</a>{% endif %}
    <a class="button" href="{{ url_for('plot_index') }}">Back to plots</a>
    {% if plot.plot_path or plot.figure_json or plot.plot_config %}
    <details class="plot-download-menu">
      <summary class="button">Download</summary>
      <div class="plot-download-options">
        {% if plot.plot_path %}<a href="{{ url_for('data_file', filename='plots/' ~ plot.id ~ '/' ~ plot.plot_path) }}" download>PNG</a>{% endif %}
        {% if plot.figure_json or plot.plot_config %}
          <a href="{{ url_for('plot_export', plot_id=plot.id, kind='data') }}">Data</a>
          <a href="{{ url_for('plot_export', plot_id=plot.id, kind='script') }}">Data + script</a>
        {% endif %}
      </div>
    </details>
    {% endif %}
  </div>
</section>

{% if plot.plot_path %}
<section class="notice">
  {% if plot.run_images %}<p class="subtle">A copy is also saved beside each selected run's manifest.json.</p>{% endif %}
</section>
{% endif %}

<section class="notice">
  {% if plot.figure_json %}
    <p>This saved comparison is stored as an interactive Plotly figure with persistent style and axis settings.</p>
  {% else %}
    <p>
      Plot image: <code>{{ plots_dir }}/{{ plot.id }}/{{ plot.plot_path }}</code>
    </p>
  {% endif %}
</section>

{% if plot.figure_json %}
  <div
    class="plotly-stage plot-preview"
    data-saved-plot-figure
    data-figure-json="{{ plot.figure_json | e }}"
  ></div>
{% else %}
  <img
    class="preview plot-preview"
    src="{{ url_for('data_file', filename='plots/' ~ plot.id ~ '/' ~ plot.plot_path) }}"
    alt="{{ plot.title }}"
  >
{% endif %}

<section>
  <h2>Selected runs</h2>
  {% if plot.selected_runs %}
    <div class="list compact">
      {% for run in selected_runs %}
        <div class="row">
          {% if run.available %}<strong><a href="{{ run.url }}">{{ run.name }}</a></strong>{% else %}<strong>Run unavailable: {{ run.name }}</strong>{% endif %}
          {% if run.is_plane_mirror %}<span>Plane-mirror reflectivity</span>{% else %}<span>Orders: {{ run.orders | join(', ') }}</span>{% endif %}
        </div>
      {% endfor %}
    </div>
  {% else %}
    <p class="empty">No runs selected.</p>
  {% endif %}
</section>
{% endblock %}