{% load static %}

<div id="results">
{% if results is not None %}
    <div style="display: none" id="jsonData" data-json="{{ data }}"></div>
    <div class="columns">
      <div class="column">
        <div class="box">
          <label class="label">Sentiment</label>          
          <canvas id="volume"></canvas>
          <script src="{% static 'chart.js' %}"></script>
        </div>
      </div>
    </div>
    <div class="box">
      <div class="table-container">
        <table class="table is-striped is-hoverable is-fullwidth">
          <thead>
            <tr>
              <th>TS</th>
              <th>msg</th>
              <th>host</th>
              <th>nick</th>
              <th>channel</th>
              <th>net</th>
            </tr>
          </thead>

          <tbody>
            {% for item in results %}
              <tr>
                <td>{{ item.ts }}</td>
                <td>{{ item.msg }}</td>
                <td>{{ item.host }}</td>
                <td>{{ item.nick }}</td>
                <td>{{ item.channel }}</td>
                <td>{{ item.net }}</td>
              </tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
    </div>
    <div class="box">
      <div class="columns">
        <div class="column">
          <p>{{ card }} hits</p>
        </div>
        {% if redacted != 0 %}
          <div class="column">
            <p>{{ redacted }} redacted</p>
          </div>
        {% endif %}

        {% if exemption is not None %}
          <div class="column">
            <p>god mode</p>
          </div>
        {% endif %}
        <div class="column">
          <p>{{ took }}ms</p>
        </div>
      </div>
    </div>
  {% endif %}
</div>