{% extends "myhome_base.html" %}
{% load seahub_tags avatar_tags group_avatar_tags i18n %}
{% load url from future %}

{% block nav_pubinfo_class %}class="cur"{% endblock %}

{% block left_panel %}
{% include 'snippets/pubinfo.html' %}
{% endblock %}

{% block right_panel %}
<div class="tabnav">
    <ul id="tabnav-tabs">
        <li class="tabnav-tab"><a href="{% url 'pubrepo' %}">{% trans "Libraries" %}</a></li>
        <li class="tabnav-tab"><a href="{% url 'pubgrp' %}">{% trans "Groups" %}</a></li>
        <li class="tabnav-tab tabnav-tab-cur">{% trans "Users" %}</li>
    </ul>
</div>
{% if users %}
<ul class="user-list">
    {% for u in users %}
    {% with e=u.email id=u.email|email2id %}
    <li class="user ovhd">
    <a href="{% url 'user_profile' id %}" class="pic fleft">{% avatar e 48 %}</a>
    <div class="txt fright">
        <a class="name" href="{% url 'user_profile' id %}">{{ e|email2nickname }}</a>
        <p>{{ e }}</p>
        {% if u.can_be_contact %}
        <button class="add-as-contact" data-email="{{e}}">{% trans "Add to Contacts" %}</button>
        {% endif %}
    </div>
    </li>
    {% endwith %}
    {% endfor %}
</ul>
<div id="paginator">
    {% if has_prev %}
    <a href="?page={{ current_page|add:"-1" }}">{% trans "Previous" %}</a>
    {% endif %}
    {% for pr in page_range %}
      {% if pr == current_page %}
      <span class="cur">{{ pr }}</span>
      {% else %}
      <a href="?page={{ pr }}" class="pg">{{ pr }}</a>
      {% endif %}
    {% endfor %}
    {% if has_next %}
    <a href="?page={{ current_page|add:"1" }}">{% trans "Next" %}</a>
    {% endif %}
</div>

<form id="add-as-contact-form" class="hide" action="{{ SITE_ROOT }}contacts/add/" method="post">
    <input type="hidden" name="user_email" value="{{ request.user.username }}" id="id_user_email" />
    <label>{% trans "Email" %}</label><br />
    <input id="contact_email" type="text" name="contact_email" maxlength="255" value="" /><br />
    <label>{% trans "Name(optional)" %}</label><br />
    <input id="id_contact_name" type="text" name="contact_name" maxlength="255" /><br />
    <label>{% trans "Note(optional)" %}</label><br />
    <input id="id_note" type="text" name="note" maxlength="255" /><br />
    <input type="submit" value="{% trans "Submit" %}"  class="submit" />
</form>
{% else %}
<p>{% trans "None"%}</p>
{% endif %}

{% endblock %}

{% block extra_script %}
<script type="text/javascript">
$('.add-as-contact').click(function() {
    $('#contact_email').val($(this).data('email'));
    $('#add-as-contact-form').submit();
});
</script>
{% endblock %}