{% extends "AuthorsBundle::layout.html.twig" %}

{% block page_title %}{{ 'Authors'|trans }}{% endblock %}

{% block title %}
<h1 class="title">{{ 'Authors'|trans }}</h1>
{% endblock %}

{% block main_content %}
<style>
.letters { display:inline-block; margin-top:10px; }
.letters li { padding:5px; font-weight:bold; }
.letters li.current { background:#555;  }
.letters li.current a { color:#fff; }
</style>
{% if not app.request.xmlHttpRequest %}
<div class="list-wpr">
  <label for="authors-country">{{ 'commons.titles.country'|trans }}</label>
  <select id="authors-country">
    <option value="">{{ 'commons.titles.all'|trans }}</option>
    {% for country in countries %}
    <option value="{{ country.id }}" {{ app.request.query.get('country') == country.id ? 'selected' : '' }}>{{ country.name }} ({{ country.authorsCount }})</option>
    {% endfor %}
  </select>
  <br>
  <label for="authors-view">{{ 'commons.titles.sort'|trans }}</label>
  <select id="authors-view">
    <option value="name" {{ app.request.query.get('view') == 'name' ? 'selected' : '' }}>{{ 'content_management.sort.alphabetically'|trans }}</option>
    <option value="popularity" {{ app.request.query.get('view', 'popularity') == 'popularity' ? 'selected' : '' }}>{{ 'content_management.sort.popularity'|trans }}</option>
    <option value="views" {{ app.request.query.get('view') == 'views' ? 'selected' : '' }}>{{ 'content_management.sort.views_count'|trans }}</option>
  </select>
  
  <div class="text-center">
    <ul class="letters list-inline">
      {% for letter in letters %}
      <li{{ app.request.query.get('letter') == letter ? ' class="current"' : '' }}><a href="{{ path('authors', { 'letter': letter }) }}">{{ letter }}</a></li>
      {% endfor %}
    </ul>
  </div>
{% endif %}
  <a id="page-{{ page }}" class="page-anchor"></a>
  {% for author in authors %}
    <div>
      <h3><a href="{{ path('author', { 'id': author.id }) }}">{{ author.name }}</a></h3>
      <ul>
        {% if author.Country %}
        <li>{{ 'commons.titles.country'|trans }}: {{ author.Country.name }}</li>
        {% endif %}
        <li>{{ 'Views Count'|trans }}: {{ author.viewsCount }}</li>
      </ul>
    </div>
  {% endfor %}
  {% if not isLastPage %}
  <div id="pager-wpr">
    <a id="load-more" href="{{ path(app.request.attributes.get('_route'), app.request.attributes.get('_route_params')|merge(app.request.query.all)|merge({ 'page': page + 1 })) }}">{{ 'Show more'|trans }}</a>
  </div>
  {% endif %}
{% if not app.request.xmlHttpRequest %}
</div>
{% endif %}
{% endblock %}

{% block js_document_ready %}
{{ parent() }}
setupUnlimitedScroll();

parseUrlParams();

$('#authors-country').change(function() {
  window.urlParams['country'] = $(this).val();
  window.location.href = window.location.pathname + '?' + $.param(window.urlParams);
});

$('#authors-view').change(function() {
  window.urlParams['view'] = $(this).val();
  window.location.href = window.location.pathname + '?' + $.param(window.urlParams);
});
{% endblock %}