{% extends 'base.html' %}

{% block app_content %}
<h1>Hi, {{ current_user.name }}!</h1>

<h2>My games:</h2>
{% if current_user.games %}
<div class="table-responsive">
    <table class="table">
        <thead>
            <tr>
                <th scope="col">Game Name</th>
                <th scope="col">Current State</th>
                <th scope="col">Start Time</th>
                <th scope="col">End Time</th>
                <th scope="col">My Role</th>
            </tr>
        </thead>
        <tbody>
            {% for game in current_user.games %}
            <tr>
                <td><a href="{{ url_for('main.game_dashboard', game_name = game.name) }}">{{ game.name }}</a></td>
                <td>{{ game.state.name}}</td>
                <td>{{ game.start_time }}</td>
                <td>{{ game.end_time }}</td>
                <td>
                    {% for gameplayer in current_user.user_games if gameplayer.game == game %}
                        {{ gameplayer.role.name }}
                    {% endfor %}
                </td>
            </tr>
            {% endfor %}
        </tbody>
    </table>
</div>
{% else %}
<div class="alert alert-info" role="alert">
    You don't participate in any game yet 😢
</div>
{% endif %}
{% endblock %}