{% extends "planner/base.html" %}
{% block title %}{{ title }}{% endblock %}
{% block content %}
<div class="page-head"><h1>{% if plan %}{{ plan.name }}{% else %}New plan{% endif %}</h1>
  {% if plan %}<a class="btn" href="{% url 'plan_detail' plan.pk %}">View results</a>{% endif %}</div>
<ol class="steps">
  {% for key, label in sections %}
    <li class="{% if key == section %}current{% endif %}">
      {% if plan %}<a href="{% url 'plan_edit' plan.pk key %}">{{ label }}</a>{% else %}<span>{{ label }}</span>{% endif %}
    </li>
  {% endfor %}
</ol>
<form method="post" class="card">
  {% csrf_token %}
  <h2>{{ title }}</h2>
  <p class="muted">{{ help }}</p>
  {% if form %}
    {{ form.non_field_errors }}
    <div class="grid-form">
      {% for field in form %}
      <div class="field {% if field.errors %}has-error{% endif %}">
        <label for="{{ field.id_for_label }}">{{ field.label }}</label>
        {{ field }}
        {% if field.help_text %}<small>{{ field.help_text }}</small>{% endif %}
        {{ field.errors }}
      </div>
      {% endfor %}
    </div>
  {% else %}
    {{ formset.management_form }}
    {{ formset.non_form_errors }}
    {% for f in formset %}
      <fieldset class="row-form">
        {{ f.non_field_errors }}
        {% for hidden in f.hidden_fields %}{{ hidden }}{% endfor %}
        <div class="grid-form">
          {% for field in f.visible_fields %}
          <div class="field {% if field.errors %}has-error{% endif %}">
            <label for="{{ field.id_for_label }}">{{ field.label }}</label>
            {{ field }}
            {{ field.errors }}
          </div>
          {% endfor %}
        </div>
      </fieldset>
    {% endfor %}
    <p class="muted">Use the blank row at the bottom to add an entry; tick Delete to remove one.</p>
  {% endif %}
  <div class="actions">
    <button class="btn" name="save">Save</button>
    {% if next_section %}<button class="btn primary" name="save_next">Save and continue</button>{% endif %}
    {% if plan %}<button class="btn primary" name="save_finish">Save and view results</button>{% endif %}
  </div>
</form>
{% endblock %}