{% extends 'user/master.twig' %}
{% from 'macros.twig' import navigation %}

{% set image = '/profile.php?u=' ~ profile.user_id ~ '&m=avatar' %}
{% set canonical_url = '/profile.php?u=' ~ profile.user_id %}
{% set title = 'Profile of ' ~ profile.username %}
{% set manage_link = '/manage/users.php?v=view&u=' ~ profile.user_id %}

{% if has_background %}
    {% set site_background_url = '/profile.php?m=background&u=' ~ profile.user_id %}
{% endif %}

{% set stats = [
    {
        'title': 'Joined',
        'is_date': true,
        'value': profile.created_at,
    },
    {
        'title': 'Last seen',
        'is_date': true,
        'value': profile.last_seen,
    },
    {
        'title': 'Topics',
        'value': profile.forum_topic_count,
    },
    {
        'title': 'Posts',
        'value': profile.forum_post_count,
    },
    {
        'title': 'Comments',
        'value': profile.comments_count,
    },
    {
        'title': 'Changes',
        'value': profile.changelog_count,
    },
] %}

{% block content %}
    <div class="profile" id="profile">
        {% include 'user/_layout/header.twig' %}

        <div class="warning">
            <div class="warning__content">
                The profile pages are still under much construction, more things will eventually populate the area where this container current exists.
            </div>
        </div>

        <div class="profile__container">
            <div class="profile__container__side">
                {% if current_user is not defined %}
                    <div class="container container--new">
                        <div class="profile__accounts__notice">
                            You must <a href="/auth.php?m=login" class="profile__accounts__link">log in</a> to view full profiles!
                        </div>
                    </div>
                {% elseif profile_fields|default([])|length > 0 %}
                    <div class="container container--new">
                        <div class="container__title">
                            Elsewhere
                        </div>
                        <div class="profile__accounts">
                            {% for name, data in profile_fields %}
                                <div class="profile__accounts__item">
                                    <div class="profile__accounts__title">
                                        {{ data.name }}
                                    </div>
                                    <div class="profile__accounts__value"
                                        {% if data.tooltip is defined %}title="{{ data.tooltip|format(data.value)|raw }}"{% endif %}>
                                        {% set profile_field_value = (data.format is defined ? data.format : '%s')|format(data.value) %}
                                        {% if data.link is defined %}
                                            {{ data.link|format(data.value)|html_link(profile_field_value, 'profile__accounts__link')|raw }}
                                        {% else %}
                                            {{ profile_field_value }}
                                        {% endif %}
                                    </div>
                                </div>
                            {% endfor %}
                        </div>
                    </div>
                {% endif %}
            </div>

            <div class="profile__container__main">

                {% if profile.user_about_content|length > 0 %}
                    <div class="container container--new profile__about" id="about">
                        <div class="container__title profile__about__title">
                            About {{ profile.username }}
                        </div>
                        <div class="container__content profile__about__content">
                            {{ profile.user_about_content|escape|parse_text(profile.user_about_parser)|raw }}
                        </div>
                    </div>
                {% endif %}

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