{% extends "layout.html" %}
{% block body %}
<h1 class="{{page}}">{{_(title)}}</h1>
  <div class="container">
    <div class="filterheader hidden-xs hidden-sm">
      <button id="desc" class="btn btn-success"><span class="glyphicon glyphicon-sort-by-alphabet"></span></button>
      <button id="asc" class="btn btn-success"><span class="glyphicon glyphicon-sort-by-alphabet-alt"></span></button>
      <button id="all" class="btn btn-success">{{_('All')}}</button>
      <div class="btn-group character" role="group">
        {% for char in charlist%}
        <button class="btn btn-success char">{{char.char}}</button>
        {% endfor %}
      </div>
    </div>
    <div id="list" class="col-xs-12 col-sm-6">
    {% for entry in entries %}
      <div class="row" data-id="{% if entry[0].sort %}{{entry[0].sort}}{% else %}{{entry[0].name}}{% endif %}">
        <div class="col-xs-2 col-sm-2 col-md-1" align="left"><span class="badge">{{entry.count}}</span></div>
        <div class="col-xs-10 col-sm-10 col-md-11"><a id="list_{{loop.index0}}" href="{{url_for(folder, book_id=entry[0].id )}}">{{entry[0].name}}</a></div>
      </div>
    {% endfor %}
    </div>
  </div>
{% endblock %}
{% block js %}
<script src="{{ url_for('static', filename='js/filter_list.js') }}"></script>
{% endblock %}