{% extends "layout.html" %}
{% block title %}{% block admin_title %}Index{% endblock %} - Administration{% endblock %}

{% block content %}
    <div class="mdl-cell mdl-cell--6-col mdl-cell--8-col-tablet mdl-cell--4-col-phone mdl-grid mdl-grid--no-spacing">
        <table class="mdl-data-table mdl-js-table mdl-shadow--2dp sortable mdl-cell mdl-cell--12-col mdl-cell--8-col-tablet mdl-cell--4-col-phone">
            <thead>
                <tr>
                    <th class="mdl-data-table__cell--non-numeric">Full Name</th>
                    <th class="mdl-data-table__cell--non-numeric">Username</th>
                    <th class="mdl-data-table__cell--non-numeric">Roles</th>
                </tr>
            </thead>
            <tbody>
            {% for user in users %}
                <tr>
                    <td class="mdl-data-table__cell--non-numeric"><a href="{{ url_for(".user_edit", id=user.id) }}">{{ user.fullname }}</a></td>
                    <td class="mdl-data-table__cell--non-numeric">{{ user.username }}</td>
                    <td class="mdl-data-table__cell--non-numeric">{% if user.roles is not none %}{{ ", ".join(user.roles) }}{% endif %}</td>
                </tr>
            {% endfor %}
            </tbody>
        </table>
        <div class="mdl-cell mdl-cell--3-col mdl-cell--3-col-tablet mdl-cell--2-col-phone">
            <a class="mdl-button mdl-button--colored mdl-js-button" href="{{ url_for(".user") }}">
                All users
            </a>
        </div>
    </div>
    <div class="mdl-cell mdl-cell--6-col mdl-cell--8-col-tablet mdl-cell--4-col-phone mdl-grid mdl-grid--no-spacing">
        <table class="mdl-data-table mdl-js-table mdl-shadow--2dp sortable mdl-cell mdl-cell--12-col mdl-cell--8-col-tablet mdl-cell--4-col-phone">
            <thead>
                <tr>
                    <th class="mdl-data-table__cell--non-numeric">Name</th>
                    <th class="mdl-data-table__cell--non-numeric">Mode</th>
                </tr>
            </thead>
            <tbody>
            {% for topic in events %}
                <tr>
                    <td class="mdl-data-table__cell--non-numeric"><a href="{{ url_for(".topic_edit", id=event.id) }}">{{ event.name }}</a></td>
                    <td class="mdl-data-table__cell--non-numeric">{{ topic.mode }}</td>
                </tr>
            {% endfor %}
            </tbody>
        </table>
        <div class="mdl-cell mdl-cell--3-col mdl-cell--3-col-tablet mdl-cell--2-col-phone">
            <a class="mdl-button mdl-button--colored mdl-js-button" href="{{ url_for(".topic") }}">
                All topics
            </a>
        </div>
    </div>

{% endblock %}