{% extends "base.html" %}


{% block body %}

{% include "navbar.html" %}
<h1>Pixel {{ pixel_name }}</h1>
<div style="display: flex;">
  <textarea readonly style="flex: 1;">{{ pixel_url }}</textarea>
  <textarea readonly style="flex: 1;">
    &lt;img src="{{ pixel_url }}" /&gt;
  </textarea>
</div>
<form action="/manage/pixel/delete" method="post" onsubmit="return confirm('Are you sure you want to delete this pixel?')">
  <input type="hidden" name="pixel_id" value="{{ pixel_id }}"/>
  <button class="btn btn-outline-danger">Delete pixel</button>
</form>
<h3>Hits for pixel</h3>
<table class="table table-striped">
    <thead>
      <tr>
        <th scope="col">#</th>
        <th scope="col">Date</th>
        <th scope="col">IP</th>
        <th scope="col">User agent</th>
    </tr>
    </thead>
    <tbody>
    {% for (date, ip, user_agent, ) in hits %}
            <tr>
                <th scope="row">{{ loop.index }}</th>
                <td>{{ date|escape }}</td>
                <td>{{ ip|escape }}</td>
                <td>{{ user_agent|escape }}</td>
            </tr>
    {% endfor %}
    </tbody>
  </table>
{% endblock %}