{% extends "base.html" %}

{% load i18n %}

{% block content %}
    {% if user.is_authenticated %}
        <div class="form-check">
            <label for="owned_only" class="form-check-label">
                <input id="owned_only" name="owned_only" type="checkbox" class="checkboxinput form-check-input">
                {% trans "Filter with roles that I have in at least one club" %}
            </label>
        </div>
    {% endif %}
    <ul>
    {% regroup active_memberships by roles as memberships_per_role %}
    {% for role in roles %}
        <li class="{% if not role.clubs %}no-club{% endif %}">
            {{ role }} {% if role.weirole %}(<em>Pour le WEI</em>){% endif %}
            {% if role.clubs %}
                <div class="alert alert-success">
                    {% trans "Own this role in the clubs" %} {{ role.clubs|join:", " }}
                </div>
            {% endif %}
            <ul>
            {% for permission in role.permissions.permissions.all %}
                <li data-toggle="tooltip" title="{% trans "Query:" %} {{ permission.query }}">{{ permission }} ({{ permission.type }} {{ permission.model }}{% if permission.permanent %}, {% trans "permanent" %}{% endif %})</li>
            {% empty %}
                <em>{% trans "No associated permission" %}</em>
            {% endfor %}
            </ul>
        </li>
    {% endfor %}
    </ul>
{% endblock %}

{% block extrajavascript %}
    <script>
    $(document).ready(function() {
       let checkbox = $("#owned_only");

       function update() {
           if (checkbox.is(":checked"))
               $(".no-club").addClass('d-none');
           else
               $(".no-club").removeClass('d-none');
       }

       checkbox.change(update);
       update();
    });
    </script>
{% endblock %}