{% extends "ldt/user/user_base.html" %}
{# form of profile change #}

{% load i18n %}
{% load thumbnail %}

{% block css_import %}
	{{ block.super }}
{% endblock %}


{% block js_import %}
{{block.super}}
<script language="javascript">
$(document).ready(function(){
	$("#id_image").change(function(){
		var ext = $('#id_image').val().split('.').pop().toLowerCase();
		if($.inArray(ext, ['png','jpg','jpeg']) == -1) {
		    alert('{% trans "Invalid extension ! Your file has to be JPG, JPEG or PNG." %}');
            $("#id_submit_profile_picture").css('visibility', 'hidden');
		}
		else{
			$("#id_submit_profile_picture").css('visibility', 'visible');
		}
	});
});
</script>
{% endblock %}


{% block content %}
{{ block.super }}

<div id="profile_forms">
{% if msg %}
<div class="success" style="left:50%; text-align: center;">{{ msg }}</div>
{% endif %}
<form method="post" action="{% url 'ldt.user.views.profile' %}">
{% csrf_token %}
	<table>
		<tr>
            <td class="leftcolumn">
                <label for="id_username">{% trans "Username" %}</label>
            </td>
            <td>
                <input id="id_username" type="text" maxlength="30" name="username" value="{{ user.username }}"/>
                {% for error in profile_form.errors.username %}
                <span class="error">{{ error}}</span>                
                {% endfor %}
            </td>
        </tr>
		<tr>
            <td class="leftcolumn"> 
                <label for="id_first_name">{% trans "First name" %}</label>
            </td>
            <td>
                <input id="id_first_name" type="text" maxlength="30" name="first_name" value="{{ user.first_name }}"/>
            </td>
        </tr>
        <tr>
            <td class="leftcolumn">
                <label for="id_last_name">{% trans "Name" %}</label>
            </td> 
            <td>
                <input id="id_last_name" type="text" maxlength="30" name="last_name" value="{{ user.last_name }}"/>
            </td>
        </tr>
        <tr>
            <td class="leftcolumn">
                <label for="id_email">{% trans "Email" %}</label>
            </td>
            <td>
                <input id="id_email" type="text" maxlength="75" name="email" class="required email" value="{{ user.email }}"/>
            	{% for error in profile_form.email.errors %}
            	<span class="error">
            		{{ error }}            		
            	</span>
            	{% endfor %}
            </td>
        </tr>
        <tr>
	        <td class="leftcolumn">
	        	<label>{% trans "Language" %}</label>
	        </td>
			<td>
				<select name="language" >
				{% for lang in LANGUAGES %}
					<option value="{{ lang.0 }}"{% ifequal lang.0 user_language %} selected="selected" {% endifequal %}>{% trans lang.1 %}</option>
				{% endfor %}    
				</select>
			</td>
		</tr>
		<tr>
        	<td></td>
        	<td><input type="submit" name="submit_profile" value="{% trans "Profile change" %}" /></td>
        </tr>       
    </table>    
</form>

<form method="post" action="{% url 'ldt.user.views.password' %}">
{% csrf_token %}
<table>
		<tr>
			<td class="leftcolumn">
				<label for="id_old_password">{% trans "Password" %}</label>
			</td>
			<td>
				<input type="password" name="old_password" id="id_old_password" />
           		{% for error in password_form.old_password.errors %}
            	<span class="error">
            		{{ error }}            		
            	</span>
            	{% endfor %}
			</td>
		</tr>
		<tr>
			<td class="leftcolumn">
				<label for="id_new_password1">{% trans "New password" %}</label>
			</td>
			<td>
				<input type="password" name="new_password1" id="id_new_password1" />
				{% for error in password_form.new_password1.errors %}
            	<span class="error">
            		{{ error }}            		
            	</span>
            	{% endfor %}
			</td>			
		</tr>
		<tr>
			<td class="leftcolumn">
				<label for="id_new_password2">{% trans "New password confirmation" %}</label>
			</td>
			<td>
				<input type="password" name="new_password2" id="id_new_password2" />
				{% for error in password_form.new_password2.errors %}
            	<span class="error">
            		{{ error }}            		
            	</span>
            	{% endfor %}
            </td>			
		</tr>
        <tr>
        	<td></td>
        	<td><input type="submit" name="submit_password" value="{% trans "Password change" %}" /></td>
        </tr>
    </table>
</form>

<form enctype="multipart/form-data" method="post" action="{% url 'ldt.user.views.profile_picture' %}">
{% csrf_token %}
  <table>
	<tr>
	    <td class="leftcolumn">
	        <strong>{% trans "Current profile picture" %}</strong>
	    </td>
	    <td>
	        {% thumbnail user.image "x100" format="PNG" as im %}<img src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}" />{% empty %}&nbsp;{% endthumbnail %}
	    </td>
	</tr>
    <tr>
        <td class="leftcolumn">
            <label for="id_new_profile_picture">{% trans "Upload a new picture" %}<br/> (JPG, PNG, &lt;&nbsp;1&nbsp;Mo)</label>
        </td>
        <td>
            <input type="file" name="image" id="id_image" accept="image/jpeg, image/png" />
            {% for error in profile_picture_form.image.errors %}
            <span class="error">
                {{ error }}                 
            </span>
            {% endfor %}
        </td>
    </tr>
    <tr>
        <td></td>
        <td><input type="submit" name="submit_profile_picture" id="id_submit_profile_picture" value="{% trans "Profile picture change" %}" style="visibility:hidden" /></td>
    </tr>
  </table>
</form>

</div>

{% endblock%}