{% extends "base.html" %}

{% set title = "Riego - Events" %}
{% set active_menu = "events" %}


{% block content %}


<table class="table">
    <thead>
        <tr>
            <th scope="col">Datum</th>
            <th scope="col">Dauer</th>
            <th scope="col">Kreis</th>
        </tr>
    </thead>
    <tbody>
        {% for item in items %}
        <tr>
            <td><a href="{{url('events_item_filter', item_id=item['valve_id']) }}">{{ item.created_at.strftime("%Y-%m-%d %H:%M:%S") }}</a></td>
            <td>{{ item.duration }} / {{ item.valves_duration }}</td>
            <td><a href="{{url('valves_item_view', item_id=item['valve_id']) }}">{{ item.valves_name }}</a></td>
        </tr>
        {% endfor %}
    </tbody>
</table>




<script>
    var ws = null;
    function start() {
        var wsUri = (window.location.protocol == 'https:' && 'wss://' || 'ws://') + window.location.host + "{{url('websockets')}}";
        ws = new WebSocket(wsUri);
        ws.onmessage = function (event) {
            data = JSON.parse(event.data);
            if (data.scope != 'events') {
                return
            }
            switch (data.action) {
                case 'update':
                    location.reload(true);
                    break;
                default:
                    break;
            }
        };
        ws.onclose = function () {
            //reconnect now
            check();
        };
    };
    function check() {
        if (!ws || ws.readyState == 3) start();
    }
    start();
    setInterval(check, 5000);

</script>


{% endblock %}