{% extends "main.html" %}

{% from 'bootstrap5/utils.html' import render_messages %}

{% block title %}{{ url }}{% endblock %}

{% block scripts %}
{{ super() }}
<script type="text/javascript">
    $('#table').DataTable( {
        "order": [[ 0, "desc" ]],
        "pageLength": 50,
        "columnDefs": [{
            "targets": 0,
            "render": function ( data, type, row, meta ) {
                let date = new Date(data);
                return date.getFullYear() + '-' + (date.getMonth() + 1).toString().padStart(2, "0") + '-' + date.toTimeString();
            }
        }]
    });
</script>

<script type="text/javascript">
    function openTreeInNewTab(treeUUID) {
        window.opener.openTreeInNewTab(treeUUID);
    };
</script>

{% endblock %}

{% block content %}
  <center>
      <h4>{{ url }}</h4>
      <button onclick="window.history.back();" class="btn btn-primary" type="button">Go Back</button>
  </center>
  <div class="table-responsive">
  <table id="table" class="table" style="width:96%">
    <thead>
     <tr>
       <th>Start timestamp</th>
       <th>Captures</th>
     </tr>
    </thead>
    <tbody>
      {% for hit in hits %}
      <tr>
        <td>
          {{ hit['start_timestamp'] }}
        </td>
        <td><a href="{{ url_for('tree', tree_uuid=hit['capture_uuid']) }}">{{ hit['title'] }}</a>
            </br>
            Nodes:
            <ul>
              {% for urlnode_uuid, data in hit['urlnodes'].items() %}
              <li><a href="{{ url_for('tree', tree_uuid=hit['capture_uuid'], node_uuid=data['hostnode_uuid']) }}">{{ data['start_time'] }}</a></li>
              {% endfor %}
            </ul>
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
  </div>
  <p>The same file was seen in these captures:</p>
  <ul>
  {% for capture_uuid, title in captures %}
    <li><a href="#/" onclick="openTreeInNewTab('{{ capture_uuid }}')">{{ title }}</a></li>
  {% endfor %}
  </ul>
{% endblock %}