{% extends 'base/layout.html' %}
{% load helpers %}
{% load buttons %}
{% load perms %}

{% block title %}{{ script }}{% endblock %}

{% block subtitle %}
  {{ script.Meta.description|markdown }}
{% endblock %}

{% block header %}
  <div class="row noprint">
    <div class="col col-md-12">
      <nav class="breadcrumb-container px-3" aria-label="breadcrumb">
        <ol class="breadcrumb">
          <li class="breadcrumb-item"><a href="{% url 'extras:script_list' %}">Scripts</a></li>
          <li class="breadcrumb-item"><a href="{% url 'extras:script_list' %}#module.{{ script.module }}">{{ script.module|bettertitle }}</a></li>
          <li class="breadcrumb-item"><a href="{% url 'extras:script' module=script.module name=class_name %}">{{ script }}</a></li>
          <li class="breadcrumb-item">{{ result.created|annotated_date }}</li>
        </ol>
      </nav>
    </div>
  </div>
  {{ block.super }}
{% endblock header %}

{% block controls %}
  <div class="controls">
    <div class="control-group">
      {% if request.user|can_delete:result %}
        {% delete_button result %}
      {% endif %}
    </div>
  </div>
{% endblock controls %}

{% block content-wrapper %}
  <ul class="nav nav-tabs px-3" role="tablist">
    <li class="nav-item" role="presentation">
      <a href="#log" role="tab" data-bs-toggle="tab" class="nav-link active">Log</a>
    </li>
    <li class="nav-item" role="presentation">
      <a href="#source" role="tab" data-bs-toggle="tab" class="nav-link">Source</a>
    </li>
  </ul>
  <div class="tab-content mb-3">
    <div role="tabpanel" class="tab-pane active" id="log">
      <div class="row">
        <div class="col col-md-12"{% if not result.completed %} hx-get="{% url 'extras:script_result' job_result_pk=result.pk %}" hx-trigger="every 5s"{% endif %}>
          {% include 'extras/htmx/script_result.html' %}
        </div>
      </div>
    </div>
    <div role="tabpanel" class="tab-pane" id="source">
      <p><code>{{ script.filename }}</code></p>
      <pre class="block">{{ script.source }}</pre>
    </div>
  </div>
{% endblock content-wrapper %}

{% block modals %}
  {% include 'inc/htmx_modal.html' %}
{% endblock modals %}