{% load i18n %}
{% load comments_ink %}

{% if user.is_authenticated and is_input_allowed %}
  <form method="POST" autocomplete="off" action="{% object_reactions_form_target object %}" id="reactions">
    {% csrf_token %}
    <input type="hidden" name="{{ comments_page_qs_param }}" value="{{ cpage }}" />
    <input type="hidden" name="{{ comments_fold_qs_param }}" value="{{ cfold }}" />
    <input type="hidden" name="next" value="{{ object.get_absolute_url }}#reactions" />
    <div class="flex flex-align-center">
      {% for reaction in object_reactions %}
        <button type="submit" class="emoji" name="reaction" id="{{ reaction.value }}" value="{{ reaction.value }}">&{{ reaction.icon }};</button>&nbsp;
        <span class="reaction">
          {% if reaction.counter > max_users_in_tooltip %}<a href="{% url 'comments-ink-list-reacted-to-object' content_type.id object.id reaction.value %}">{{ reaction.counter }}</a>{% else %}<span>{{ reaction.counter }}</span>{% endif %}
          <div class="reaction_tooltip small">{% if reaction.counter > 0 and reaction.counter > reaction.authors|length %}{% blocktrans with authors=reaction.authors|join:", " label=reaction.label %}{{ authors }} and more reacted with {{ label }}{% endblocktrans %}{% elif reaction.counter > 0 and reaction.counter == reaction.authors|length %}{% blocktrans with authors=reaction.authors|join:", " label=reaction.label %}{{ authors }} reacted with {{ label }}{% endblocktrans %}{% else %}{% blocktrans with label=reaction.label %}Nobody reacted yet with {{ label }}{% endblocktrans %}{% endif %}</div>
        </span>
        {% if not forloop.last %}&nbsp;&nbsp;&nbsp;{% endif %}
      {% endfor %}
    </div>
  </form>
{% elif is_input_allowed %}
  <div id="reactions" class="flex flex-align-center">
    {% for reaction in object_reactions %}
      <a href="{{ login_url }}?next={{ object.get_absolute_url }}#reactions">
        <span class="emoji">&{{ reaction.icon }};</span>
      </a>&nbsp;&nbsp;
      <span class="reaction">
        {% if reaction.counter > max_users_in_tooltip %}<a href="{% url 'comments-ink-list-reacted-to-object' content_type.id object.id reaction.value %}">{{ reaction.counter }}</a>{% else %}<span>{{ reaction.counter }}</span>{% endif %}
        <div class="reaction_tooltip small">{% if reaction.counter > 0 and reaction.counter > reaction.authors|length %}{% blocktrans with authors=reaction.authors|join:", " label=reaction.label %}{{ authors }} and more reacted with {{ label }}{% endblocktrans %}{% elif reaction.counter > 0 and reaction.counter == reaction.authors|length %}{% blocktrans with authors=reaction.authors|join:", " label=reaction.label %}{{ authors }} reacted with {{ label }}{% endblocktrans %}{% else %}{% blocktrans with label=reaction.label %}Nobody reacted yet with {{ label }}{% endblocktrans %}{% endif %}</div>
      </span>
      {% if not forloop.last %}&nbsp;&nbsp;&nbsp;{% endif %}
    {% endfor %}
  </div>
{% else %}
  <div id="reactions" class="flex flex-align-center">
    {% for reaction in object_reactions %}
      {% if reaction.counter %}
        <span class="emoji">&{{ reaction.icon }};</span>&nbsp;&nbsp;
        <span class="reaction">
          {% if reaction.counter > max_users_in_tooltip %}<a href="{% url 'comments-ink-list-reacted-to-object' content_type.id object.id reaction.value %}">{{ reaction.counter }}</a>{% else %}<span>{{ reaction.counter }}</span>{% endif %}
          <div class="reaction_tooltip small">{% if reaction.counter > 0 and reaction.counter > reaction.authors|length %}{% blocktrans with authors=reaction.authors|join:", " label=reaction.label %}{{ authors }} and more reacted with {{ label }}{% endblocktrans %}{% elif reaction.counter > 0 and reaction.counter == reaction.authors|length %}{% blocktrans with authors=reaction.authors|join:", " label=reaction.label %}{{ authors }} reacted with {{ label }}{% endblocktrans %}{% else %}{% blocktrans with label=reaction.label %}Nobody reacted yet with {{ label }}{% endblocktrans %}{% endif %}</div>
        </span>
        {% if not forloop.last %}&nbsp;&nbsp;&nbsp;{% endif %}
      {% endif %}
    {% endfor %}
  </div>
{% endif %}
