{% overextends "browser/index.html" %}
{% load i18n %}

{% block sidebar_content %}
{% if display_download or upload_form %}
<div class="sidebar-group">
  {% if display_download %}
  <p class="sidebar-action">
    {% if upload_form %}
    <a href="{% url 'pootle-export' %}?path={{ pootle_path }}"
      title="{% trans 'Download translation files for offline translation' %}">
      <i class="icon-download"></i> <span>{% trans 'Download for offline translation' %}</span>
    </a>
    {% else %}
    <a href="{% url 'pootle-export' %}?path={{ pootle_path }}"
      title="{% trans 'Download translation files for backup' %}">
      <i class="icon-download"></i> <span>{% trans 'Download for backup' %}</span>
    </a>
    {% endif %}
  </p>
  {% endif %}

  {% if upload_form %}
  <p class="sidebar-action">
    <a href="" id="js-open-upload-dialog"
      title="{% trans 'Upload translation files or archives in .zip format' %}">
      <i class="icon-upload"></i> <span>{% trans 'Upload translations' %}</span>
    </a>
  </p>

  <form action="" method="post" enctype="multipart/form-data"
    id="js-upload-form" class="upload-form">
    {% csrf_token %}
    <div class="hide">{{ upload_form.file }}</div>
    <span {% if not has_admin_access %}class="hide"{% endif %}>
    {% blocktrans with user=upload_form.user_id trimmed %}
      Upload as {{ user }}
    {% endblocktrans %}
    </span>
    <div class="hide"><input type="submit" /></div>
  </form>
  {# Dirty hack: Upload form is hidden, so render errors out of it so they get displayed. #}
  {% for field in upload_form %}
    <div>{{ field.errors }}</div>
  {% endfor %}
  {% endif %}
</div>
{% endif %}

{{ block.super }}
{% endblock %}


{% block scripts_extra %}
{{ block.super }}

{% if upload_form %}
<script type="text/javascript">
$(function () {
  document.getElementById("js-open-upload-dialog").onclick = function () {
    // Open the file browser dialog to select a file to upload.
    document.getElementById("js-file-upload-input").click();
    // Prevent visiting URL.
    return false;
  };

  document.getElementById("js-file-upload-input").onchange = function () {
    var filename = this.value.replace("C:\\fakepath\\", "");

    // Submit form only if there is some actual value on the file input.
    if (filename.length !== 0) {
      document.getElementById("js-upload-form").submit();
    }
  };
});
</script>
{% endif %}
{% endblock %}