{% extends 'board_base.html' %}
{% load i18n %}
{% load forum_member_tags %}

{% block sub_title %}{% blocktrans with username=profile.user|forum_member_display_name %}{{ username }} profile{% endblocktrans %}{% endblock sub_title %}

{% block content %}
<div class="mb-3 row">
  <div class="col-12">
    <h1>{% blocktrans with username=profile.user|forum_member_display_name %}{{ username }} profile{% endblocktrans %}</h1>
  </div>
</div>
<div class="row profile">
  <div class="col-md-3">
    <div class="mb-3 profile-sidebar">
      <div class="card">
        <div class="profile-avatar">
          {% include "partials/avatar.html" with profile=profile show_placeholder=True %}
        </div>
        <div class="profile-username">
          <h3 class="my-3 text-center text-muted">{{ profile.user|forum_member_display_name }}</h3>
        </div>
      </div>
    </div>
    {% if profile.user == request.user %}
    <a href="{%url 'forum_member:profile_update' %}" class="btn btn-block btn-primary">{% trans "Edit profile" %}</a>
    {% endif %}
  </div>
  <div class="col-md-9">
    <div class="mb-3 row">
      <div class="col-md-12">
        <div class="profile-content">
          <div class="card">
            <div class="card-header">{% trans "Statistics" %}</div>
            <div class="card-body">
              <div class="row">
                <div class="col-md-12 divider text-center">
                  <div class="row">
                    <div class="col-12 col-sm-6 emphasis">
                      {% blocktrans count counter=profile.posts_count %}<h2><strong>{{ counter }}</strong></h2>
                      <p><small>Post</small></p>{% plural %}<h2><strong>{{ counter }}</strong></h2>
                      <p class="mb-1"><small>Posts</small></p>{% endblocktrans %}
                    </div>
                    <div class="col-12 col-sm-6 emphasis">
                      {% blocktrans count counter=topics_count %}<h2><strong>{{ counter }}</strong></h2>
                      <p><small>Topic</small></p>{% plural %}<h2><strong>{{ counter }}</strong></h2>
                      <p class="mb-1"><small>Topics</small></p>{% endblocktrans %}
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="row recent-posts">
      <div class="col-md-12">
        <div class="card">
          <div class="card-header">{% trans "Recent posts" %}{% if recent_posts %}&nbsp;(<a href="{% url 'forum_member:user_posts' profile.user_id %}">{% trans "View all" %}</a>){% endif %}</div>
          <div class="card-body">
            {% for post in recent_posts %}
            <div class="row post">
              <div class="col-md-12 post-content-wrapper">
                <div class="post-title">
                  <a href="{% url 'forum_conversation:topic' post.topic.forum.slug post.topic.forum.pk post.topic.slug post.topic.pk %}?post={{ post.pk }}#{{ post.pk }}">{{ post.subject }}</a>
                </div>
                <p>
                  <small class="text-muted">
                    <i class="fa fa-clock-o"></i>&nbsp;{% blocktrans with creation_date=post.created %}On {{ creation_date }}{% endblocktrans %}
                  </small>
                </p>
                <div class="post-content">
                  {{ post.content.rendered|truncatechars_html:160 }}
                </div>
              </div>
            </div>
            {% endfor %}
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
{% endblock content %}
