<div class="favorite-places">
  <h3>Mes données Toodego</h3>
  <h3 class="dim">Mes lieux favoris</h3>
  <ul>
  {% for value in json.data %}
  <li><span class="place-info">{% if value.content.nom %}{{value.content.nom}} : {%endif %}{{ value.text }}</span>
    <form method="POST" class="delete-place" action="{{ site_base }}{% url 'combo-public-ajax-page-cell' page_pk=cell.page.id cell_reference=cell.get_reference %}">
      {% csrf_token %}
      <input type="hidden" name="action" value="delete"/>
      <input type="hidden" name="id" value="{{ value.id }}"/>
      <button title="Supprimer" class="icon-delete"><span class="sr-only">Supprimer</span></button>
    </form>
  <div class="edit-place">
    <form class="quixote" method="POST" action="{{ site_base }}{% url 'combo-public-ajax-page-cell' page_pk=cell.page.id cell_reference=cell.get_reference %}">
      {% csrf_token %}
      <input type="hidden" name="action" value="update"/>
      <input type="hidden" name="id" value="{{ value.id }}"/>
      <div class="grid-1-1">
        <label for="place_{{forloop.counter}}_nom">Nom du lieu <span title="Ce champ est obligatoire." class="required">*</span></label>
        <input type="text" required id="place_{{forloop.counter}}_nom" name="nom" placeholder="ex: mon domicile, mon travail" value="{{ value.content.nom }}">
      </div>
      <div class="grid-1-1">
        <label for="place_{{forloop.counter}}_adresse">Adresse <span title="Ce champ est obligatoire." class="required">*</span></label>
        <input type="text" required id="place_{{forloop.counter}}_adresse" name="adresse" value="{{ value.content.adresse }}">
      </div>
      <div class="newline grid-1-4">
        <label for="place_{{forloop.counter}}_codepostal">Code postal <span title="Ce champ est obligatoire." class="required">*</span></label>
        <input type="text" required id="place_{{forloop.counter}}_codepostal" name="codepostal" value="{{ value.content.codepostal }}">
      </div>
      <div class="grid-3-4 ville">
        <label for="place_{{forloop.counter}}_ville">Ville <span title="Ce champ est obligatoire." class="required">*</span></label>
        <input type="text" required id="place_{{forloop.counter}}_ville" name="ville" value="{{ value.content.ville }}">
      </div>
      <div class="newline buttons">
        <button class="icon-checkmark"><span class="sr-only">Enregistrer les changements</span></button>
      </div>
    </form>
  </div>

  </li>
  {% endfor %}
  <li><a class="pk-button new-place">Ajouter un lieu favori</a></li>
  </ul>
  <div class="new-place">
    {% include "combo/json/includes/new-place-form.html" with button_label="Ajouter cette adresse" %}
  </div>
</div>
<script>
$(function() {
  $('a.new-place').on('click', function() {
    $('div.new-place').toggleClass('shown');
    if ($('div.new-place').hasClass('shown')) {
      $('.edit-place').hide();
      $('div.new-place input[name=nom]').focus();
    }
    return false;
  });
  if ($('.favorite-places li').length == 1) {
    $('a.new-place').trigger('click');
  }
  $('.place-info').on('click', function() {
    $(this).parent('li').find('.edit-place').toggle();
  });
});
</script>
