{% extends "projects/base.html" %}

{% block page_title %}{{ feature.key }} {{ feature.title }}{% endblock %}

{% block project_content %}
  {% include "features/_header.html" %}

  {% if feature.status == "withdrawn" %}
    <p role="note"><strong>Withdrawn.</strong> This feature is no longer planned.</p>
  {% elif feature.status == "superseded" %}
    <p role="note"><strong>Superseded</strong> by <a href="{% url 'features:detail' org_slug=project.org.slug project_slug=project.slug feature_key=feature.superseded_by.key %}">{{ feature.superseded_by.key }} {{ feature.superseded_by.title }}</a>.</p>
  {% endif %}

  <dl>
    <dt>Status</dt>
    <dd>{{ feature.get_status_display }}</dd>
    <dt>Revision</dt>
    <dd>
      {{ feature.current_revision }}
      (<a href="{% url 'features:history' org_slug=project.org.slug project_slug=project.slug feature_key=feature.key %}">history</a>)
    </dd>
    {% if latest %}
      <dt>Last change</dt>
      <dd>
        <time datetime="{{ latest.created_at|date:'c' }}">{{ latest.created_at|date:"j M Y" }}</time>
        by {{ latest.author.username|default:"unknown" }}: {{ latest.note }}
      </dd>
    {% endif %}
  </dl>

  {% if access.can_edit %}
    <ul>
      <li><a href="{% url 'features:edit' org_slug=project.org.slug project_slug=project.slug feature_key=feature.key %}">Edit</a></li>
      <li><a href="{% url 'features:create' org_slug=project.org.slug project_slug=project.slug %}?parent={{ feature.key }}">Add a sub-feature</a></li>
    </ul>
  {% endif %}

  <section aria-labelledby="description-heading">
    <h2 id="description-heading" class="visually-hidden">Description</h2>
    {% if blocks %}
      {% url 'features:thread_create' org_slug=project.org.slug project_slug=project.slug feature_key=feature.key as thread_create_url %}
      <div class="prose">
        {% for block, threads in blocks %}
          {# Each block of the description can carry its own threads, like lines in a code review. #}
          <div class="block" id="{{ block.anchor }}">
            {{ block.html }}
            {% for thread in threads %}
              {% include "comments/_thread.html" %}
            {% endfor %}
            {% if access.can_contribute %}
              <details class="line-comment">
                <summary>Comment<span class="visually-hidden"> on lines {{ block.start }}–{{ block.end }}</span></summary>
                <form method="post" action="{{ thread_create_url }}">
                  {% csrf_token %}
                  <input type="hidden" name="revision" value="{{ feature.current_revision }}">
                  <input type="hidden" name="line_start" value="{{ block.start }}">
                  <input type="hidden" name="line_end" value="{{ block.end }}">
                  <label for="body-{{ block.anchor }}">Comment on lines {{ block.start }}–{{ block.end }}</label>
                  <textarea id="body-{{ block.anchor }}" name="body" rows="3" required></textarea>
                  <button type="submit">Comment</button>
                </form>
              </details>
            {% endif %}
          </div>
        {% endfor %}
      </div>
    {% else %}
      <p class="muted">No description yet.</p>
    {% endif %}
  </section>

  {% if children %}
    <section aria-labelledby="children-heading">
      <h2 id="children-heading">Sub-features</h2>
      <ul>
        {% for child in children %}
          <li>
            <a href="{% url 'features:detail' org_slug=project.org.slug project_slug=project.slug feature_key=child.key %}">{{ child.key }} {{ child.title }}</a>
            {% if child.status != "active" %}<span class="muted">({{ child.get_status_display|lower }})</span>{% endif %}
          </li>
        {% endfor %}
      </ul>
    </section>
  {% endif %}

  {% if supersedes %}
    <section aria-labelledby="supersedes-heading">
      <h2 id="supersedes-heading">Replaces</h2>
      <ul>
        {% for old in supersedes %}
          <li><a href="{% url 'features:detail' org_slug=project.org.slug project_slug=project.slug feature_key=old.key %}">{{ old.key }} {{ old.title }}</a></li>
        {% endfor %}
      </ul>
    </section>
  {% endif %}

  <section id="issues" aria-labelledby="issues-heading">
    <h2 id="issues-heading">Issues</h2>
    {% if issues %}
      <ul>
        {% for issue in issues %}
          <li>
            <a href="{% url 'issues:detail' org_slug=project.org.slug project_slug=project.slug number=issue.number %}">{{ issue.key }} {{ issue.title }}</a>
            <span class="muted">({{ issue.get_status_display|lower }})</span>
          </li>
        {% endfor %}
      </ul>
    {% else %}
      <p class="muted">No issues linked.</p>
    {% endif %}
    {% if access.can_contribute %}
      <p><a href="{% url 'issues:create' org_slug=project.org.slug project_slug=project.slug %}?feature={{ feature.key }}">Open an issue about {{ feature.key }}</a></p>
    {% endif %}
  </section>

  <section id="discussion" aria-labelledby="discussion-heading">
    <h2 id="discussion-heading">Discussion</h2>
    {% for thread in general_threads %}
      {% include "comments/_thread.html" %}
    {% empty %}
      <p class="muted">No comments yet.</p>
    {% endfor %}
    {% if access.can_contribute %}
      <form method="post" action="{% url 'features:thread_create' org_slug=project.org.slug project_slug=project.slug feature_key=feature.key %}">
        {% csrf_token %}
        <label for="new-thread">Start a thread about {{ feature.key }}</label>
        <textarea id="new-thread" name="body" rows="4" required></textarea>
        <p class="muted">Markdown. To comment on part of the description, use the Comment button below that part.</p>
        <button type="submit">Comment</button>
      </form>
    {% elif not user.is_authenticated and project.open_contribution %}
      <p><a href="{% url 'account_login' %}?next={{ request.path|urlencode }}">Sign in</a> to join the discussion.</p>
    {% endif %}
  </section>

  {% if outdated_threads %}
    <section aria-labelledby="outdated-heading">
      <h2 id="outdated-heading">Comments on earlier revisions</h2>
      {% for thread in outdated_threads %}
        {% include "comments/_thread.html" %}
      {% endfor %}
    </section>
  {% endif %}
{% endblock %}