{% 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}}",
            delete_redirect: "{{delete_redirect}}"
        },
        page
    );
    </script>

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

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