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

{% block title %}Debate{% endblock %}

{% block body %}

  <h3>Investor forum - New topic</h3>
<br>
  {{ form_start(form) }}
  {{ form_row(form.subject) }}
  {{ form_row(form.content) }}

  <hr>
  <h2>Attachment</h2>

  <ul class="attachments"  data-prototype="{{ form_widget(form.attachments.vars.prototype)|e('html_attr') }}">
    {% for attachment in form.attachments %}

      <li><p>{{ attachment.vars.value.attachmentName }}</p> {{ form_row(attachment.attachmentFile ) }}</li>
    {% endfor %}
  </ul>
  {{ form_widget(form) }}

  <button type="submit" class="btn btn-primary">Save</button>
  <br>
  {{ form_end(form) }}

{% endblock %}

{% block datatable %}{% endblock %}

{% block javascripts %}
  {{ parent() }}

  <script src="https://cdn.ckeditor.com/4.14.0/standard/ckeditor.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/bs-custom-file-input/dist/bs-custom-file-input.min.js"></script>

  <script>
    var $collectionHolder;

    CKEDITOR.replaceClass = 'wysiwyg' ;
    var $addAttachmentButton = $('<button type="button" class=" btn btn-info add_attachment_link">Add an attachment</button>');

    var $newLinkLi = $('<div><br/></div>').append($addAttachmentButton);
    $(document).ready(function() {

      bsCustomFileInput.init();

      $collectionHolder = $('ul.attachments');
      $collectionHolder.append($newLinkLi);
      $collectionHolder.data('index', $collectionHolder.find('input').length);

      $collectionHolder.find('li').each(function() {
        addTagFormDeleteLink($(this));
      });

      $addAttachmentButton.on('click', function(e) {
        addAttachmentForm($collectionHolder, $newLinkLi);
        bsCustomFileInput.init();
      });

      function addAttachmentForm($collectionHolder, $newLinkLi) {
        var prototype = $collectionHolder.data('prototype');
        var index = $collectionHolder.data('index');

        var newForm = prototype;
        newForm = newForm.replace(/__name__/g, index);
        $collectionHolder.data('index', index + 1);

        var $newFormLi = $('<li class="my-3"></li>').append(newForm);
        $newLinkLi.before($newFormLi);

        bsCustomFileInput.init();
        addTagFormDeleteLink($newFormLi);
      }

      function addTagFormDeleteLink($attachmentFormLi) {
        var $removeFormButton = $('<button class="btn btn-danger" type="button">Delete this attachment</button>');
        $attachmentFormLi.append($removeFormButton);

        $removeFormButton.on('click', function(e) {
          $attachmentFormLi.remove();
        });
      }
    });


  </script>
{% endblock %}