{% import "@core/multidelete-macro.twig" as multidelete %}

{{ include_javascript('javascripts/vendor/datatables-full/jquery.dataTables.min.js') }}
{{ include_css('styles/vendor/datatables-full/dataTables.bootstrap.min.css') }}

<div id='comments-table-action'>
  {# order on signuptime desc #}
  <table class="table table-striped" data-order='[[ 0, "desc" ]]'>
    <thead>
      <tr>
        {{ multidelete.insertSelectAll('comments-table-action','top') }}
        <th>{{ _t('COMMENT_DATE') }}</th>
        {# mmmmmmm because https://datatables.net/reference/option/columns.contentPadding #}
        <th data-content-padding="mmmmmmmmmmmmmmmmmmmmmmmmmm">{{ _t('COMMENT_CONTENT') }}</th>
        <th data-class-name="comments-table-break-word-column">{{ _t('COMMENT_USER') }}</th>
        <th data-class-name="comments-table-break-word-column">{{ _t('COMMENT_TAG') }}</th>
        <th data-class-name="comments-table-break-word-column">{{ _t('COMMENT_ON_PAGE') }}</th>
        <th>{{ _t('MODIFY') }}</th>
        <th>{{ _t('DELETE') }}</th>
      </tr>
    </thead>
    <tbody>
      {% for com in comments %}
        <tr>
          {{ multidelete.insertSelectLine(
                'comments-table-action',
                com.tag,
                not hasAcl(com.owner),
                'comments') }}
          <td>{{ com.time }}</td>
          <td>{{ format(com.body)|raw  }}</td>
          <td>{{ com.owner }}</td>
          <td>{{ com.tag }}</td>
          <td>{% set tagAnchor = com.parentTag ?? com.comment_on %}<a class="new-window" href="{{ url({tag:tagAnchor}) }}">{{ tagAnchor }}</a></td>
          <td>
            {# if admin or comment's owner #}
            {% if hasAcl(com.owner) %} 
              <a href="{{ url({tag:com.tag,handler:'edit'}) }}"
                class="btn btn-sm btn-warning new-window" role="button"
                title="{{ _t('MODIFY') }} {{ com.tag }}">
                {{ _t('MODIFY') }}
              </a>
            {% endif %}
          </td>
          <td>
            {% if hasAcl(com.owner) %}
              <a 
                data-toggle="modal"
                role="button"
                href="#commentsTableDeleteModal"
                class="btn btn-sm btn-danger" 
                data-name="{{ com.tag }}"
                title="{{ _t('COMMENT_DELETE') }}">
                {{ _t('DELETE') }}
              </a>
            {% endif %}
          </td>
      {% endfor %}
    </tbody>
    <tfooter>
      <tr>
        {{ multidelete.insertSelectAll('comments-table-action','bottom') }}
        <th></th>
        <th></th>
        <th></th>
        <th></th>
        <th></th>
        <th></th>
      </tr>
    </tfooter>
  </table>
  {{ multidelete.insertButton('comments-table-action','comments') }}
</div>

<div class="modal fade" 
  id="commentsTableDeleteModal" 
  tabindex="-1" 
  role="dialog" 
  aria-labelledby="commentsTableDeleteModalLabel" 
  aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h3 id="commentsTableDeleteModalLabel">{{ _t('COMMENT_DELETE') }} : <span id="commentToDelete"></span></h3>
      </div>
      <div class="modal-body">
        <div class="alert alert-warning">
          {{ _t('COMMENT_CONFIRM_DELETE') }}
        </div>
        <button class="btn btn-sm btn-warning start-btn-delete-comment">{{ _t('DELETE') }}</button>
        <br/><br/>
        <div class="multi-delete-results"></div>
      </div>
      <div class="modal-footer">
        <div class="progressbar progress">
          <div class="progress-bar" role="progressbar"
            style="width: 0%;"
            aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">
          </div>
        </div>
      </div>
    </div>{# .modal-content #}
  </div>{# .modal-dialog #}
</div>