{% extends "base.html" %}
{% load i18n %}
{% load humanize %}
{% load icons %}
{% load urlformat %}
{% load metrics %}
{% load permissions %}
{% load authnames %}
{% load crispy_forms_tags %}

{% block breadcrumbs %}
<li><a href="{% url "user_list" %}">{% trans "Users" %}</a></li>
<li><a href="{{ page_profile.get_absolute_url }}">{{ page_profile.get_user_name }}</a></li>
{% endblock %}

{% block content %}
{% with billings=page_user.billing_set.all %}

{% perm 'user.edit' as can_edit_user %}

<div class="user-page text-center">
    <img class="avatar w128" src="{% url 'user_avatar' user=page_user.username size=128 %}" alt="{% trans "User avatar" %}" />
    <h3>{{ page_user }}</h3>
    <p>
        <span class="middle-dot-divider">@{{ page_user.username }}</span>
        <span class="middle-dot-divider">{% blocktrans with date=page_user.date_joined|date:"DATE_FORMAT" %}Joined on {{ date }}{% endblocktrans %}</span>
        {% if can_edit_user %}
          <span class="middle-dot-divider">
            {% if page_user.last_login %}
              {% blocktrans with date=page_user.last_login|date:"DATE_FORMAT" %}Last sign-in on {{ date }}{% endblocktrans %}
            {% else %}
              <em>{% trans "Never signed-in" %}</em>
            {% endif %}
          </span>
        {% endif %}
        {% if page_profile.company %}
          <span class="middle-dot-divider">
            <span class="profile-icon">{% icon "domain.svg" %}</span> {{ page_profile.company }}
          </span>
        {% endif %}
        {% if page_profile.location %}
          <span class="middle-dot-divider">
            <span class="profile-icon">{% icon "map-marker.svg" %}</span> {{ page_profile.location }}
          </span>
        {% endif %}
    </p>
    {% if page_profile.translated or page_profile.suggested or page_profile.uploaded %}
    <p>
        {% if page_profile.translated %}
            <span class="middle-dot-divider">
                {% blocktrans count cnt=page_profile.translated with count=page_profile.translated|intcomma %}{{ count }} translation{% plural %}{{ count }} translations{% endblocktrans %}
            </span>
        {% endif %}
        {% if page_profile.suggested %}
            <span class="middle-dot-divider">
                {% blocktrans count cnt=page_profile.suggested with count=page_profile.suggested|intcomma %}{{ count }} suggestion{% plural %}{{ count }} suggestions{% endblocktrans %}
            </span>
        {% endif %}
        {% with pending_suggestions=page_user.suggestion_set.count %}
        {% if pending_suggestions %}
            <span class="middle-dot-divider">
                <a href="{% url 'user_suggestions' user=page_user.username %}">
                    {% blocktrans count cnt=pending_suggestions with count=pending_suggestions|intcomma %}{{ count }} pending suggestion{% plural %}{{ count }} pending suggestions{% endblocktrans %}
                </a>
            </span>
        {% endif %}
        {% endwith %}
        {% if page_profile.uploaded %}
            <span class="middle-dot-divider">
                {% blocktrans count cnt=page_profile.uploaded with count=page_profile.uploaded|intcomma %}{{ count }} screenshot{% plural %}{{ count }} screenshots{% endblocktrans %}
            </span>
        {% endif %}
        {% if page_profile.commented %}
            <span class="middle-dot-divider">
                {% blocktrans count cnt=page_profile.commented with count=page_profile.commented|intcomma %}{{ count }} comment{% plural %}{{ count }} comments{% endblocktrans %}
            </span>
        {% endif %}
    </p>
    {% endif %}
    {% if can_edit_user or page_profile.website or page_profile.public_email or page_profile.github or page_profile.twitter or page_profile.linkedin or page_profile.liberapay or page_profile.fediverse or page_profile.codesite %}
      <p>
        {% if page_profile.website %}
          <span class="middle-dot-divider">
            <span class="profile-icon">{% icon "link.svg" %}</span> <a href="{{ page_profile.website }}" rel="ugc">{{ page_profile.website | urlformat }}</a>
          </span>
        {% endif %}
        {% if page_profile.public_email %}
          <span class="middle-dot-divider">
            <span class="profile-icon">{% icon "email.svg" %}</span> <a href="mailto:{{ page_profile.public_email }}" rel="ugc">{{ page_profile.public_email }}</a>
          </span>
        {% endif %}
        {% if can_edit_user and page_user.email != page_profile.public_email %}
          <span class="middle-dot-divider">
            <span class="profile-icon">{% icon "email.svg" %}</span> <a href="mailto:{{ page_user.email }}" rel="ugc">{{ page_user.email }}</a>
          </span>
        {% endif %}
        {% if page_profile.liberapay %}
          <span class="middle-dot-divider">
            <span class="profile-icon">{% icon "liberapay.svg" %}</span> <a href="https://liberapay.org/{{ page_profile.liberapay }}" rel="ugc">{{ page_profile.liberapay }}</a>
          </span>
        {% endif %}
        {% if page_profile.fediverse %}
          <span class="middle-dot-divider">
            <span class="profile-icon">{% icon "fediverse.svg" %}</span> <a href="{{ page_profile.fediverse }}" rel="ugc">{{ page_profile.fediverse | urlformat }}</a>
          </span>
        {% endif %}
        {% if page_profile.github %}
          <span class="middle-dot-divider">
            <span class="profile-icon">{% icon "github.svg" %}</span> <a href="https://github.com/{{ page_profile.github }}" rel="ugc">{{ page_profile.github }}</a>
          </span>
        {% endif %}
        {% if page_profile.codesite %}
          <span class="middle-dot-divider">
            <span class="profile-icon">{% icon "source.svg" %}</span> <a href="{{ page_profile.codesite }}" rel="ugc">{{ page_profile.codesite | urlformat }}</a>
          </span>
        {% endif %}
        {% if page_profile.twitter %}
          <span class="middle-dot-divider">
            <span class="profile-icon">{% icon "twitter.svg" %}</span> <a href="https://twitter.com/{{ page_profile.twitter }}" rel="ugc">{{ page_profile.twitter }}</a>
          </span>
        {% endif %}
        {% if page_profile.linkedin %}
          <span class="middle-dot-divider">
            <span class="profile-icon">{% icon "linkedin.svg" %}</span> <a href="https://www.linkedin.com/in/{{ page_profile.linkedin }}/" rel="ugc">{{ page_profile.linkedin }}</a>
          </span>
        {% endif %}
      </p>
    {% endif %}
    {% if user_languages %}
    <p>
        {% for language in user_languages %}
            <span class="middle-dot-divider">
                <a href="{{ language.get_absolute_url }}">{{ language }}</a>
            </span>
        {% endfor %}
    </p>
    {% endif %}
