{% import "components/home.html" as home with context %}
{% extends "layout/basic.html" %}
{% block content %}
{{ set(UiContext, 'udoc', udoc) }}
<style>
  .user-profile-bg {
    background-image : url("{{ udoc.backgroundImage }}");
  }
</style>
<div class="row">
  <div class="medium-9 columns">
    <div class="section">
      <div class="profile-header user-profile-bg">
        <div class="profile-header__content">
          <div class="media">
            <div class="media__left">
              <img src="{{ avatarUrl(udoc.avatar, 120) }}" width="120" height="120" class="large user-profile-avatar">
            </div>
            <div class="media__body profile-header__main">
              <h1>
                {{ udoc['uname'] }}
                <small>({{ _('UID') }}: {{ udoc['_id'] }})</small>
              </h1>
              <p>
                {{ _('Registered at') }} {{ datetimeSpan(udoc['regat'])|safe }},
                {{ _('last login at') }} {{ datetimeSpan(udoc['loginat'])|safe }},
              {% if sdoc %}
                {{ _('last active at') }} {{ datetimeSpan(sdoc['updateAt'])|safe }}.
              {% else %}
                {{ _('currently offline') }}.
              {% endif %}
              </p>
              <p>{{ _('Solved {0} problems, RP: {1} (No. {2})').format(udoc.nAccept|default(0), udoc['rp']|default(0.0)|round(2), udoc['rank']|default('?')) }}</p>
              <div class="profile-header__contact-bar">
              {% if isSelfProfile %}
                <a class="profile-header__contact-item" href="{{ url('home_settings', category='account') }}" data-tooltip="{{ _('Edit Profile') }}">
                  <span class="icon icon-edit"></span>
                </a>
              {% endif %}
                <a class="profile-header__contact-item" href="{{ url('home_messages', query={target_uid:udoc._id}) }}" target="_blank" data-tooltip="{{ _('Send Message') }}">
                  <span class="icon icon-comment--multiple"></span>
                </a>
              {% if udoc['mail'] %}
                <a class="profile-header__contact-item" href="javascript:;" name="profile_contact_copy" data-content="{{ udoc['mail'] | base64_encode }}" data-tooltip="{{ _('Copy Email') }}">
                  <span class="icon icon-mail"></span>
                </a>
              {% endif %}
              {% if udoc['qq'] %}
                <a class="profile-header__contact-item" href="javascript:;" name="profile_contact_copy" data-content="{{ udoc['qq'] | base64_encode }}" data-tooltip="{{ _('Copy QQ Number') }}">
                  <span class="icon icon-qq"></span>
                </a>
              {% endif %}
              {% if udoc['wechat'] %}
                <a class="profile-header__contact-item" href="javascript:;" name="profile_contact_copy" data-content="{{ udoc['wechat'] | base64_encode }}" data-tooltip="{{ _('Copy WeChat Account') }}">
                  <span class="icon icon-wechat"></span>
                </a>
              {% endif %}
              {% if udoc.gender and udoc.gender != model.builtin.USER_GENDER_OTHER %}
                <span
                  class="profile-header__contact-item"
                  data-tooltip="{{ model.builtin.USER_GENDER_RANGE[udoc.gender] }}"
                >
                  {{ model.builtin.USER_GENDER_ICONS[udoc.gender] }}
                </span>
              {% endif %}
              {% if udoc.hasPriv(PRIV.PRIV_MOD_BADGE) %}
                <span
                  class="profile-header__contact-item user-profile-badge badge--su"
                  data-tooltip="{{ _('{0} is a superuser.').format(_('She' if udoc.gender == 1 else 'He')) }}"
                >
                  SU
                </span>
              {% elif udoc.hasPerm(perm.PERM_MOD_BADGE) %}
                <span
                  class="profile-header__contact-item user-profile-badge badge--mod"
                  data-tooltip="{{ _('{0} is a moderator of this domain.').format(_('She' if udoc.gender == 1 else 'He')) }}"
                >
                  MOD
                </span>
              {% endif %}
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="profile-content">
        <div class="section__tab-container immersive">
          <ul class="section__tabs">
            <li class="section__tab-item">
              <h1 class="section__tab-title">{{ _('Bio') }}</h1>
              <div class="section__tab-main">
              {% if not udoc.bio %}
                {{ nothing.render("This person is lazy and didn't wrote anything.") }}
              {% else %}
                <div class="section__body typo">
                  {{ udoc.bio|default('')|markdown|safe }}
                </div>
              {% endif %}
              </div>
            </li>
            <li class="section__tab-item">
              <h1 class="section__tab-title">{{ _('Contributions') }} ({{ pcount }})</h1>
              <div class="section__tab-main">
              {% if not pdocs %}
                {{ nothing.render("Oh, the user doesn't have any contributions!") }}
              {% else %}
                <div class="section__header">
                  <h1 class="section__title">{{ _('Contributed Problems') }}</h1>
                </div>
                <div class="section__body">
                {%- for pdoc in pdocs -%}
                  <p><a href="{{ url('problem_detail', pid=pdoc.pid|default(pdoc.docId)) }}">{{ pdoc['title'] }}</a></p>
                {%- endfor -%}
                </div>
              {% endif %}
              </div>
            </li>
            <li class="section__tab-item">
              <h1 class="section__tab-title">{{ _('Submissions') }} ({{ udoc['nSubmit']|default(0) }})</h1>
              <div class="section__tab-main">
              {% if not rdocs %}
                {{ nothing.render("Oh, the user hasn't submitted yet!") }}
              {% else %}
                <div class="section__header">
                  <h1 class="section__title">{{ _('Recent Submissions') }}</h1>
                </div>
                <div class="section__body no-padding">
                  <table class="data-table record_main__table">
                    <colgroup>
                      <col class="col--status">
                      <col class="col--problem">
                      <col class="col--submit-by">
                      <col class="col--time">
                      <col class="col--memory">
                      <col class="col--lang">
                      <col class="col--submit-at">
                    </colgroup>
                    <thead>
                      <tr>
                        <th class="col--status record-status--border">{{ _('Status') }}</th>
                        <th class="col--problem">{{ _('Problem') }}</th>
                        <th class="col--submit-by">{{ _('Submit By') }}</th>
                        <th class="col--time">{{ _('Time') }}</th>
                        <th class="col--memory">{{ _('Memory') }}</th>
                        <th class="col--lang">{{ _('Language') }}</th>
                        <th class="col--submit-at">{{ _('Submit At') }}</th>
                      </tr>
                    </thead>
                    <tbody>
                    {%- for rdoc in rdocs -%}
                      {% set pdoc = pdict[rdoc.pid] %}
                      {% include 'record_main_tr.html' %}
                    {%- endfor -%}
                    </tbody>
                  </table>
                </div>
              {% endif %}
              </div>
            </li>
          </ul>
        </div>
      </div>
    </div>
    <div class="section">
      <div class="section__tab-main">
        <div id="rating-placeholder"></div>
      </div>
    </div>
  </div>
  <div class="medium-3 columns">
  {% if isSelfProfile %}
    {{ home.render_sidebar() }}
  {% endif %}
    <div class="section side">
      <div class="section__body">
        <div class="balancer sidebar-user-stat">
          <div class="balancer__body">
            <div class="numbox">
              <div class="numbox__num medium">{{ udoc.nAccept or 0 }}</div>
              <div class="numbox__text">{{ _('Accepted') }}</div>
            </div>
          </div>
          <div class="balancer__body">
            <div class="numbox">
              <div class="numbox__num medium">{{ udoc.nLiked or 0 }}</div>
              <div class="numbox__text">{{ _('Solutions Liked') }}</div>
            </div>
          </div>
          <div class="balancer__body">
            <div class="numbox">
              <div class="numbox__num medium">{{ udoc.nProblems or 0 }}</div>
              <div class="numbox__text">{{ _('Upload Problem') }}</div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
{% endblock %}