{% macro renderPager(search, groupId, pager, max, order) %}
    {% if search == '' %}
    {{
        pagerfanta(
            pager,
            'twitter_bootstrap_translated',
            {
                'proximity' : 1,
                'routeName': 'claro_admin_user_of_group_list',
                'routeParams': {'groupId': groupId, 'max': max, 'order': order}
            }
        )
    }}
    {% else %}
        {{
            pagerfanta(
                pager,
                'twitter_bootstrap_translated',
                {
                    'proximity' : 1,
                    'routeName': 'claro_admin_user_of_group_list_search',
                    'routeParams': {'search': search, 'groupId': groupId, 'max': max, 'order': order}
                }
            )
        }}
    {% endif %}
{% endmacro %}

{% macro sortUrl(max, search, groupId, order) %}
    {% if search == '' %}
        {{ path('claro_admin_user_of_group_list',{'groupId': groupId, 'max': max, 'order': order}) }}
    {% else %}
        {{ path('claro_admin_user_of_group_list_search', {'search': search, 'groupId': groupId, 'max': max, 'order': order}) }}
    {% endif %}
{% endmacro %}

{% macro displayControls(group, addSearch, searchString) %}
    {% if app.user %}
        <div class="row">
            <div class="col-xs-9">
                <div class="btn-group">
                    <a class="btn btn-default"
                       href="{{ path('claro_admin_outside_of_group_user_list', {'groupId' : group.getId()}) }}">
                        <i class="fa fa-plus"></i> {{ 'add_user'|trans({}, 'platform') }}
                    </a>
                    <a class="btn btn-default"
                       id="link-send-message" href="{{ path('claro_message_form_for_group', {'group': group.getId()}) }}">
                        <i class="fa fa-envelope"></i> {{ 'send_message'|trans({}, 'platform') }}
                    </a>
                    <button class="btn btn-default action-button table-control"
                            data-action="remove"
                            disabled>
                        <i class="fa fa-trash-o"></i> {{ 'delete'|trans({}, 'platform') }}
                    </button>
                    <a class="btn btn-default"
                       id="import-users-into-group"
                       href="{{ path('claro_admin_import_users_into_group_form', {'groupId': group.getId()}) }}">
                        <i class="fa fa-user"></i> {{ 'import_users'|trans({}, 'platform') }}
                    </a>
                </div>
            </div>
            {% if addSearch %}
                <div class="col-xs-3">
                    <div class="input-group">
                        <input class="form-control input-md" id="search-items-txt" value="{{ searchString }}"/>
                        <span id="search-button"
                              class="filter input-group-addon btn btn-default">
                            <i class="fa fa-search"></i>
                        </span>
                    </div>
                </div>
            {% endif %}
        </div>
    {% endif %}
{% endmacro %}

{% from _self import renderPager %}
{% from _self import displayControls %}
{% from _self import sortUrl %}
{% from "ClarolineCoreBundle::macros.html.twig" import maxResultsSelectBox %}

{% extends "ClarolineCoreBundle:Administration:layout.html.twig" %}

{% block breadcrumb %}
    {{
        macros.breadcrumbs([
            {
                'icon': 'fa fa-cog',
                'name': 'administration'|trans({}, 'platform'),
                'href': path('claro_admin_index')
            },
            {
                'name': 'users_management'|trans({}, 'platform'),
                'href': path('claro_admin_users_management')
            },
            {
                'name': 'groups'|trans({}, 'platform'),
                'href': path('claro_admin_group_list')
            },
            {
                'name':  group.getName(),
                'href': ''
            }
        ])
    }}
{% endblock %}
{% block section_content %}
    <div class="panel-heading">
        <h3 class="panel-title">{{ 'groups_list'|trans({}, 'platform') }} ({{ group.getName() }})</h3>
    </div>
    <div class="panel-body">
        <div>
            {{ macros.flashBox() }}
        </div>
        <div>
            {{ displayControls(group, true, search) }}
        </div>
        <div class="row">
            <div class="col-md-8">
                {{ renderPager(search, group.getId(), pager, max, order) }}
            </div>
            <div class="col-md-4">
                {{ maxResultsSelectBox(max, "$('#search-button').trigger('click');") }}
            </div>
        </div>

        <div class="table-responsive">
            <table class="table table-striped table-bordered table-condensed">
                <thead>
                    <tr>
                        <th> <input type="checkbox" name="all" id="check-all-items"></input> </th>
                        <th><a href="{{ sortUrl(max, search, group.getId(),  'username') }}">{{ 'username'|trans({}, 'platform') }}</a></th>
                        <th><a href="{{ sortUrl(max, search, group.getId(),  'lastName') }}">{{ 'last_name'|trans({}, 'platform') }}</a></th>
                        <th><a href="{{ sortUrl(max, search, group.getId(),  'firstName') }}">{{ 'first_name'|trans({}, 'platform') }}</a></th>
                        <th><a href="{{ sortUrl(max, search, group.getId(),  'mail') }}">{{ 'mail'|trans({}, 'platform') }}</a></th>
                    </tr>
                </thead>
                <tbody id="user-table-body">
                    {% for user in pager.currentPageResults %}
                        <tr id="row-user-{{ user.getId() }}" class="row-user">
                            <td>
                                <input type="checkbox" value="{{ user.id }}" class="chk-item" align="center"></input>
                            </td>
                            <td>{{ user.getUsername() }}</td>
                            <td>{{ user.getLastName() }}</td>
                            <td>{{ user.getFirstName() }}</td>
                            <td>{{ user.getMail() }}</td>
                        </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
        {{ renderPager(search, group.getId(), pager, max, order) }}
        <div>
            {{ displayControls(group) }}
        </div>
    </div>
{% endblock %}
{% block javascripts %}
    {{ parent() }}
    <script src='{{ asset('bundles/clarolinecore/js/table.js') }}' type="text/javascript"></script>
    <script>
        parameters = {};
        parameters.route = {};
        parameters.route.action = {};
        parameters.route.normal = {"route": "claro_admin_user_of_group_list", "parameters": {'groupId': {{ group.getId() }}, 'order': '{{ order }}' }};
        parameters.route.search = {"route": "claro_admin_user_of_group_list_search", "parameters": {'groupId': {{ group.getId() }}, 'order': '{{ order }}'}};
        parameters.route.action.remove = {"route": "claro_admin_multidelete_user_from_group", "parameters": {'groupId': {{ group.getId() }}}, "type": "DELETE", "confirmTemplate": removeUserConfirm, "delete": true};
        Claroline.Table.initialize(parameters);
    </script>
{% endblock %}
