{% extends 'generic/bulk_edit.html' %}
{% load helpers %}
{% load form_helpers %}
{% load render_table from django_tables2 %}
{% load i18n %}

{% block content %}

  {# Edit form #}
  <div class="tab-pane show active" id="edit-form" role="tabpanel" aria-labelledby="edit-form-tab">
    <form action="" method="post" class="form form-horizontal mt-5">

      {% csrf_token %}
      {% if request.POST.return_url %}
        <input type="hidden" name="return_url" value="{{ request.POST.return_url }}" />
      {% endif %}
      {% for field in form.hidden_fields %}
        {{ field }}
      {% endfor %}

      {% if form.fieldsets %}

        {# Render grouped fields according to declared fieldsets #}
        {% for fieldset in form.fieldsets %}
          {% render_fieldset form fieldset %}
        {% endfor %}

        {# Render tag add/remove fields #}
        {% if form.add_tags and form.remove_tags %}
          <div class="field-group mb-5">
            <div class="row">
              <h5 class="col-9 offset-3">{% trans "Tags" %}</h5>
            </div>
            {% render_field form.add_tags %}
            {% render_field form.remove_tags %}
          </div>
        {% endif %}

        {# Render custom fields #}
        {% if form.custom_fields %}
          <div class="field-group mb-5">
            <div class="row">
              <h5 class="col-9 offset-3">{% trans "Custom Fields" %}</h5>
            </div>
            {% render_custom_fields form %}
          </div>
        {% endif %}

        {# Render comments #}
        {% if form.comments %}
          <div class="field-group mb-5">
            <div class="row">
              <h5 class="col-9 offset-3">{% trans "Comments" %}</h5>
            </div>
            {% render_field form.comments bulk_nullable=True %}
          </div>
        {% endif %}

      {% else %}

        {# Render all fields #}
        {% for field in form.visible_fields %}
          {% if field.name in form.nullable_fields %}
            {% render_field field bulk_nullable=True %}
          {% else %}
            {% render_field field %}
          {% endif %}
        {% endfor %}

      {% endif %}

      <div class="text-end">
        <a href="{{ return_url }}" class="btn btn-outline-secondary protect-btn">{% trans "Cancel" %}</a>
        <button type="submit" name="_apply" class="btn btn-primary protect-btn">{% trans "Apply" %}</button>
      </div>

    </form>
  </div>

  {# Selected objects list #}
  <div class="tab-pane" id="object-list" role="tabpanel" aria-labelledby="object-list-tab">
    <div class="card">
      <div class="card-body table-responsive">
        {% render_table table 'inc/table.html' %}
      </div>
    </div>
  </div>

  <script>
    const projectButtons = document.querySelectorAll('.protect-btn');

    projectButtons.forEach(button => {
    button.addEventListener('click', protectButton);
    });
    function protectButton(event) {
    event.target.classList.add('disabled');
    event.target.textContent = 'Please wait'
    }
</script>
{% endblock content %}