{% extends 'base.html.twig' %}

{% block stylesheets %}
    {{ parent() }}

    <style type="text/css">
        .dot {
          height: 25px;
          width: 25px;
          background-color: #c7a527;
          color: #fff;
          font-weight: bold;
          border-radius: 50%;
          display: inline-block;
          text-align: center;
        }
    </style>
{% endblock  %}

{% block body %}
    <div class="messaging">
      <div class="inbox_msg">
          <div class="inbox_people">
              <div class="inbox_chat">
                  <div class="chat_list active_chat">
                      <div class="chat_people">
                        <div class="chat_img"> <img src="{{ asset('template/img/a2.jpg') }}" alt="sunil"> </div>
                        <div class="chat_ib">
                          <h5> 
                              {{ chatBot.botname }} <span class="chat_date"> {{ chatBot.createdAt|date('d/m/Y') }} </span>
                          </h5>
                          <p>{{ chatBot.description }}</p>
                          <p>
                            <a style="font-size: 12px;" target="_blank" href="{{ path('view_answers', {'botlink':chatBot.botLink} ) }}"> Voir les r&eacute;ponses </a> 
                          </p>
                          <p>
                            Lien public : <a style="font-size: 9px;" target="_blank" href="#"> {{ url('chat_whith_bot', {'botlink':chatBot.botLink} ) }} </a> 
                          </p>
                        </div>
                      </div>
                  </div>
                  <div class="chat_list">
                      <div class="chat_people">
                        <div class="chat_ib">
                          <p> <span class="dot"> &star; </span> &nbsp;{{ chatBot.starterMsg }}</p>
                        </div>
                      </div>
                  </div>
                  {% for question in questions %}
                      <div class="chat_list">
                          <div class="chat_people">
                            <div class="chat_ib">
                              <p>
                                <span class="dot"> {{ question.order }} </span> &nbsp;{{ question.title }}

                                {% if not question.answerAsInput %}
                                  <a style="font-size: 12px;float: right;" href="{{ path('answer_new', {'question':question.id}) }}"> Options</a>
                                  <a style="font-size: 12px;float: right;" href="{{ path('question_edit', {'question':question.id}) }}">&nbsp;|&nbsp;</a>
                                  {% else %}
                                {% endif %}

                                <a style="font-size: 12px;float: right;" href="{{ path('question_edit', {'question':question.id}) }}"> Editer </a>

                              </p>
                            </div>
                          </div>
                      </div>
                  {% endfor %}
                  <div class="chat_list">
                      <div class="chat_people">
                        <div class="chat_ib">
                          <p> <span class="dot"> &#135; </span> &nbsp;{{ chatBot.closingMsg }}</p>
                        </div>
                      </div>
                  </div>
              </div>
          </div>
          <div class="mesgs" style="padding-top: 0px;">
              <div class="heading" style="border-bottom: solid 1px silver;">
                  <h3> Ajouter une question </h3>
              </div>
              <br/>
              {{ form_start(form) }}
                  {{ form_widget(form) }}                        
                  <div class="col-md-12">
                      <button class="btn btn-success"> Enregistrer </button>                            
                  </div>
              {{ form_end(form) }}
          </div>
      </div>
    </div>
{% endblock %}
