{% load i18n %}

<div class="panel panel-default">
  <div class="panel-heading">
    <span class="btn btn-default btn-xs infobtn pull-right store-action-button" 
      title="{% trans "A list of your most recent files." %}"
      data-container="body">
      <i class="fa fa-info-circle"></i>
    </span>
    <span class="btn btn-default btn-xs pull-right" data-container="body"
      title="
      {% blocktrans with used=files.quota.readable_used soft=files.quota.readable_soft hard=files.quota.readable_hard %}
      You are currently using {{ used }}, your soft limit is {{ soft }}, your hard limit is {{ hard }}.
      {% endblocktrans %}">
      <i class="fa fa-adjust"></i>
    </span>
    <h3 class="no-margin"><i class="fa fa-briefcase"></i> {% trans "Files" %}
    </h3>
  </div>
  <div class="list-group">
    <div id="dashboard-files-toplist">
    {% for t in files.toplist %}
    {% if t.TYPE == "F" %}
      <div class="list-group-item
        {% if forloop.last and files.toplist|length < 5 %}list-group-item-last{% endif %}">
        <i class="fa fa-{{ t.icon }} dashboard-toplist-icon"></i> 
        <div class="store-list-item-name">
          {{ t.NAME }}
        </div>
        <a href="{% url "dashboard.views.store-download" %}?path={{ t.path }}" 
          class="pull-right btn btn-xs" style="color: black;">
          <i class="fa fa-cloud-download" title="{% trans "Download" %}"></i>
        </a>
        <a href="{% url "dashboard.views.store-list" %}?directory={{ t.directory }}" 
          class="pull-right btn btn-xs" style="color: black;">
          <i class="fa fa-folder-open" title="{% trans "Show in directory" %}"></i>
        </a>
        <div style="clear: both;"></div> 
      </div>
    {% else %}
    <a href="{% url "dashboard.views.store-list" %}?directory={{ t.path }}" 
      class="list-group-item
      {% if forloop.last and files.toplist|length < 5 %}list-group-item-last{% endif %}">
      <i class="fa fa-{{ t.icon }} dashboard-toplist-icon"></i>
      <div class="store-list-item-name">
        {{ t.NAME }}
      </div>
      <div style="clear: both;"></div>
    </a>
    {% endif %}
    {% empty %}
      <div class="list-group-item list-group-item-last no-hover">
        {% trans "Your toplist is empty, upload something." %}
      </div>
    {% endfor %}
    </div>
    <div class="list-group-item list-group-footer">
      <div class="text-right">
        <form class="pull-left" method="POST" action="{% url "dashboard.views.store-refresh-toplist" %}">
          {% csrf_token %}
          <button class="btn btn-success btn-xs" type="submit" title="{% trans "Refresh" %}">
            <i class="fa fa-refresh"></i>
          </button>
        </form>
        <a href="{% url "dashboard.views.store-list" %}" class="btn btn-primary btn-xs">
          <i class="fa fa-chevron-circle-right"></i> {% trans "show my files" %}
        </a>
        <a href="{% url "dashboard.views.store-upload" %}" class="btn btn-success btn-xs">
          <i class="fa fa-cloud-upload"></i> {% trans "upload" %}
        </a>
      </div>
    </div>
  </div>
</div>