</div>

<ul class="nav nav-pills nav-center">
<li class="active"><a data-toggle="tab" href="#contributed">{% trans "Translations with contribution" %}</a></li>
<li><a data-toggle="tab" href="#managed">{% trans "Managed projects" %}</a></li>
<li><a data-toggle="tab" href="#watched">{% trans "Watched projects" %}</a></li>
<li><a data-toggle="tab" href="#activity">{% trans "Activity" %}</a></li>
<li><a data-toggle="tab" href="#changes">{% trans "Recent changes" %}</a></li>
{% if can_edit_user %}
  <li><a data-toggle="tab" href="#identities">{% trans "User identities" %}</a></li>
  {% if billings %}
    <li><a data-toggle="tab" href="#billing">{% trans "Billing" %}</a></li>
  {% endif %}
  <li><a data-toggle="tab" href="#audit">{% trans "Audit log" %}</a></li>
  <li><a data-toggle="tab" href="#groups">{% trans "Groups" %}</a></li>
  <li><a data-toggle="tab" href="#edit">{% trans "Edit" %}</a></li>
{% endif %}
</ul>

<div class="tab-content">

<div class="tab-pane active" id="contributed">
<div class="list-group">
{% include "snippets/list-objects.html" with objects=page_user_translations label=_("Translation") show_admin_badge=True  name_source="translation" %}
</div>
</div>

<div class="tab-pane" id="managed">
<div class="list-group">
{% include "list-projects.html" with projects=page_owned_projects %}
</div>
</div>

