{% extends 'site_templates/site_master.html' %}
{% load staticfiles %}

{% block header_block %}
  <title>Event Logs</title>


  <link rel="stylesheet" href="{% static 'plugins/highlightjs/highlight.min.css' %}" />
  

  <link rel="stylesheet" href="{% static 'plugins/jquery.json-viewer/jquery.json-viewer.css' %}">
  
{% endblock %}

{% block body_block %}
  <h2>Event Logs</h2>
  <div class="panel-group" id="accordion">
    {% for log in logs %}
      <div class="panel 
          {% if log.log_level == 1 %}
            panel-danger
          {% elif log.log_level == 2 %}
            panel-success
          {% elif log.log_level == 3 %}
            panel-warning
          {% elif log.log_level == 4 %}
            panel-info
          {% else %}
            panel-default
          {% endif %}">
        <div class="panel-heading" data-toggle="collapse" data-parent="#accordion" href="#log{{ log.id }}" style="cursor: pointer;">
          <div class="row">
            <div class="col-md-4">
              {% if log.log_level == 1 %}            
                <h4 class="panel-title"><b>Log Type: ERROR</b></h4>
              {% elif log.log_level == 2 %}
                <h4 class="panel-title"><b>Log Type: DEBUG</b></h4>
              {% elif log.log_level == 3 %}
                <h4 class="panel-title"><b>Log Type: WARN</b></h4>
              {% elif log.log_level == 4 %}
                <h4 class="panel-title"><b>Log Type: INFO</b></h4>
              {% endif %}
            </div>
            <div class="col-md-4">
              <h4 class="panel-title"><b>Tags: {{ log.tag }}</b></h4>
            </div>
          </div>
          <div class="row">
            <div class="col-md-8">
              <b>Tag:</b> {{ log.tag }}
            </div>
            <div class="col-md-4">
              <b>{{ log.created_on }}</b>
            </div>
          </div>
        </div>
        <div id="log{{ log.id }}" class="panel-collapse collapse">
          <div class="panel-body">
            <div class="row">
              <div class="col-md-2">
                <b>Message:</b>
              </div>
              <div class="col-md-10">
                <pre>{{ log.message }}</pre>
              </div>
            </div>
            <div class="row">
              <div class="col-md-2">
                <b>Stack Trace:</b>
              </div>
              <div class="col-md-10">
                <pre><code>{{ log.stack_trace }}</code></pre>
              </div>
            </div>

            
          </div>
        </div>
      </div>
    {% endfor %}
  </div>
  <div class="row">
    <div class="col-md-10">
      <ul class="pagination pagination-md">
        {% if logs.has_previous %}
          <li><a href="?page={{ logs.previous_page_number }}">Previous</a></li>
        {% endif %}
        <li class="disabled"><a href="#">Page {{ logs.number }} of {{ logs.paginator.num_pages }}</a></li>
        {% if logs.has_next %}
          <li><a href="?page={{ logs.next_page_number }}">Next</a></li>
        {% endif %}
      </ul>
    </div>
    <div class="col-md-2">
      <form action="{% url 'logger:all_event_logs' %}" method="POST">
        {% csrf_token %}
        <button type="submit" class="btn btn-danger pull-right">Delete All</button>
      </form>
    </div>
  </div>
{% endblock %}

{% block js_block %}
  <script src="{% static 'plugins/highlightjs/highlight.min.js' %}"></script>
  <script src="{% static 'plugins/jquery.json-viewer/jquery.json-viewer.js' %}"></script>

  <script>hljs.initHighlightingOnLoad();</script>
{% endblock %}