{% extends "./browse.html" %}

{% comment %}
Copyright (C) 2017-2018  The Software Heritage developers
See the AUTHORS file at the top-level directory of this distribution
License: GNU Affero General Public License version 3, or any later version
See top-level LICENSE file for more information
{% endcomment %}

{% load static %}
{% load swh_templatetags %}
{% load render_bundle from webpack_loader %}

{% block header %}
{{ block.super }}
{% render_bundle 'revision' %}
{% endblock %}

{% block swh-browse-content %}
<div>
  <i class="{{ swh_object_icons|key_value:'revision' }} fa-fw"></i>Revision <b>{{ swh_object_metadata.revision }}</b>
  authored by {{ swh_object_metadata.author }} on <b>{{ swh_object_metadata.date }}</b>,
  committed by {{ swh_object_metadata.committer }} on <b>{{ swh_object_metadata|key_value:'committer date' }}</b>
</div>

<div class="card">
  <div class="card-header bg-gray-light border-bottom-0" style="padding-left: 9.5px;">
    <a data-toggle="collapse" id="swh-collapse-revision-message" href="#swh-revision-message">
      <div class="float-left">
        <pre style="white-space: pre-wrap; background-color: inherit; padding: 0px; margin: 0px; border: none;"><h5 style="padding-bottom: 0px; font-weight: normal;">{{ message_header }}</h5></pre>
      </div>
      <div class="clearfix"></div>
    </a>
  </div>
  {% if message_body %}
    <div id="swh-revision-message" class="collapse show">
      <pre style="white-space: pre-wrap; margin: 0px; border: none; border-radius: 0px;">{{ message_body }}</pre>
    </div>
  {% endif %}
</div>

<div style="margin: 4px; padding-bottom: 5px;">
  <b>{{ parents|length }} parent{% if parents|length > 1 %}s{% endif %}</b>
  <i class="{{ swh_object_icons.revision }} fa-fw"></i>
  {% for parent in parents %}
    <a href="{{ parent.url }}">{{ parent.id|slice:":7" }}</a>
    {% if not forloop.last %}
      +
    {% endif %}
  {% endfor %}
</div>

<ul class="nav nav-tabs" style="padding-left: 5px;">
  <li class="nav-item"><a class="nav-link active" data-toggle="tab" href="#swh-revision-tree">Files</a></li>
  <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#swh-revision-changes">Changes</a></li>
</ul>

<div class="tab-content">
  <div id="swh-revision-tree" class="tab-pane active">
    {% include "includes/top-navigation.html" %}
    {% if content_size %}
      {% include "includes/content-display.html" %}
    {% else %}
      {% include "includes/directory-display.html" %}
    {% endif %}
  </div>

  <div id="swh-revision-changes" class="tab-pane">
    <div id="swh-too-large-revision-diff" class="alert alert-warning" role="alert" style="display: none; margin: 5px 5px 0px 5px">
      The diff you're trying to view is too large. Only the first <span id="swh-nb-loaded-diffs">1000</span> changed files have been loaded.
    </div>
    <div id="swh-revision-diffs" style="padding: 5px; padding-bottom: 0;">
      <div class="card">
        <div class="card-header bg-gray-light border-bottom-0">
          <a data-toggle="collapse" href="#swh-revision-changes-list">
            <div class="float-left">
              Showing <strong id="swh-revision-changed-files"></strong>
              with <strong id="swh-revision-lines-added" style="color:green">0 additions</strong>
              and <strong id="swh-revision-lines-deleted" style="color:red">0 deletions</strong>
              (<span id="swh-nb-diffs-computed">0</span> / <span id="swh-total-nb-diffs">0</span> diffs computed)
            </div>
            <div class="float-right">
              <button class="btn btn-default btn-sm" type="button" onclick="swh.revision.computeAllDiffs(event)" id="swh-compute-all-diffs"
                      title="By default, diffs will be computed as the view is scrolled.
Pushing that button will request the immediate computation of all diffs." style="visibility: hidden;">Compute all diffs</button>
            </div>
            <div class="clearfix"></div>
          </a>
        </div>
        <div id="swh-revision-changes-list" class="collapse show">
          <div id="swh-revision-changes-loading" class="text-center">
            <img src="{% static "img/swh-spinner.gif" %}"></img>
            <p>Computing file changes ...</p>
          </div>
          <pre style="background: none; border: none; display: none;"></pre>
        </div>
      </div>
    </div>
  </div>
</div>

<script>
  var revMsgBody = {{ message_body|jsonify }};
  var diffRevUrl = {{ diff_revision_url|jsonify }};
  swh.revision.initRevisionDiff(revMsgBody, diffRevUrl);
</script>
{% endblock %}

{% block swh-browse-after-content %}
{% include "includes/readme-display.html" %}
{% endblock %}