<div class="tab-pane" id="watched">
<div class="list-group">
{% include "list-projects.html" with projects=page_watched_projects %}
</div>
</div>

<div class="tab-pane" id="activity">

{% include "snippets/activity.html" with metrics=page_user|metrics %}

</div>

<div class="tab-pane" id="changes">
    {% include "last-changes-content.html" %}
    <a class="btn btn-link" href="{% url 'changes' %}?{{ last_changes_url }}">{% trans "Browse all changes for user" %}</a>
</div>


{% if can_edit_user %}
  <div class="tab-pane" id="identities">
    <table class="table table-listing">
      <thead>
        <tr>
          <th>{% trans "Identity" %}</th>
          <th>{% trans "User ID" %}</th>
          <th>{% trans "E-mail" %}</th>
        </tr>
      </thead>
      <tbody>
        {% for social in page_user.social_auth.all %}
          <tr>
            <th>{% auth_name social.provider ' ' %}</th>
            <td>{{ social.uid }}</td>
            <td>{% for verified in social.verifiedemail_set.all %}{{ verified.email }}{% endfor %}</td>
          </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>

  {% if billings %}
    <div class="tab-pane" id="billing">
      {% include "billing/list.html" with objects=billings show_expiry=1 show_removal=1 %}
    </div>
  {% endif %}
    </tr>

  <div class="tab-pane" id="audit">
    <table class="table table-listing">
      <thead>
        <tr>
          <th>{% trans "When" %}</th>
          <th>{% trans "Account activity" %}</th>
          <th>{% trans "IP address" %}</th>
          <th>{% trans "User agent" %}</th>
        </tr>
      </thead>
      <tbody>
        {% for log in page_user.auditlog_set.order %}
          <tr>
            <td>{{ log.timestamp|date:"DATETIME_FORMAT" }}</td>
            <th>{{ log.get_message }}</th>
            <td>{{ log.address }}</td>
            <td>{{ log.user_agent }}</td>
          </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>

  <div class="tab-pane" id="groups">
    <table class="table table-listing">
      <thead>
        <tr>
          <th>{% trans "Project" %}</th>
          <th>{% trans "Group" %}</th>
          <th class="number">{% trans "Members" %}</th>
          <th></th>
        </tr>
      </thead>
      <tbody>
        {% for group in page_user_groups %}
          <tr>
            {% if group.defining_project %}
              <th>{{ group.defining_project }}</th>
            {% else %}
              <td><em>{% trans "None" context "None project associated with group" %}</em></td>
            {% endif %}
            <th>{{ group.name }}</th>
            <td class="number">{{ group.user_set.count }}</td>
            <td>
              <a href="" class="btn btn-link btn-xs red link-post" data-href="{{ page_user.get_absolute_url }}" data-params='{"remove_group": {{ group.pk }}}' title="{% trans "Remove user from this group" %}">
                {% icon 'delete.svg' %}
              </a>
            </td>
          </tr>
        {% endfor %}
        {% for userblock in page_user.userblock_set.all %}
          <tr>
            <th>{{ userblock.project.name }}</th>
            <td>
              {% if userblock.expiry %}
                {% blocktrans with expiry=userblock.expiry|date:"DATE_FORMAT" %}Blocked until {{ expiry }}{% endblocktrans %}
              {% else %}
                {% trans "Blocked permanently" %}
              {% endif %}
            </td>
            <td>
              <a href="" class="btn btn-link btn-xs link-post" data-href="{% url 'unblock-user' project=userblock.project.slug %}" data-params='{"user": "{{ userblock.user.username|escapejs }}"}' title="{% trans "Unblock user" %}">
                {% icon 'close.svg' %}
              </a>
            </td>
          </tr>
        {% endfor %}
      </tbody>
    </table>
    {% crispy group_form %}
  </div>

  <div class="tab-pane" id="edit">
    <form method="post">
      {% csrf_token %}
      {{ form|crispy }}
      <input type="submit" value="{% trans "Save" %}" class="btn btn-primary" />
      <input type="submit" name="remove_user" value="{% trans "Delete" %}" class="btn btn-danger" />
    </form>
  </div>
{% endif %}

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