{% extends "base.html" %}

{% load crispy_forms_tags i18n metrics translations %}

{% block nav_pills %}
  <ul class="nav nav-pills">
    <li class="active">
      <a href="#translation" data-toggle="tab">{% translate "Translation" %}</a>
    </li>
    <li>
      <a href="#components" data-toggle="tab">{% translate "Components" %}</a>
    </li>
    <li>
      <a href="#information" data-toggle="tab">{% translate "Overview" %}</a>
    </li>
    <li>
      <a href="#search" data-toggle="tab">{% translate "Search" %}</a>
    </li>
    <li class="dropdown">
      <a class="dropdown-toggle" data-toggle="dropdown" href="#">
        {% translate "Insights" %} <span class="caret"></span>
      </a>
      <ul class="dropdown-menu">
        <li>
          <a href="#history" data-toggle="tab">{% translate "History" %}</a>
        </li>
        <li>
          <a href="{% url 'checks' path=object.get_url_path %}">{% translate "Failing checks" %}</a>
        </li>
      </ul>
    </li>
    <li class="dropdown">
      <a class="dropdown-toggle" data-toggle="dropdown" href="#">
        {% translate "Files" %} <span class="caret"></span>
      </a>
      <ul class="dropdown-menu">
        <li>
          <a href="{% url 'download' path=object.get_url_path %}?format=zip"
             title="{% translate "Download for offline translation." %}">{% blocktranslate %}Download original translation files as ZIP file{% endblocktranslate %}</a>
        </li>
      </ul>
    </li>
    <li class="dropdown">
      <a class="dropdown-toggle" data-toggle="dropdown" href="#">
        {% translate "Operations" %} <span class="caret"></span>
      </a>
      <ul class="dropdown-menu">
        {% if replace_form %}
          <li>
            <a href="#replace" data-toggle="tab">{% translate "Search and replace" %}</a>
          </li>
        {% endif %}
        {% if bulk_state_form %}
          <li>
            <a href="#bulk-edit" data-toggle="tab">{% translate "Bulk edit" %}</a>
          </li>
        {% endif %}
        {% if delete_form %}
          <li role="separator" class="divider"></li>
          <li>
            <a href="#organize" data-toggle="tab">{% translate "Organize or remove" %}</a>
          </li>
        {% endif %}
      </ul>
    </li>
    {% include "snippets/watch-dropdown.html" with project=category.project %}
  </ul>
{% endblock nav_pills %}

{% block breadcrumbs %}
  {% path_object_breadcrumbs path_object %}
{% endblock breadcrumbs %}

{% block content %}


  <div class="tab-content">

    <div class="tab-pane active" id="translation">{% include "snippets/translation.html" %}</div>
    <div class="tab-pane active" id="components">
      {% include "snippets/list-objects.html" with objects=translation_objects list_categories=categories name_source="component_name" label=_("Component") %}

      {% include "paginator.html" with page_obj=translations %}
    </div>

    <div class="tab-pane" id="information">
      {% show_info project=category.project stats=language_stats metrics=object|metrics %}
    </div>

    <div class="tab-pane" id="history">
      {% format_last_changes_content last_changes=last_changes user=user %}
      <a class="btn btn-primary" href="{% url 'changes' path=object.get_url_path %}">{% translate "Browse all changes for this language" %}</a>
    </div>

    <div class="tab-pane" id="search">

      <form action="{% url 'search' path=object.get_url_path %}" method="get">
        {% include "snippets/search-form.html" %}
      </form>

    </div>

    {% if delete_form %}
      <div class="tab-pane" id="organize">{% include "trans/delete-form.html" %}</div>
    {% endif %}

    {% if replace_form %}
      <div class="tab-pane" id="replace">
        <form action="{% url 'replace' path=object.get_url_path %}"
              method="post"
              enctype="multipart/form-data">
          <div class="panel panel-default">
            <div class="panel-heading">
              <h4 class="panel-title">
                {% documentation_icon 'user/translating' 'search-replace' right=True %}
                {% translate "Search and replace" %}
              </h4>
            </div>
            <div class="panel-body">{% crispy replace_form %}</div>
            <div class="panel-footer">
              <input type="submit" value="{% translate "Replace" %}" class="btn btn-primary" />
            </div>
          </div>
        </form>
      </div>
    {% endif %}

    {% if bulk_state_form %}
      <div class="tab-pane" id="bulk-edit">
        <form action="{% url 'bulk-edit' path=object.get_url_path %}"
              method="post"
              enctype="multipart/form-data">
          <div class="panel panel-default">
            <div class="panel-heading">
              <h4 class="panel-title">
                {% documentation_icon 'user/translating' 'bulk-edit' right=True %}
                {% translate "Bulk edit" %}
              </h4>
            </div>
            <div class="panel-body">{% crispy bulk_state_form %}</div>
            <div class="panel-footer">
              <input type="submit" value="{% translate "Apply" %}" class="btn btn-primary" />
            </div>
          </div>
        </form>
      </div>
    {% endif %}

  </div>

{% endblock content %}