{% extends 'projectroles/base.html' %}

{% load static %}
{% load projectroles_common_tags %}

{% block title %}App Alerts{% endblock title %}

{% block projectroles %}

<div class="row sodar-subtitle-container">
  <h2><i class="iconify" data-icon="mdi:alert-octagram"></i> App Alerts</h2>
  <a href="#"
     class="btn btn-primary ml-auto sodar-app-alert-btn-dismiss
           {% if object_list.count == 0 %}disabled{% endif %}"
     id="sodar-app-alert-btn-dismiss-all"
     role="button"
     data-uuid=""
     data-dismiss-url="{% url 'appalerts:ajax_dismiss_all' %}">
    <i class="iconify" data-icon="mdi:close-thick"></i> Dismiss All
  </a>
</div>

<div class="container-fluid sodar-page-container">
  {% for a in object_list %}
    <div class="alert alert-{{ a.level | lower }} sodar-app-alert-item"
         data-alert-uuid="{{ a.sodar_uuid }}">
      <span data-toggle="tooltip" data-placement="top"
            title="{% if a.app_plugin %}{{ a.app_plugin.title }}{% else %}Projectroles{% endif %}">
        <i class="iconify"
           data-icon="{% if a.app_plugin %}{{ a.app_plugin.get_plugin.icon }}{% else %}mdi:cube{% endif %}"></i>
      </span>
      <span data-toggle="tooltip" data-placement="top"
            title="{{ a.date_created | date:'Y-m-d H:i' }}">
        <i class="iconify" data-icon="mdi:clock"></i>
      </span>
      {{ a.message | safe }}
      <span class="sodar-app-alert-buttons pull-right">
        {% if a.url %}
          <a href="{% url 'appalerts:redirect' appalert=a.sodar_uuid %}"
             class="btn btn-{{ a.level | lower }}
                    sodar-list-btn sodar-app-alert-btn-link"
             role="button"
             title="Follow link and dismiss"
             data-toggle="tooltip" data-placement="top">
            <i class="iconify" data-icon="mdi:arrow-right-bold"></i>
          </a>
        {% endif %}
        <a href="#"
           class="btn btn-{{ a.level | lower }}
                  sodar-list-btn sodar-app-alert-btn-dismiss sodar-app-alert-btn-dismiss-single"
           role="button"
           title="Dismiss"
           data-toggle="tooltip" data-placement="top"
           data-uuid="{{ a.sodar_uuid }}"
           data-dismiss-url="{% url 'appalerts:ajax_dismiss' appalert=a.sodar_uuid %}">
          <i class="iconify" data-icon="mdi:close-thick"></i>
        </a>
      </span>
    </div>
  {% endfor %}

  <div class="alert alert-info"
       id="sodar-app-alert-empty"
       style="{% if object_list.count > 0 %}display: none;{% endif %}">
    There are currently no application alerts for you.
  </div>
</div>

{% endblock projectroles %}

{% block javascript %}
  {{ block.super }}
  <!-- Appalerts list Javascript -->
  <script type="text/javascript" src="{% static 'appalerts/js/appalerts_list.js' %}"></script>
{% endblock javascript %}
