{% extends "base_bootstrap.html.twig" %}

{% block head %}
{{ parent() }}

<script src="/js/clipboard.min.js"></script>
<script src="/js/invites.js"></script>
{% endblock %}

{% block content %}
    <div class="container">
        <div class="row">
            <h2 id="certificates">Invites <small>You used {{ used_invites }} from your {{ max_invites == -1 ? 'infinite' : max_invites }} invites</small></h2>
        </div>
        {% if error %}
            <div class="row">
                <div class="alert alert-warning" role="alert">
                    {{ error }}
                </div>
            </div>
        {% endif %}
        <div class="row">
            <table class="table">
                <thead>
                    <tr>
                        <th>Invite</th>
                        <th>
                            {% if max_invites > used_invites or max_invites == -1 %}
                            <form action="/panel/invites/create" method="post">
                                <button class="btn btn-default pull-right" type="submit">Create new invite</button>
                            </form>
                            {% endif %}
                        </th>
                    </tr>
                </thead>
                <tbody>
                    {% for invite in invites %}
                        <tr>
                            <td>
                                <kbd>{{ invite.getInvite() }}</kbd>
                            </td>
                            <td>
                                <button class="btn btn-default copy pull-right" data-clipboard-text="{{ invite.getInvite() }}">Copy</button>
                            </td>
                        </tr>
                    {% else %}
                        <tr>
                            <td colspan="2">You don't have any invites :(</td>
                        </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
{% endblock %}