{% extends 'Application/' ~ settings.get("theme") ~'/base.html.twig' %}

{% block title %}{{ 'Ranking poziomów'|trans }}{% endblock %}

{% block body %}
<h1>{{ 'Ranking poziomów'|trans }}</h1>
<ul id="breadcrump">
    <li>
        <a href="{{ path('home') }}">{{ 'Strona główna'|trans }}</a>
    </li>
    <li>{{ 'Ranking poziomów'|trans }}</li>
</ul>

<div id="middle" class="p-0">
    {% if players is defined and players >= 1 %}
    <div class="table-responsive">
        <table class="table table-hover text-center" data-toggle="table" data-search="true" data-pagination="true"
            data-page-size="100" data-smart-display="false" data-mobile-responsive="true">
            <thead class="text-center bg-table">
                <tr class="text-center">
                    <th width="50px" class="text-center">#</th>
                    <th class="text-center">{{ 'Nazwa'|trans }}</th>
                    <th class="text-center">{{ 'Poziom'|trans }}</th>
                    <th class="text-center">{{ 'PD'|trans }}</th>
                </tr>
            </thead>
            <tbody>
                {% for player in players %}
                <tr>
                    <td class="text-center">
                        <span class="rang">{{ loop.index }}</span>
                    </td>
                    <td>{{ player.name }}</td>
                    <td class="c">{{ player.level }}</td>
                    <td class="r">
                        {% if player.level == settings.get("max_level") %}
                        <strong>{{'Maksymalny poziom osiągnięty!'|trans}}</strong>
                        {% else %}
                        <b>{{ player.exp }}/{{player.expNext }}</b>
                        {% endif %}
                    </td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>

    {% else %}
    <div class="p-3">
        <div class="alert alert-info text-dark shadow">
           {{"Serwer jest offline, ranking jest tymczasowo wyłączony."|trans}}
        </div>
    </div>
    {% endif %}

    {% if cacheDate is defined %}
    <p class="p-3">
       {{"Ostatnia aktualizacja rankingu"|trans}} :
        {{cacheDate|date('d/m/Y o H:i:s')}}
    </p>
    {% endif %}

</div>
{% endblock %}

{% block javascripts %}
<script src="https://unpkg.com/bootstrap-table@1.18.3/dist/bootstrap-table.min.js" defer></script>
<script src="https://unpkg.com/bootstrap-table@1.18.3/dist/extensions/mobile/bootstrap-table-mobile.min.js"
    defer></script>
<script defer>
    const local = "{{ app.request.getLocale() }}";
</script>
<script src="{{asset('assets/themes/' ~ settings.get("theme") ~ '/js/table.min.js')}}" defer></script>
{% endblock %}