{# empty Twig template #}
{%extends 'layout.html.twig' %}
{% block stylesheets %}
  {{parent()}}
  <link href="{{ asset('css/competition.css') }}" media="screen" rel="stylesheet" type="text/css">
  <link href="{{ asset('css/trivial.css') }}" media="screen" rel="stylesheet" type="text/css">
{% endblock %}
{% block body %}
    {{ parent() }}
    
    <div class="container marketing lista">
       <div class="competition-return">
              <div class="competition-return-image"><img src="{{asset('img/competition-return.png')}}"></div>
              <a class="competition-return-text" href="{{ path('question_list',{id: area.id}) }}">V{% trans %}Go to questions{% endtrans %}</a>
            </div>  
      <div class="fondo col-xs-12">
            <div class="record-trivial-name col-xs-12">
              {{trinder.name}}
            </div>
            <div class="col-sm-3 record-trivial-img"><img class="trivial_img" src="{{ asset('images/trivials/'~trinder.image) }}"></div>
            <div class="col-sm-9 badge-trivial-medallas">{% trans %}EDIT QUESTIONS{% endtrans %}</div>
            <div class="trivial-edit-form col-xs-12">
                {{ form_start(form,{ 'attr' :{'role':'form', 'novalidate':'novalidate','onsubmit':'return validateForm();', 'class':'enable-form'} }) }}
                {% for qt in form.questionTraductions %}
                  {% if loop.index == 1 %}
            <fieldset>                              
                <div class="form-group col-xs-12 row competition-add-label edit-questions">
                        {{ form_label(qt.statement, "Statement"|trans(), {'label_attr': {'class': 'col-xs-12 col-sm-4'}}) }}
                        <div class="col-xs-12 col-sm-8">
                          {{ form_widget(qt.statement, { 'attr' : {'class': 'form-control', 'placeholder' : 'Enunciado'} }) }}
                          <span class="text-danger">{{ form_errors(qt.statement) }}</span>
                        </div>
                </div>
            </fieldset>
                 
                  
              {% for answer in form.answers %}
                {% for at in answer.answerTraductions %}
                  {% if loop.index == 1 %}
                    <div class="form-group col-xs-12 row competition-add-label edit-questions">                     
                      <div class="col-xs-12 col-sm-4"><label>{% trans %}Answer:{% endtrans %}</label></div> 
                      <div class="col-xs-12 col-sm-8">
                      {{ form_widget(at.answerText, { 'attr' : {'class': 'form-control', 'placeholder' : 'Respuesta'} }) }}
                      <span class="text-danger">{{ form_errors(at.answerText) }}</span>
                      <div class="col-xs-12 trivial-question-add-checkbox-text" >            
                          <label class="trivial-question-add-checkbox-container">{% trans %}Correct:{% endtrans %}
                              {{ form_widget(answer.answerValid,  {'attr':{'class': 'checkbox-answer'}}) }}
                              <span class="checkmark"></span>
                            </label>
                          <span class="text-danger">{{ form_errors(answer.answerValid) }}</span>
                      </div> 
                    </div>
                   </div>                   
                    {{ form_widget(at.save,{ 'label' : 'Create Answer', 'attr': { 'class': 'btn btn-success hidden' }}) }}
                  {% else %}
                    {{ form_widget(at.answerText,{ 'label' : 'Create Answer', 'attr': { 'class': 'btn btn-success hidden' }}) }}
                    {{ form_widget(at.save,{ 'label' : 'Create Answer', 'attr': { 'class': 'btn btn-success hidden' }}) }}
                  {% endif %}
                {% endfor %}
                  {{ form_widget(answer.save,{ 'label' : 'Create Answer', 'attr': { 'class': 'btn btn-success hidden' }}) }}
            {% endfor %}
              <div id="error-message" class="col-xs-12 alert alert-danger" style="display:none"></div>
              {% if question.type == "TINDER"%}
                <div class="form-group col-xs-12 row competition-add-label edit-questions">
                    {{ form_label(form.imageFile, "Image"|trans(), {'label_attr': {'class': 'col-xs-12 col-sm-4'}}) }}
                    <div class="col-xs-12 col-sm-8">
                      {{ form_widget(form.imageFile, { 'attr' : {'class': 'form-control', 'placeholder' : 'Enunciado'} }) }}
                      <span class="text-danger">{{ form_errors(form.imageFile) }}</span>
                    </div>
                  </div> 

                  <div class="form-group col-xs-12 row competition-add-label edit-questions">
                    {{ form_label(qt.feedback, "Feedback"|trans(), {'label_attr': {'class': 'col-xs-12 col-sm-4'}}) }}
                    <div class="col-xs-12 col-sm-8">
                      {{ form_widget(qt.feedback, { 'attr' : {'class': 'form-control', 'placeholder' : 'Enunciado'} }) }}
                      <span class="text-danger">{{ form_errors(qt.feedback) }}</span>
                    </div>
                  </div>
                {% else %}
                  {{ form_widget(qt.feedback,{ 'label' : 'Feedback', 'attr': { 'class': 'btn btn-success hidden' }}) }}
                {% endif %}    
                {{ form_widget(qt.save,{ 'label' : 'Create Answer', 'attr': { 'class': 'btn btn-success hidden' }}) }}
              {% else %}
                  {{ form_widget(qt.statement, { 'attr' : {'class': 'hidden'} }) }}
                  {{ form_widget(qt.feedback, { 'attr' : {'class': 'hidden'} }) }}
                  {{ form_widget(qt.save, { 'attr' : {'class': 'hidden'} }) }}
              {% endif %}
              {% endfor %}
              </div>
               <div class="col-xs-12 trivial-edit-buttons">
                <a href="{{ path('question_list',{id: area.id})}}"><div class="col-md-2 col-md-offset-4 btn trivial-edit-cancelar">{% trans %}Cancel{% endtrans %}</div></a>              
                {{ form_widget(form.save,{ 'label' : 'Save and return'|trans(), 'attr': { 'class': 'btn trivial-edit-update col-md-2 col-md-offset-1 gametool-btn-disabled btn-disabled', 'disabled':'true' }}) }} 
                </div>     
                  
                {{ form_end(form) }}           
    
  </div>
</div>
  {% endblock %}
  {% block javascripts %}
  {{parent()}}
  <script src="{{ asset('js/validateQuestion.js') }}" ></script>
{% endblock %}