{% extends "dashboard/base.html" %}
{% load i18n %}
{% load crispy_forms_tags %} 
{% load render_table from django_tables2 %}

{% block title-page %}{% trans "Profile" %}{% endblock %}

{% block content %}

<div class="row">
  <div class="col-md-12">
    <div class="panel panel-default">
      <div class="panel-heading">
        <a class="pull-right btn btn-default btn-xs" 
          href="{% url "dashboard.views.profile" username=object.user.username %}">
          {% trans "Go to my profile" %}</a>
        <h3 class="no-margin"><i class="icon-desktop"></i> {% trans "My profile" %}</h3>
      </div>
      <div class="panel-body">
        <div class="row">
          <div class="col-md-4" style="margin-bottom: 50px;">
            <fieldset>
              <legend>{% trans "Password change" %}</legend>
              {% crispy forms.change_password %}
            </fieldset>
          </div>
          <div class="col-md-4" style="margin-bottom: 50px;">
            <fieldset>
              <legend>{% trans "My preferences" %}</legend>
              {% crispy forms.change_language %}
            </fieldset>
          </div>
          <div class="col-md-4">
            <fieldset>
              <legend>{% trans "Current avatar" %}</legend>
              <p>
                <img id="dashboard-profile-avatar" 
                 class="img-rounded" src="{{ object.get_avatar_url }}"/>
              </p>
              <p>
                <a href="{% url "dashboard.views.profile" username=profile.user.username %}">
                  {% trans "Go to my profile" %}
                </a>
              </p>
            </fieldset>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="row">
  <div class="col-md-12">
    <div class="panel panel-default">
      <div class="panel-heading">
        <a href="{% url "dashboard.views.userkey-create" %}" class="pull-right btn btn-success btn-xs" style="margin-right: 10px;">
          <i class="icon-plus"></i> {% trans "add SSH key" %}
        </a>
        <h3 class="no-margin"><i class="icon-key"></i> {% trans "SSH public keys" %}</h3>
      </div>
      <div class="panel-body">
        {% render_table userkey_table %}
      </div>
    </div>
  </div>
</div>

{% endblock %}