{% load spirit_tags i18n humanize %}

<div class="comments_list">
  {% for c in comments %}
  {% if c.action or c.is_removed %}
  <div
    class="comments_list__item js-comment"
    id="c{{forloop.counter0|add:comments.start_index }}"
    data-number="{{ forloop.counter0|add:comments.start_index }}"
    data-pk="{{ c.pk }}"
  >
    <div class="comments_list__item__badge">
      {% if c.is_removed %}
        <i class="fa fa-trash-o"></i>
      {% elif c.action == c.MOVED %}
        <i class="fa fa-suitcase"></i>
      {% elif c.action == c.CLOSED %}
        <i class="fa fa-lock"></i>
      {% elif c.action == c.UNCLOSED %}
        <i class="fa fa-unlock-alt"></i>
      {% elif c.action == c.PINNED %}
        <i class="fa fa-thumb-tack"></i>
      {% elif c.action == c.UNPINNED %}
        <i class="fa fa-thumb-tack fa-rotate-180"></i>
      {% endif %}
    </div>
    {% spaceless %}
      <div class="comments_list__item__info">
        <span>{% get_comment_action_text c  %}</span>
        {% if c.is_removed and user.st.is_moderator %}
          <a class="js-post" href="{% url "spirit:comment:undelete" c.pk %}"
          ><i class="fa fa-trash"></i> {% trans "undelete" %}</a>
          <a href="#">{% trans "show" %} <i class="fa fa-chevron-down"></i></a>
        {% endif %}
      </div>
    {% endspaceless %}
    {% if c.is_removed and user.st.is_moderator %}
      <div class="comments_list__item__comment" style="display: none;">
        {% post_render_comment comment=c %}
      </div>
    {% endif %}
  </div>
  {% else %}
  <div
    class="comments_list__comment js-comment"
    id="c{{forloop.counter0|add:comments.start_index }}"
    data-number="{{ forloop.counter0|add:comments.start_index }}"
    data-pk="{{ c.pk }}"
  >
    <div class="comment__img">
      {% include "spirit/comment/_avatar.html" with u=c.user only %}
    </div>
    <div class="comment__info">
      {% spaceless %}
      <div class="comment__info__username">
        <a
          class="comment__info__username__link"
          href="{{ c.user.st.get_absolute_url }}"
        ><span>{{ c.user.st.nickname }}</span>
          {% if c.user.st.is_administrator %}
            <i class="fa fa-shield is-admin" title="{% trans "Admin" %}"></i>
          {% elif c.user.st.is_moderator %}
            <i class="fa fa-shield is-mod" title="{% trans "Moderator" %}"></i>
          {% endif %}
          {% if c.user.pk == topic.user_id %}
            <i class="fa fa-microphone is-owner" title="{% trans "Original Poster" %}"></i>
          {% endif %}
        </a>
        <div class="comment__info__username__realname">{{ c.user.get_full_name }}</div>
      </div>
      {% endspaceless %}
      {% spaceless %}
        <ul class="comment__info__date js-move-comment-checkbox-list">
          {% if c.modified_count > 0 %}
            <li><a href="{% url "spirit:comment:history:detail" comment_id=c.pk %}"
            ><i class="fa fa-pencil"></i> {{ c.modified_count }}</a></li>
          {% endif %}
          <li title="{{ c.date }}">{{ c.date|shortnaturaltime }}</li>
        </ul>
      {% endspaceless %}
    </div>
    <div class="comment__text js-comment-text">
      {% post_render_comment comment=c %}
    </div>
    <div class="comment__footer js-tabs-container">
      {% spaceless %}
      <ul class="comment__actions">
        {% if user.is_authenticated %}
          {% if user.st.is_moderator %}
            <li><a class="js-post" href="{% url "spirit:comment:delete" c.pk %}"
            ><i class="fa fa-trash"></i> {% trans "delete" %}</a></li>
          {% endif %}

          <li><a href="{% url "spirit:comment:flag:create" c.pk %}"
          ><i class="fa fa-flag"></i> {% trans "report" %}</a></li>
        {% endif %}

        <li><a class="js-tab" href="#" data-related=".js-share-{{ c.pk }}"
        ><i class="fa fa-share-alt"></i> {% trans "share" %}</a></li>

        {% if user.is_authenticated %}
          {% if c.like %}
            <li class="comment-like"><a
              class="js-like"
              href="{% url "spirit:comment:like:delete" c.like.pk %}"
              data-count="{{ c.likes_count }}"
            ><i class="fa fa-heart"></i> {% trans "remove like" %} ({{ c.likes_count }})</a></li>
          {% else %}
            {% if c.user.pk != user.pk  %}
              <li class="comment-like"><a
                class="js-like like"
                href="{% url "spirit:comment:like:create" c.pk %}"
                data-count="{{ c.likes_count }}"
              ><i class="fa fa-heart"></i> {% trans "like" %} ({{ c.likes_count }})</a></li>
            {% else %}
              <li class="comment-like"><i class="fa fa-heart"></i> ({{ c.likes_count }})</li>
            {% endif %}
          {% endif %}

          {% if user.st.is_moderator or c.user.pk == user.pk %}
            <li><a href="{% url "spirit:comment:update" pk=c.pk %}"
            >{% trans "edit" %}</a></li>
          {% endif %}

          {% if c.user.pk != user.pk %}
            <li><a href="{% url "spirit:comment:publish" topic_id=topic.pk pk=c.pk %}"
            >{% trans "quote" %}</a></li>
            <li><a href="#reply" class="js-reply-button" data="@{{ c.user.username }}"
            >{% trans "reply" %}</a></li>
          {% endif %}
        {% endif %}
      </ul>
      {% endspaceless %}

      <div class="comment__footer__share js-tab-content js-share-{{ c.pk }}" style="display: none;">
        {% with comment_url=c.get_absolute_url %}
          <input
            class="comment__footer__share__url"
            type="text"
            value="{% get_share_url url=comment_url %}" />
          {% spaceless %}
            <ul class="comment__footer__share__menu">
              <li><a href="{% get_twitter_share_url url=comment_url title=topic.title %}" target="_blank"
              ><i class="fa fa-twitter"></i> Twitter</a></li>
              <li><a href="{% get_facebook_share_url url=comment_url title=topic.title %}" target="_blank"
              ><i class="fa fa-facebook"></i> Facebook</a></li>
              <li><a href="{% get_email_share_url url=comment_url title=topic.title %}"
              ><i class="fa fa-envelope"></i> Email</a></li>
            </ul>
          {% endspaceless %}
        {% endwith %}
      </div>
    </div>

  </div>
  {% endif %}
  {% endfor %}
</div>

<script>

  document.addEventListener('DOMContentLoaded', function() {

    {% if user.is_authenticated %}
      stModules.like(document.querySelectorAll('.js-like'), {
        csrfToken: "{{ csrf_token }}",
        likeText: "<span class=\"fa fa-heart\"></span> " + "{% trans "like" %} ({count})",
        removeLikeText: "<span class=\"fa fa-heart\"></span> " + "{% trans "remove like" %} ({count})"
      });
    {% endif %}

    stModules.blockquoteExpand(
      document.querySelectorAll('.js-comment-text > blockquote'));

    hljs.initHighlightingOnLoad();

  });

</script>
