{% extends "base.html" %}
{% load i18n %}
{% block extrahead %}
	<script>
$(document).ready(function () {
    $('#accordion').accordion({
		active: false,
		collapsible: true,
        autoHeight: false,
        create: function () {
//			load password change form
            $('#pass_change_placeholder').load("{% url pass_change %}");
//			load ssh keys manager
			$('#manage_sshkeys_placeholder').load("{% url user-keys %}");
//			change user mail
			$('#change_email_placeholder').load("{% url mail-change %}");
//			change user full name
			$('#change_name_placeholder').load("{% url name-change %}");
			
        }
    });
});

	</script>

{% endblock %}
{% block title %}{% trans "My profile" %}{% endblock %}
{% block content %}
<h3>{% trans "My profile" %}</h3>

<div id="accordion">
	<h3><a href="#" style="color: #4183C4;">{% trans "Change Name" %}</a></h3>
	<div id="change_name_placeholder"></div>
	<h3><a href="#" style="color: #4183C4;">{% trans "Change Password" %}</a></h3>
	<div id="pass_change_placeholder"></div>
	<h3><a href="#" style="color: #4183C4;">{% trans "Change Email" %}</a></h3>
	<div id="change_email_placeholder"></div>
	<h3><a href="#" style="color: #4183C4;">{% trans "Manage SSH Keys" %}</a></h3>
	<div id="manage_sshkeys_placeholder"></div>
</div>



{% endblock %}