EE-status-v3/templates/camera_events_partial.html

<h3>List of Events <i class="bi bi-calendar-event"></i></h3>
<h5>{{ template_values['camera'].name }}</h5>
<a href="/camera/{{ template_values['camera'].id }}/events/3" hx-get="/camera/{{ template_values['camera'].id }}/events/3" hx-trigger="click" hx-target="#camera_status_events" hx-indicator=".progress">
    <button class="btn btn-outline-success">
        3x<i class="bi bi-calendar-event" title="click to load events list for 3 days"></i>
    </button>
</a>
<a href="/camera/{{ template_values['camera'].id }}/events/7" hx-get="/camera/{{ template_values['camera'].id }}/events/7" hx-trigger="click" hx-target="#camera_status_events" hx-indicator=".progress">
    <button class="btn btn-outline-success">
        7x<i class="bi bi-calendar-event" title="click to load events list for 7 days"></i>
    </button>
</a>
<a href="/camera/{{ template_values['camera'].id }}/events/14" hx-get="/camera/{{ template_values['camera'].id }}/events/14" hx-trigger="click" hx-target="#camera_status_events" hx-indicator=".progress">
    <button class="btn btn-outline-success">
        14x<i class="bi bi-calendar-event" title="click to load events list for 14 days"></i>
    </button>
</a>
<a href="/camera/{{ template_values['camera'].id }}/status_plot" hx-get="/camera/{{ template_values['camera'].id }}/status_plot" hx-trigger="click" hx-target="#camera_status_plot" hx-indicator=".progress">
    <button class="btn btn-outline-success">
        Graph Events <i class="bi bi-bar-chart" title="click to generate graph of events"></i>
    </button>
</a>
{% if template_values['events'] %}
    {% for event in template_values['events'] %}
        <div class="row">
            <div class="col-2 left_text">
                <small>Status:</small>
            </div>
            <div class="col-9  offset-1 left_text">
                <b>{{ event['data'][0]['newStatus']['connectionStatus'] }}</b>
            </div>
            <div class="col-2 left_text">
                <small>End:</small>
            </div>
            <div class="col-9  offset-1 left_text">
                {{ event['endTimestamp'] }}
            </div>
            <div class="col-2 left_text">
                <small>Start:</small>
            </div>
            <div class="col-9  offset-1 left_text">
                {{ event['startTimestamp'] }}
            </div>
        </div>
    {% endfor %}
{% endif %}