{% extends "userprofile/base_2col.html" %}
{% load i18n %}

{% block title %}{% trans "Choose the location of your avatar" %}{% endblock %}
{% block robots %}noindex,nofollow{% endblock %}

{% block extrajs %}
<script type="text/javascript">
	$(function() {
	//avatar
		$("a.delavatar").click(function() {
			$.getJSON($(this).attr("href"), function(data) {
				if (data.success) {
					$("img#avatarimg").attr("src", "{{ generic96 }}");
					$("p#avatardelete").remove();
				}
			});
			return false;
		});

    $("div.photos a").click(function() {
      $("form input[name='url']").val($(this).attr("href"));
      $("form").submit();
      return false;
    });

	});
</script>
{% endblock %}

{% block userprofile_navigation %}
{% include "userprofile/menu.html" %}
{% endblock %}

{% block userprofile_content %}
  <h2>{% trans "Avatar selection page" %}</h2>
  <p>{% trans "You have several options to select the image you want to use as avatar on your profile." %}</p>

  {% load avatars %}
  <div class="center">
        <img class="border" alt="{{ request.user }}" id="avatarimg" src="{% avatar 96 %}" />
    {% if user.get_profile.has_avatar %}<p id="avatardelete" style="text-align: center;"><a href="{{ request.path_info }}delete/" class="delavatar">{% trans "Delete" %}</a></p>{% endif %}
    </div>
    <div class="generic_form">
	<form action="{% url profile_edit_avatar %}" method="post" accept-charset="utf-8" enctype="multipart/form-data">
		<fieldset>
			<legend>{% trans "Choose the location of your avatar" %}</legend>
			<ul>
			<li>
				<label for="id_photo">{% trans "Select an image from disk" %}:</label>
				<p>{{ form.photo }}
				<input type="submit" value="{% trans 'Done' %}" />
				</p>
			</li>
			<li>
				<label for="id_url">{% trans "Select an image from a remote URL. Enter the URL in the field below and we'll retrieve the image for you" %}:</label>
				<p>{{ form.url }}
				<input type="submit" value="{% trans 'Done' %}" />
				</p>
			</li>
			{% if AVATAR_WEBSEARCH %}
  		<li>
    		<label for="id_search">{% trans "Search on Picasa Web" %}</label>
    		<p>
      		<input type="text" name="keyword" id="id_search" value="{{ keyword }}" />
      		<input type="submit" value="{% trans "Search" %}"/>
    		</p>

    		<div class="photos">
      		{% for thumb,url in images.items %}
      		<a href="{{ url }}"><img alt="photo{{ forloop.counter }}" src="{{ thumb }}" /></a>
      		{% endfor %}
    		</div>
			</li>
			{% endif %}
			</ul>
			{% if form.errors %}
			{% for error,desc in form.errors.items %}
			<p class="fielderrors">* {{desc|join:"; "}}</p>
			{% endfor %}
			{% endif %}
		</fieldset>
</form>
</div>
{% endblock %}
