Produits Entr'ouvert » Calebasse

{% extends "personnes/simple-form.html" %}

{% block extrascripts %}

{{ block.super }}

<script>

  $(function () {

    $('td.service ul').checkboxwidget({allCaption: "Tous"});

    $('td.periodicity').each(function (i, e) {

      var $divmenu = $('> div', e).divmenu();

      var $inputs = $('input, select', $divmenu);

      var f = function () {

        $('div .eo-divmenu-element', e).each(function (i, v) {

          if ($('select, input', v).val()) {

            console.log(i);

            $divmenu.divmenu('select', i);

          }

        });

      };

      f();

      $divmenu.on('change', 'select', function () {

        f();

      });

      var timeout;

      $divmenu.on('mouseenter', function () {

        $divmenu.divmenu('open');

      });

      $divmenu.on('mouseleave', function (e) {

        if ((typeof e.fromElement != 'undefined' && !e.fromElement.length) ||

          (typeof e.fromElement == 'undefined' && e.target.tagName != 'SELECT')) {

          $divmenu.divmenu('close');

        }

      });

      $inputs.focusin(function () {

        clearTimeout(timeout);

        $divmenu.divmenu('open');

      });

      $inputs.focusout(function () {

        timeout = setTimeout(function () {

          $divmenu.divmenu('close');

        }, 300);

      });

    });

  });

</script>

<style>

</style>

{% endblock %}

{% block appbar %}

<h2>Horaire du {{weekday}} de <span class="lastname">{{object.last_name}}</span> {{object.first_name}}</h2>

  <a href="..">Retour à la page de <span class="lastname">{{object.last_name}}</span> {{object.first_name}}</a>

{% endblock %}

{% block content %}

    <form method="post">

      <div id="form-content">

        {% csrf_token %}

        {% with formset=form %}

        {{ formset.management_form }}

        <p>Le format des dates est jj/mm/aaaa.</p>

        <table id="schedules" class="inline">

          <thead>

            <tr>

              <td><label class="required">Services</label></td>

              <td><label class="required">Heure de début</label></td>

              <td><label class="required">Heure de fin</label></td>

              <td><label class="required">Date de début</label></td>

              <td><label>Date de fin</label></td>

              <td><label>Périodicité</label></td>

              <td><label>Supprimer</label></td>

            </tr>

          </thead>

          <tbody id="timetables">

          {% for form in formset %}

            {% if form.non_field_errors %}

            <tr>

              <td colspan="6">

                <p class="error">{{ form.non_field_errors }}</p>

              </td>

             {% endif %}

            <tr class="timetable">

              <td class="service">{{ form.services }}{{ form.services.errors }}</td>

              <td class="timepicker">{{ form.start_time }}{{ form.start_time.errors }}</td>

              <td class="timepicker">{{ form.end_time }}{{ form.end_time.errors }}</td>

              <td id="start-{{ forloop.counter0 }}" class="datepicker" data-before-selector="#end-{{ forloop.counter0 }}" data-number-of-months="3">{{ form.start_date }}{{ form.start_date.errors }}</td>

              <td id="end-{{ forloop.counter0 }}" class="datepicker" data-after-selector="#start-{{ forloop.counter0 }}" data-number-of-months="3">{{ form.end_date }}{{ form.end_date.errors }}</td>

              <td>{{ form.periodicity }}{{ form.periodicity.errors }}</td>

              <td>{% if form.id.value %}{{ form.DELETE }}{% endif %}

                {% for field in form %}

                {% if field.is_hidden %}

                {{field}}

                {% endif %}

                {% endfor %}

              </td>

            </tr>

          {% endfor %}

          </tbody>

        </table>

        {% endwith %}

      </div>

      {% block buttons %}

      <button class="enable-on-change">Modifier</button>

      <button id="add-form">Ajouter une ligne</button>

      {% endblock %}

<!--      <a href="..">{% block back-link %}Retour{% endblock %}</a>-->

    </form>

{% endblock %}

{% block page-end %}

{{ block.super }}

<script>

  $(function () {

    var completions = [];

    for (var i = 8*60; i < 21*60; i += 15) {

      var completion = ''

      var hour = Math.floor(i/60);

      var minute = i % 60;

      var c = function (v) {

        if (v < 10) {

          return '0'+v;

        }

        return v;

      }

      completions.push(''+c(hour)+':'+c(minute));

    }

    $('.timepicker input').autocomplete({delay:0, source: completions, minLength: 0});

    function addForm() {

      var count = $('.timetable').length

      var new_row = $('.timetable:first').clone(false).get(0);

      $('input', new_row).val('');

      $('input, select', new_row).each(function (i, v) {

        v.name = v.name.replace('-0-', '-' + count + '-');

      });

      $('.delete input[type="checkbox"]', new_row).remove();

      $('*', new_row).each(function (i, v) {

        if (v.id) {

          v.id = v.id.replace('-0', '-' + count);

          if ($(v).data('before-selector')) {

            var old_value = $(v).data('before-selector');

            $(v).data('before-selector', old_value.replace('-0', '-' + count));

          }

          if ($(v).data('after-selector')) {

            var old_value = $(v).data('after-selector');

            $(v).data('after-selector', old_value.replace('-0', '-' + count));

          }

        }

      });

      $(new_row).appendTo($('#timetables'));

      $('#id_timetable_set-TOTAL_FORMS').val(count+1);

      window.calebasse_dialogs();

      return false;

    }

    $('#add-form').click(addForm);

  });

</script>

{% endblock %}