{% extends 'ddm_core/page_with_form.html' %}

{% load static %}

{% block page_title %}Edit {{ question_type }}{% endblock page_title %}

{% block main_heading %}Edit "{{ object.name }}"{% endblock main_heading %}

{% block sub_heading %}
  <p>{{ question_type }}</p>
{% endblock sub_heading %}

{% block form_content %}

  {% if form.errors or item_formset.errors or scale_formset.errors %}
    {% include "ddm_core/form_components/_general_form_errors.html" with override_standard_errors=True %}
  {% endif %}

  {# General Settings #}
  <div class="ddm-section-container ddm-section-collapsible-form">
    {% with content_include_path="ddm_questionnaire/form_sections/general_settings.html" %}
      {% include "ddm_core/components/accordion_card.html" with is_expanded=True accordion_id="BaseSettings" accordion_title="Base Settings" %}
    {% endwith %}
  </div>

  {# Display Options #}
  {% if question_type == "Open Question"  %}
    <div class="ddm-section-container ddm-section-collapsible-form">
      {% with content_include_path="ddm_questionnaire/form_sections/display_settings.html" %}
        {% with accordion_description="Configure how the question is displayed to participants" %}
          {% include "ddm_core/components/accordion_card.html" with accordion_id="DisplaySettings" accordion_title="Display Settings" %}
        {% endwith %}
      {% endwith %}
    </div>
  {% endif %}

  {# Input Settings #}
  {% if question_type != "Text Block"  %}
    <div class="ddm-section-container ddm-section-collapsible-form">
      {% with content_include_path="ddm_questionnaire/form_sections/input_settings.html" %}
        {% with accordion_description="Configure input restrictions" %}
          {% include "ddm_core/components/accordion_card.html" with accordion_id="InputSettings" accordion_title="Input Settings" %}
        {% endwith %}
      {% endwith %}
    </div>
  {% endif %}

  {# Item Configuration #}
  {% if item_formset  %}
    <div class="ddm-section-container ddm-section-collapsible-form ">
      {% with content_include_path="ddm_questionnaire/form_sections/item_configuration.html" %}
        {% include "ddm_core/components/accordion_card.html" with accordion_id="QuestionItemsConfig" accordion_title="Question Items" %}
      {% endwith %}
    </div>
  {% endif %}

  {# Scale Configuration #}
  {% if scale_formset %}
    <div class="ddm-section-container ddm-section-collapsible-form">
      {% with content_include_path="ddm_questionnaire/form_sections/scale_configuration.html" %}
        {% with accordion_description="Edit response scale" %}
          {% include "ddm_core/components/accordion_card.html" with accordion_id="ScaleConfig" accordion_title="Scale" %}
        {% endwith %}
      {% endwith %}
    </div>
  {% endif %}

  {# Filter Configuration #}
  <div class="ddm-section-container ddm-section-collapsible-form">
    {% with content_include_path="ddm_questionnaire/form_sections/filter_configuration.html" %}
      {% with accordion_description="Conditionally hide this question based on other responses" %}
        {% include "ddm_core/components/accordion_card.html" with accordion_id="FilterConfig" accordion_title="Filter Conditions" %}
      {% endwith %}
    {% endwith %}
  </div>

  {% include "ddm_questionnaire/form_sections/delete.html" %}

{% endblock form_content %}

{% block scripts %}
  {{ block.super }}
  <script src="{% static 'ddm_datadonation/js/accordion-form-error-indicator.js' %}"></script>
  <script src="{% static 'ddm_questionnaire/js/question-item-form-helper.js' %}"></script>
  <script src="{% static 'ddm_questionnaire/js/scale-form-helper.js' %}"></script>
  <script src="{% static 'ddm_core/js/bootstrap-popovers.js' %}"></script>
{% endblock scripts %}