{% from '_layout/input.twig' import input_checkbox_raw %}

<div class="container profile__header">
    <div class="profile__header__details">
        <div class="profile__header__avatar">
            {% if is_editing and perms.edit_avatar %}
                <label class="avatar profile__header__avatar__image profile__header__avatar__image--edit"
                    style="background-image:url('{{ image }}')"
                    id="avatar-preview"
                    for="avatar-selection"></label>

                <div class="profile__header__avatar__options">
                    <label class="profile__header__avatar__option" for="avatar-selection">
                        Select
                    </label>

                    {{ input_checkbox_raw('avatar[delete]', false, 'profile__header__avatar__check', '', false, {'id':'avatar-delete'}) }}
                    <label class="profile__header__avatar__option profile__header__avatar__option--delete"
                        for="avatar-delete">
                        Remove
                    </label>
                </div>
            {% else %}
                <div class="avatar profile__header__avatar__image" style="background-image:url('{{ image }}')"></div>
            {% endif %}
        </div>

        <div class="profile__header__details__content">
            <div class="profile__header__username" style="{{ profile.user_colour|html_colour }}">
                {{ profile.username }}
            </div>

            {% if profile.user_title is not empty %}
                <div class="profile__header__title">
                    {{ profile.user_title }}
                </div>
            {% endif %}

            <div class="profile__header__country">
                <div class="flag flag--{{ profile.user_country|lower }}"></div>
                <div class="profile__header__country__name">
                    {{ profile.user_country|country_name }}
                </div>
            </div>
        </div>

        {% if friend_info is defined and (friend_info.subject_relation is not null or friend_info.user_relation is not null) %}
            <div class="profile__header__details__relation" title="Since {{ friend_info.relation_created|date('r') }}">
                {% if friend_info.subject_relation and friend_info.user_relation %}
                    Mutual Friends
                {% elseif friend_info.user_relation %}
                    You Follow
                {% elseif friend_info.subject_relation %}
                    Follows You
                {% endif %}
            </div>
        {% endif %}
    </div>

    <div class="profile__header__options">
        <div class="profile__header__actions">
            {% if is_editing %}
                <button class="input__button input__button--save profile__header__action">Save</button>
                <a href="/profile.php?u={{ profile.user_id }}" class="input__button input__button--destroy profile__header__action">Discard</a>
                <a href="/settings.php" class="input__button profile__header__action">Settings</a>
            {% elseif can_edit %}
                <a href="/profile.php?u={{ profile.user_id }}&amp;m=edit" class="input__button profile__header__action">Edit Profile</a>
            {% endif %}

            {% if current_user is defined and current_user.user_id != profile.user_id and not is_editing %}
                {% if friend_info.user_relation == constant('MSZ_USER_RELATION_FOLLOW') %}
                    <a href="/relations.php?u={{ profile.user_id }}&amp;m=remove" class="input__button input__button--destroy profile__header__action">{{ friend_info.subject_relation == constant('MSZ_USER_RELATION_FOLLOW') ? 'Unfriend' : 'Unfollow' }}</a>
                {% else %}
                    <a href="/relations.php?u={{ profile.user_id }}&amp;m=add&amp;t=follow" class="input__button profile__header__action">{{ friend_info.subject_relation == constant('MSZ_USER_RELATION_FOLLOW') ? 'Add as Friend' : 'Follow' }}</a>
                {% endif %}
            {% endif %}
        </div>

        {% if stats is defined %}
            <div class="profile__header__stats">
                {% for stat in stats %}
                    {% if stat.value|default(false) %}
                        {% set is_date = stat.is_date|default(false) %}

                        <div class="profile__header__stat{% if is_date %} profile__header__stat--date" title="{{ stat.value|date('r') }}{% endif %}">
                            <div class="profile__header__stat__name">
                                {{ stat.title }}
                            </div>

                            {% if is_date %}
                                <time class="profile__header__stat__value" datetime="{{ stat.value|date('c') }}">
                                    {{ stat.value|time_diff }}
                                </time>
                            {% else %}
                                <div class="profile__header__stat__value">
                                    {{ stat.value|number_format }}
                                </div>
                            {% endif %}
                        </div>
                    {% endif %}
                {% endfor %}
            </div>
        {% endif %}
    </div>
</div>