{% extends 'base.html.twig' %}
{% import "user/actions.html.twig" as actions %}

{% block page_title %}{{ 'profile.title'|trans }}{% endblock %}
{% block page_subtitle %}{% if not user.alias is empty %}{{ user.alias }} - {% endif %}{{ user.username }}{% endblock %}
{% block page_actions %}{{ actions.user(user, tab) }}{% endblock %}

{% block main %}
    <div class="row">
        <div class="col-md-8">
            {% block profile_content %}{% endblock %}
        </div>

        <div class="col-md-4">

            {% embed '@AdminLTE/Widgets/box-widget.html.twig' %}
                {% import "macros/widgets.html.twig" as widgets %}
                {% block box_body_class %}box-profile{% endblock %}
                {% block box_body %}
                    <div class="text-center">
                        {{ widgets.user_avatar(user) }}
                        <h3 class="profile-username">{{ widgets.username(user) }}</h3>
                        <p class="text-muted">{{ user.title }}</p>
                    </div>
                    {% set seeOwnRate = is_granted('view_rate_own_timesheet') %}

                    <table class="table">
                        <tr>
                            <th>{{ 'stats.durationMonth'|trans }}</th>
                            <td class="text-nowrap pull-right">{{ stats.durationThisMonth|duration }}</td>
                        </tr>
                        {% if seeOwnRate %}
                        <tr>
                            <th>{{ 'stats.amountMonth'|trans }}</th>
                            <td class="text-nowrap pull-right">{{ stats.amountThisMonth|money }}</td>
                        </tr>
                        {% endif %}
                        <tr>
                            <th>{{ 'stats.durationTotal'|trans }}</th>
                            <td class="text-nowrap pull-right">{{ stats.durationTotal|duration }}</td>
                        </tr>
                        {% if seeOwnRate %}
                        <tr>
                            <th>{{ 'stats.amountTotal'|trans }}</th>
                            <td class="text-nowrap pull-right">{{ stats.amountTotal|money }}</td>
                        </tr>
                        {% endif %}
                    </table>
                {% endblock %}
            {% endembed %}

            {% embed '@AdminLTE/Widgets/box-widget.html.twig' %}
                {% block box_title %}{{ 'profile.about_me'|trans }}{% endblock %}
                {% block box_body %}
                    {# colors = purple, blue, aqua, red, green #}
                    <table class="table no-border">
                        <tr>
                            <th>{{ 'label.id'|trans }}</th>
                            <td class="text-nowrap pull-right">{{ user.id }}</td>
                        </tr>
                        <tr>
                            <th>{{ 'label.username'|trans }}</th>
                            <td class="text-nowrap pull-right">{{ user.username }}</td>
                        </tr>
                        <tr>
                            <th>{{ 'profile.first_entry'|trans }}</th>
                            <td class="text-nowrap pull-right">{{ stats.firstEntry|date_short }}</td>
                        </tr>
                        {% if is_granted('hourly-rate', user) %}
                        <tr>
                            <th>{{ 'label.hourlyRate'|trans }}</th>
                            <td class="text-nowrap pull-right">{{ user.preferenceValue('hourly_rate') }}</td>
                        </tr>
                        {% endif %}
                    </table>
                {% endblock %}
            {% endembed %}

            {% if user.teams is not empty and (is_granted('teams', user) or (app.user == user and is_granted('view_team_member'))) %}
                {% embed '@AdminLTE/Widgets/box-widget.html.twig' %}
                    {% import "macros/widgets.html.twig" as widgets %}
                    {% block box_title %}{{ 'label.my_teams'|trans }}{% endblock %}
                    {% block box_tools %}
                        {% if is_granted('roles', user) %}
                            <a class="btn-box-tool" href="{{ path('user_profile_teams', {'username': user.username}) }}"><i class="{{ 'edit'|icon }}"></i></a>
                        {% endif %}    
                    {% endblock %}
                    {% block box_body %}
                        {{ widgets.team_list(user.teams) }}
                    {% endblock %}
                {% endembed %}
            {% endif %}

        </div>
    </div>
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script type="text/javascript">
        document.addEventListener('kimai.initialized', function() {
            KimaiReloadPageWidget.create('kimai.teamUpdate', true);
        });
    </script>
{% endblock %}


{# -------------------------------- UNUSED FOR NOW -------------------------------- #}
{% macro profile_list_unused(user, items) %}
    {% import "@AdminLTE/Macros/default.html.twig" as macro %}
    {% import "macros/widgets.html.twig" as widgets %}

    <div class="box box-widget widget-user-2">
        <!-- Add the bg color to the header using any of the bg-* classes -->
        <div class="widget-user-header bg-green">
            <div class="widget-user-image">
                {{ macro.avatar(user.avatar, user.username) }}
            </div>
            <!-- /.widget-user-image -->
            <h3 class="widget-user-username">{{ widgets.username(user) }}</h3>
            <h5 class="widget-user-desc">{{ user.title }}</h5>
        </div>
        <div class="box-footer no-padding">
            <ul class="nav nav-stacked">
                {% for entry in items %}
                    <li><a href="{{ entry.url }}">{{ entry.title|trans }} <span class="pull-right badge bg-{{ entry.color }}">{{ entry.value }}</span></a></li>
                {% endfor %}
            </ul>
        </div>
    </div>
{% endmacro %}

{# -------------------------------- UNUSED FOR NOW -------------------------------- #}
{% macro profile_box_unused(user, stats) %}
    {% import "@AdminLTE/Macros/default.html.twig" as macro %}
    {% import "macros/widgets.html.twig" as widgets %}

    <div class="box box-widget widget-user">
        <div class="widget-user-header bg-green">
            <h3 class="widget-user-username">{{ widgets.username(user) }}</h3>
            <h5 class="widget-user-desc">{{ user.title }}</h5>
        </div>
        <div class="widget-user-image">
            {{ macro.avatar(user.avatar, user.username) }}
        </div>
        <div class="box-footer">
            <div class="row">
                <div class="col-sm-6 border-right">
                    <div class="description-block">
                        <h5 class="description-header">{{ stats.durationTotal|duration }}</h5>
                        <span class="description-text">{{ 'stats.durationTotal'|trans }}</span>
                    </div>
                </div>
                <div class="col-sm-6 border-right">
                    <div class="description-block">
                        <h5 class="description-header">{{ stats.amountTotal|money }}</h5>
                        <span class="description-text">{{ 'stats.amountTotal'|trans }}</span>
                    </div>
                </div>
                <div class="col-sm-6 border-right">
                    <div class="description-block">
                        <h5 class="description-header">{{ stats.durationThisMonth|duration }}</h5>
                        <span class="description-text">{{ 'stats.durationMonth'|trans }}</span>
                    </div>
                </div>
                <div class="col-sm-6 border-right">
                    <div class="description-block">
                        <h5 class="description-header">{{ stats.amountThisMonth|money }}</h5>
                        <span class="description-text">{{ 'stats.amountMonth'|trans }}</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endmacro %}