{# templates/block/_gps_track.html.twig

   Tab GPS: posizione corrente + storico sulla mappa, filtrabile per data.

   Il filtro date stava nell'header della sezione "Location" ed era inerte: i
   gestori dp.change facevano solo blur(), la logica era commentata. Qui e'
   collegato davvero, e agisce su cio' che ha senso filtrare -- lo storico
   delle coordinate.

   I punti arrivano da api_machine_gps_history gia' diradati per distanza:
   il diradamento e' lato server perche' su finestre lunghe lo storico e'
   fatto di migliaia di posizioni a pochi metri l'una dall'altra, che non
   devono nemmeno viaggiare sulla rete.

   Richiede: macchina, deviceId. Bootstrap 3 + jQuery, come gli altri moduli.
#}
<div class="gps-module"
     data-machine-id="{{ macchina.id }}"
     data-device-id="{{ deviceId }}"
     data-history-url="{{ path('api_machine_gps_history', {id: macchina.id}) }}">

    <div class="gps-toolbar form-inline">
        <div class="form-group">
            <label for="gps-from-{{ macchina.id }}">{{ 'From'|trans }}</label>
            <input type="text" autocomplete="off"
                   class="form-control gps-date gps-from"
                   id="gps-from-{{ macchina.id }}"
                   placeholder="{{ 'Select date'|trans }}"/>
        </div>
        <div class="form-group">
            <label for="gps-to-{{ macchina.id }}">{{ 'To'|trans }}</label>
            <input type="text" autocomplete="off"
                   class="form-control gps-date gps-to"
                   id="gps-to-{{ macchina.id }}"
                   placeholder="{{ 'Select date'|trans }}"/>
        </div>
        <div class="form-group">
            <label for="gps-mind-{{ macchina.id }}">{{ 'Minimum distance'|trans }}</label>
            {# Esposta perche' la soglia giusta dipende dall'uso: 25 m per un
               mezzo in movimento, di piu' per vedere solo gli spostamenti veri. #}
            <select class="form-control gps-mind" id="gps-mind-{{ macchina.id }}">
                <option value="10">10 m</option>
                <option value="25" selected>25 m</option>
                <option value="100">100 m</option>
                <option value="500">500 m</option>
                <option value="1000">1 km</option>
            </select>
        </div>
        <button type="button" class="btn btn-primary gps-apply">
            <i class="fa fa-search"></i> {{ 'Apply'|trans }}
        </button>
        <button type="button" class="btn btn-default gps-reset">
            {{ 'Reset'|trans }}
        </button>
        <span class="gps-status text-muted"></span>
    </div>

    <div class="gps-map-wrap">
        <div class="gps-map map-track"
             data-macid="{{ macchina.id }}"
             data-zoom="14"
             style="width:100%; height:420px;"></div>
    </div>

    <table class="table table-condensed gps-current">
        <tr>
            <th>{{ 'Current position'|trans }}</th>
            <td class="gps-cur-pos text-muted">—</td>
        </tr>
        <tr>
            <th>{{ 'Last update'|trans }}</th>
            <td class="gps-cur-at text-muted">—</td>
        </tr>
    </table>
</div>