{% extends "pages/abstract/dashboard.html.twig" %}

{% block stylesheets_page %}
    <!-- Page-specific CSS asset bundle -->
    {{ assets.css('css/form-widgets') | raw }}
{% endblock %}

{# Overrides blocks in head of base template #}
{% block page_title %}{{ translate("USER", 2) }} | {{ user.full_name }}{% endblock %}

{% block page_description %}{{ translate("USER.INFO_PAGE", {name: user.user_name}) }}{% endblock %}

{% block body_matter %}
    {% block group_box %}
    {% endblock %}
    <div class="row">
        <div class="col-lg-4">
            <div id="view-user">
                {% block user_box %}
                    <div class="box box-primary">
                        <div class="box-header with-border">
                            <h3 class="box-title">{{ translate('USER.SUMMARY') }}</h3>
                            {% if 'tools' not in tools.hidden %}
                                <div class="box-tools pull-right">
                                    <div class="btn-group">
                                        <button type="button" class="btn btn-sm dropdown-toggle" data-toggle="dropdown"
                                                aria-haspopup="true" aria-expanded="false">
                                            <i class="fa fa-gear"></i>
                                            <span class="caret"></span>
                                        </button>
                                        <ul class="dropdown-menu box-tool-menu">
                                            {% block tools %}
                                                <li>
                                                    <a href="#" class="js-user-edit"
                                                       data-user_name="{{ user.user_name }}">
                                                        <i class="fa fa-edit fa-fw"></i> {{ translate('EDIT') }}
                                                    </a>
                                                </li>
                                                {% if 'password' not in tools.hidden %}
                                                    <li>
                                                        <a href="#" class="js-user-password"
                                                           data-user_name="{{ user.user_name }}">
                                                            <i class="fa fa-lock fa-fw"></i> {{ translate('PASSWORD') }}
                                                        </a>
                                                    </li>
                                                {% endif %}
                                                {% if 'roles' not in tools.hidden %}
                                                    <li>
                                                        <a href="#" class="js-user-roles"
                                                           data-user_name="{{ user.user_name }}">
                                                            <i class="fa fa-drivers-license fa-fw"></i> {{ translate('ROLE', 2) }}
                                                        </a>
                                                    </li>
                                                {% endif %}
                                                {% if 'activate' not in tools.hidden and user.flag_verified == "0" %}
                                                    <li>
                                                        <a href="#" class="js-user-activate"
                                                           data-user_name="{{ user.user_name }}">
                                                            <i class="fa fa-bolt fa-fw"></i> {{ translate('ACTIVATE') }}
                                                        </a>
                                                    </li>
                                                {% endif %}
                                                {% if 'enable' not in tools.hidden %}
                                                    {% if user.flag_enabled == "1" %}
                                                        <li>
                                                            <a href="#" class="js-user-disable"
                                                               data-user_name="{{ user.user_name }}">
                                                                <i class="fa fa-minus-circle fa-fw"></i> {{ translate('DISABLE') }}
                                                            </a>
                                                        </li>
                                                    {% else %}
                                                        <li>
                                                            <a href="#" class="js-user-enable"
                                                               data-user_name="{{ user.user_name }}">
                                                                <i class="fa fa-plus-circle fa-fw"></i> {{ translate('ENABLE') }}
                                                            </a>
                                                        </li>
                                                    {% endif %}
                                                {% endif %}
                                                {% if 'delete' not in tools.hidden %}
                                                    <li>
                                                        <a href="#" class="js-user-delete"
                                                           data-user_name="{{ user.user_name }}">
                                                            <i class="fa fa-trash-o fa-fw"></i> {{ translate('DELETE') }}
                                                        </a>
                                                    </li>
                                                {% endif %}
                                            {% endblock %}
                                        </ul>
                                    </div>
                                </div>
                            {% endif %}
                        </div>
                        <div class="box-body box-profile">
                            <img class="profile-user-img img-responsive img-circle" src="{{ user.avatar }}"
                                 alt="{{ user.user_name }}">

                            <h3 class="profile-username text-center">{{ user.full_name }}</h3>
                            <div class="text-center">
                                {% if user.flag_enabled == 0 %}
                                    <i class="fa fa-fw fa-minus-circle fa-lg text-red"
                                       title="{{ translate('DISABLED') }}"></i>
                                {% endif %}
                                {% if user.flag_verified == 0 %}
                                    <i class="fa fa-fw fa-bolt fa-lg text-yellow"
                                       title="{{ translate('UNACTIVATED') }}"></i>
                                {% endif %}
                            </div>
                            <h4 class="text-muted text-center">{{ user.user_name }}{% if 'group' not in fields.hidden %} • {{ user.group.name }}{% endif %}</h4>

                            {% if 'email' not in fields.hidden %}
                                <hr>
                                <strong><i class="fa fa-envelope margin-r-5"></i> {{ translate("EMAIL") }}</strong>
                                <p class="text-muted box-profile-property js-copy-container">
                                    <i class="fa fa-copy uf-copy-trigger js-copy-trigger"></i>
                                    <span class="js-copy-target">{{ user.email }}</span>
                                </p>
                            {% endif %}

                            {% if 'locale' not in fields.hidden %}
                                <hr>
                                <strong><i class="fa fa-language margin-r-5"></i> {{ translate("LOCALE") }}</strong>
                                <p class="text-muted box-profile-property">
                                    {{ locales[user.locale] }}
                                </p>
                            {% endif %}

                            {% block user_profile %}{% endblock %}

                            {% if 'roles' not in fields.hidden %}
                                <hr>
                                <strong><i class="fa fa-drivers-license margin-r-5"></i> {{ translate("ROLE", 2) }}
                                </strong>
                                <p class="box-profile-property">
                                    {% for role in user.roles %}
                                        <span class="label label-primary"
                                              title="{{ role.description }}">{{ role.name }}</span>
                                    {% endfor %}
                                </p>
                            {% endif %}
                        </div>
                    </div>
                {% endblock %}
            </div>
        </div>
        {% if 'activities' not in widgets.hidden %}
            <div class="col-lg-8">
                {% block activity_box %}
                    <div id="widget-user-activities" class="box box-primary">
                        <div class="box-header">
                            <h3 class="box-title"><i class="fa fa-fw fa-tasks"></i> {{ translate('ACTIVITY', 2) }}</h3>
                            {% include "tables/table-tool-menu.html.twig" %}
                        </div>
                        <div class="box-body">
                            {% include "tables/activities.html.twig" with {
                                "table" : {
                                    "id" : "table-user-activities"
                                }
                            } %}
                        </div>
                    </div>
                {% endblock %}
            </div>
        {% endif %}
    </div>
    {% if 'permissions' not in widgets.hidden %}
        <div class="row">
            <div class="col-md-12">
                <div id="widget-permissions" class="box box-primary">
                    <div class="box-header">
                        <h3 class="box-title pull-left"><i class="fa fa-key fa-fw"></i> {{ translate('PERMISSION', 2) }}
                        </h3>
                        {% include "tables/table-tool-menu.html.twig" %}
                    </div>
                    <div class="box-body">
                        {% include "tables/permissions.html.twig" with {
                            "table" : {
                                "id" : "table-permissions",
                                "columns" : ["via_roles"]
                            }
                        } %}
                    </div>
                </div>
            </div>
        </div>
    {% endif %}
{% endblock %}
{% block scripts_page %}
    <!-- Include page variables -->
    <script>
        {% include "pages/partials/page.js.twig" %}

        // Add user name
        page = $.extend(
            true,               // deep extend
            {
                "user_name": "{{ user.user_name }}"
            },
            page
        );
    </script>

    <!-- Include form widgets JS -->
    {{ assets.js('js/form-widgets') | raw }}

    <!-- Include page-specific JS -->
    {{ assets.js('js/pages/user') | raw }}
{% endblock %}