{% macro sortUrl(workspaceId, orderedBy, order) %}
    {% if order == 'ASC' %}
        {% set newOrder = 'DESC' %}
    {% else %}
        {% set newOrder = 'ASC' %}
    {% endif %}

    {{ path('claro_team_user_menu', {'workspace': workspaceId, 'orderedBy': orderedBy, 'order': newOrder }) }}
{% endmacro %}

{% from _self import sortUrl %}

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

{% block title %}
    {{ parent() ~ ' - ' ~ "claroline_team_tool" | trans({}, "tools") | striptags | raw }}
{% endblock %}

{% block breadcrumb %}
    {{
        macros.workspaceBreadcrumbs(
            workspace,
            [
                {
                    'name': 'claroline_team_tool'|trans({}, 'tools'),
                    'href': ''
                }
            ]
        )
    }}
{% endblock %}

{% block section_content %}
    <div class="panel-heading">
        <h3 class="panel-title">{{ 'claroline_team_tool'|trans({}, 'tools') }}</h3>
    </div>

    <div class="panel-body">
        <h3>{{ 'my_teams'|trans({}, 'team') }}</h3>

        {% set maxTeamsReached = (params.getMaxTeams() is not empty) and (nbTeams >= params.getMaxTeams()) %}

        {% if maxTeamsReached %}
            <div class="alert alert-info">
                {{ 'max_teams_limit_reached'|trans({}, 'team') }}
            </div>
        {% else %}
            <br>
        {% endif %}

        {% if userTeams|length > 0 %}
            <div id="teams-list" class="table-responsive">
                <table class="table">
                    <tr>
                        <th>
                            {{ 'name'|trans({}, 'platform') }}
                        </th>
                        <th class="text-center">
                            {{ 'description'|trans({}, 'platform') }}
                        </th>
                        <th class="text-center">
                            {{ 'users'|trans({}, 'platform') }}
                        </th>
                        <th class="text-center">
                            <span data-toggle="tooltip"
                                  data-placement="top"
                                  title="{{ 'maximum_informations'|trans({}, 'team') }}"
                            >
                                {{ 'maximum'|trans({}, 'team') }}
                            </span>
                        </th>
                        <th class="text-center">
                            {{ 'actions'|trans({}, 'platform') }}
                        </th>
                    </tr>

                    {% for userTeam in userTeams %}
                        <tr id="row-team-{{ userTeam.getId() }}">
                            <td>
                                <a href="{{ path('claro_team_user_team_index', {'team': userTeam.getId()}) }}">
                                    {{ userTeam.getName() }}
                                </a>
                            </td>
                            <td class="text-center">
                                {% if userTeam.description() is not empty %}
                                    <i class="fa fa-eye view-team-description-btn pointer-hand"
                                       data-team-id="{{ userTeam.getId() }}"
                                       data-team-name="{{ userTeam.getName() }}"
                                    >
                                    </i>
                                {% else %}
                                    -
                                {% endif %}
                            </td>
                            <td class="text-center">
                                <span class="pointer-hand view-users-list-btn"
                                      data-team-id="{{ userTeam.getId() }}"
                                      data-team-name="{{ userTeam.getName() }}"
                                      id="nb-users-{{ userTeam.getId() }}"
                                >
                                    {% if nbUsers[userTeam.getId()] is defined %}
                                        {{ nbUsers[userTeam.getId()] }}
                                    {% else %}
                                        0
                                    {% endif %}
                                </span>
                            </td>
                            <td class="text-center">
                                {% if userTeam.getMaxUsers() is not empty %}
                                    {{ userTeam.getMaxUsers() }}
                                {% else %}
                                    -
                                {% endif %}
                            </td>
                            <td class="text-center">

                                {% if userTeam.getDirectory() is not empty %}
                                    <span class="btn btn-default btn-sm team-directory-btn"
                                          data-workspace-id="{{ workspace.getId() }}"
                                          data-node-id="{{ userTeam.getDirectory().getResourceNode().getId() }}"
                                          data-toggle="tooltip"
                                          data-placement="top"
                                          title="{{ 'go_to_team_directory'|trans({}, 'team') }}"
                                    >
                                        <i class="fa fa-folder-open"></i>
                                    </span>
                                {% endif %}

                                {% if userTeam.getSelfUnregistration() %}
                                    <span class="btn btn-danger btn-sm unregister-btn"
                                          data-team-id="{{ userTeam.getId() }}"
                                          data-team-name="{{ userTeam.getName() }}"
                                          data-toggle="tooltip"
                                          data-placement="top"
                                          title="{{ 'unregister_from_team'|trans({}, 'team') }}"
                                    >
                                        <i class="fa fa-sign-out"></i>
                                    </span>
                                {% endif %}
                            </td>
                        </tr>
                    {% endfor %}
                </table>
            </div>
        {% else %}
            <div class="alert alert-warning">
                {{ 'no_team'|trans({}, 'team') }}
            </div>
        {% endif %}
        <hr>
        <h3>{{ 'all_other_teams'|trans({}, 'team') }}</h3>
        <br>

        {% if teams|length > 0 %}
            <div id="teams-list" class="table-responsive">
                <table class="table">
                    <tr>
                        <th>
                            <a href="{{ sortUrl(workspace.getId(), 'name', order) }}">
                                {{ 'name'|trans({}, 'platform') }}
                            </a>
                        </th>
                        <th class="text-center">
                            {{ 'description'|trans({}, 'platform') }}
                        </th>
                        <th class="text-center">
                            {{ 'users'|trans({}, 'platform') }}
                        </th>
                        <th class="text-center">
                            <a href="{{ sortUrl(workspace.getId(), 'maxUsers', order) }}"
                               data-toggle="tooltip"
                               data-placement="top"
                               title="{{ 'maximum_informations'|trans({}, 'team') }}"
                            >
                                {{ 'maximum'|trans({}, 'team') }}
                            </a>
                        </th>
                        <th class="text-center">
                            {{ 'self_register'|trans({}, 'team') }}
                        </th>
                    </tr>

                    {% for team in teams %}
                        <tr id="row-team-{{ team.getId() }}">
                            <td>
                                {{ team.getName() }}
                            </td>
                            <td class="text-center">
                                {% if team.description() is not empty %}
                                    <i class="fa fa-eye view-team-description-btn pointer-hand"
                                       data-team-id="{{ team.getId() }}"
                                       data-team-name="{{ team.getName() }}"
                                    >
                                    </i>
                                {% else %}
                                    -
                                {% endif %}
                            </td>
                            <td class="text-center">
                                <span class="pointer-hand view-users-list-btn"
                                      data-team-id="{{ team.getId() }}"
                                      data-team-name="{{ team.getName() }}"
                                      id="nb-users-{{ team.getId() }}"
                                >
                                    {% if nbUsers[team.getId()] is defined %}
                                        {{ nbUsers[team.getId()] }}
                                    {% else %}
                                        0
                                    {% endif %}
                                </span>
                            </td>
                            <td class="text-center">
                                {% if team.getMaxUsers() is not empty %}
                                    {{ team.getMaxUsers() }}
                                {% else %}
                                    -
                                {% endif %}
                            </td>
                            <td class="text-center">

                                {% if team.getSelfRegistration() %}
                                    <span class="btn btn-success btn-sm register-btn"
                                          data-team-id="{{ team.getId() }}"
                                          data-team-name="{{ team.getName() }}"
                                          {% if maxTeamsReached %}disabled{% endif %}
                                    >
                                        <i class="fa fa-sign-in"></i>
                                    </span>
                                {% else %}
                                    -
                                {% endif %}
                            </td>
                        </tr>
                    {% endfor %}
                </table>
            </div>
        {% else %}
            <div class="alert alert-warning">
                {{ 'no_team'|trans({}, 'team') }}
            </div>
        {% endif %}
    </div>

    <div id="view-registered-users-box" class="modal fade" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <h3 id="view-registered-users-header" class="modal-header">
                </h3>
                <div id="view-registered-users-body" class="modal-body">
                </div>
                <div class="modal-footer">
                    <button type="button"
                           class="btn btn-default"
                           data-dismiss="modal"
                    >{{ 'close'|trans({}, 'platform') }}</button>
                </div>
            </div>
        </div>
    </div>

    <div id="view-team-description-box" class="modal fade" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <h3 id="view-team-description-header" class="modal-header">
                </h3>
                <div id="view-team-description-body" class="modal-body">
                </div>
                <div class="modal-footer">
                    <button type="button"
                           class="btn btn-default"
                           data-dismiss="modal"
                    >{{ 'close'|trans({}, 'platform') }}</button>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script type="text/javascript"
            src="{{ url('bazinga_jstranslation_js', { 'domain': 'team' }) }}"
    >
    </script>
    <script src='{{ asset('bundles/clarolineteam/js/userMenu.js') }}'
            type="text/javascript"
    >
    </script>
{% endblock %}