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

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

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

{% block main_form_header %}Question Configuration{% endblock %}

{% block main_form %}
<form method='post'>
  {% csrf_token %}
  {{ form.media }}

  <div class="question-section-container">
    <p class="question-section-heading">Internal Organisation</p>
    {% for field in form %}
    {% if field.name in "name,variable_name,blueprint" %}
      <p>
        {{ field.label_tag }}
        {{ field.errors }}
        {{ field }}
        <span class="helptext">{{ field.help_text }}</span>
      </p>
    {% endif %}
    {% endfor %}
  </div>

  <div class="question-section-container">
    <p class="question-section-heading">Display Options</p>
    {% for field in form %}
    {% if field.name in "page,index,text" %}
      <p>
        {{ field.label_tag }}
        {{ field.errors }}
        {{ field }}
        <span class="helptext">{{ field.help_text }}</span>
      </p>
    {% endif %}
    {% endfor %}
  </div>

  {% if object.question_type != "transition"  %}
  <div class="question-section-container">
    <p class="question-section-heading">Validation</p>
    {% for field in form %}
    {% if field.name in "required,input_type,max_input_length,display" %}
      <p>
        {{ field.label_tag }}
        {{ field.errors }}
        {{ field }}
        <span class="helptext">{{ field.help_text }}</span>
      </p>
    {% endif %}
    {% endfor %}
  </div>
  {% endif %}

  {% if object.question_type != "transition"  %}
      <div class="question-section-container">
      <p class="question-section-heading">Item Configuration</p>
      {% for field in form %}
      {% if field.name in "randomize_items,show_scale_headings,multi_item_response" %}
        <p>
          {{ field.label_tag }}
          {{ field.errors }}
          {{ field }}
          <span class="helptext">{{ field.help_text }}</span>
        </p>
      {% endif %}
      {% endfor %}
      </div>
  {% endif %}

  <input class="ddm-btn" type="submit" value="Save changes">

  {% block cancel %}
    <p>
      <a href="{% url 'ddm_questionnaire:overview' project_url_id %}"><i class="bi bi-arrow-left-short"></i> Back</a>
    </p>
  {% endblock %}

</form>
{% endblock %}


{% block main_bottom %}
{% if object.question_type != "transition"  %}
  {% if object.question_type == "open" and not object.multi_item_response %}
  {% else %}
    <div class="ddm-admin-section-body">
      <div class="question-extra-section">
        <div class="question-section-heading mb-3">Question Items</div>
        <table class="table table-sm">
        {% for item in object.questionitem_set.all %}
          {% if forloop.first %}
          <thead>
          <tr>
            <th style="width: 1%;" class="pe-4">Index</th>
            {% if object.question_type == "semantic_diff" %}
              <th>Label</th>
              <th>Label Right</th>
            {% else %}
              <th>Label</th>
            {% endif %}
            <th>Value</th>
            <th>Randomize</th>
            <th>Filter Conditions</th>
          </tr>
          </thead>
          {% endif %}
          <tr>
            <td>{{ item.index }}</td>
            {% if object.question_type == "semantic_diff" %}
              <td>{{ item.label }}</td>
              <td>{{ item.label_alt }}</td>
            {% else %}
              <td>{{ item.label }}</td>
            {% endif %}
            <td>{{ item.value }}</td>
            <td>{{ item.randomize }}</td>
            <th><a href="{% url 'ddm_questionnaire:item_filters' project_url_id object.question_type object.pk item.pk %}">Edit Filter Conditions</a></th>
          </tr>
          {% empty %}
          <tr><td>No items defined.</td></tr>
        {% endfor %}
        </table>

        <p><a class="ddm-btn" href="{% url 'ddm_questionnaire:items' project_url_id object.question_type object.pk %}">Edit Items</a></p>
        <p class="helptext">Make sure to <b>save any changes of the question configuration</b> before editing the items.</p>
      </div>
    </div>
  {% endif %}

  {% if object.question_type == "semantic_diff" or object.question_type == "matrix" %}
    <div class="ddm-admin-section-body">
      <div class="question-extra-section">
        <div class="question-section-heading mb-3">Scale Configuration</div>
        <table class="table table-sm">
        {% for point in object.scalepoint_set.all %}
          {% if forloop.first %}
          <thead>
          <tr>
            <th style="width: 1%;" class="pe-4">Index</th>
            <th>Input Label</th>
            <th>Heading Label</th>
            <th>Value</th>
          </tr>
          </thead>
          {% endif %}
          <tr>
            <td>{{ point.index }}</td>
            <td>{% if point.input_label is not None %}{{ point.input_label }}{% endif %}</td>
            <td>{% if point.heading_label is not None %}{{ point.heading_label }}{% endif %}</td>
            <td>{{ point.value }}</td>
          </tr>
          {% empty %}
          <tr><td>No scale points defined.</td></tr>
        {% endfor %}
        </table>
        <p><a class="ddm-btn" href="{% url 'ddm_questionnaire:scale' project_url_id object.question_type object.pk %}">Edit Scale Points</a></p>
        <p class="helptext">Make sure to <b>save any changes of the question configuration</b> before editing the scale.</p>
      </div>
    </div>
  {% endif %}

  <div class="ddm-admin-section-body">
    <div class="question-extra-section">
      <div class="question-section-heading mb-3">Filter Configuration</div>
      <p>Hide question if:</p>
      <table class="table table-sm">
        {% for filter in object.filter_conditions.all %}
          {% if forloop.first %}
          <thead>
          <tr>
            <th style="width: 1%;" class="pe-4">Index</th>
            <th>Combinator</th>
            <th>Source</th>
            <th>Operator</th>
            <th>Condition Value</th>
          </tr>
          </thead>
          {% endif %}
          <tr>
            <td>{{ filter.index }}</td>
            <td>{{ filter.combinator }}</td>
            <td>{{ filter.source_object.get_varname }}</td>
            <td>{{ filter.condition_operator }}</td>
            <td>{% if filter.condition_value is not None %}{{ filter.condition_value }}{% endif %}</td>
          </tr>
          {% empty %}
          <tr><td>No filter conditions defined.</td></tr>
        {% endfor %}
        </table>

      <p><a class="ddm-btn" href="{% url 'ddm_questionnaire:question_filters' project_url_id object.question_type object.pk %}">Edit Filter Conditions</a></p>
      <p class="helptext">Make sure to <b>save any changes of the question configuration</b> before editing the filters.</p>
    </div>
  </div>

  {% if object.question_type == "open" and not object.multi_item_response %}
  {% else %}
    <div class="mt-3">
      <a href="{% url 'ddm_questionnaire:overview' project_url_id %}"><i class="bi bi-arrow-left-short"></i> Back</a>
    </div>
  {% endif %}
{% endif %}
{% endblock %}


{% block breadcrumbs %}
<a href="{% url 'ddm_projects:list' %}">Projects</a> /
<a href="{% url 'ddm_projects:detail' project_url_id %}">"{{ project.name|truncatechars:15 }}" Project</a> /
<a href="{% url 'ddm_questionnaire:overview' project_url_id %}">Questionnaire</a> /
Edit Question
{% endblock %}