{% extends "base.html" %}
{% block title %}Motion Events · TailCam{% endblock %}
{% block content %}
<div class="page-head">
    <h1>Motion Events</h1>
    <select id="filter-camera">
        <option value="">All cameras</option>
        {% for cam in cameras %}
        <option value="{{ cam.descriptor.id }}">{{ cam.name }}</option>
        {% endfor %}
    </select>
</div>
<table class="events-table">
    <thead>
        <tr><th>Time</th><th>Camera</th><th>Duration</th><th>Peak score</th><th>Recording</th></tr>
    </thead>
    <tbody id="events-body"></tbody>
</table>
<p class="empty hidden" id="events-empty">No motion events recorded.</p>
{% endblock %}
{% block scripts %}
<script>TailCam.initEvents();</script>
{% endblock %}