{##
 # @file history.html
 # Copyright (C) 2015 Pressa. All rights reserved.
 #}

<!-- START | DASHBOARD/HISTORY -->
<div id="history" class="container-fluid">
 <div class="row pad-top">
  <div class="col-lg-12">
   <div class="row">
    <div class="col-lg-12">
     <form class="form-inline pull-right">
      <div class="form-group">
       <div class='input-group date'>
        <input type='text' class="form-control input-sm" required="required" id='history-vfilter'
               title="{{ lang['dashboard']['history']['table']['vfilter_placeholder'] }}"
               placeholder="{{ lang['dashboard']['history']['table']['vfilter_placeholder'] }}"/>
        <span class="input-group-addon">
         <i class="fa fa-car"></i>
        </span>
       </div>
      </div>
      <div class="form-group">
       <select class="form-control input-sm" data-width="300px" required="required"
               data-style="btn-sm"
               data-live-search="true" data-size="10"
               data-placeholder="{{ lang['dashboard']['history']['table']['vehicle'] }}"
               title="{{ lang['dashboard']['history']['table']['vehicle'] }}"
               data-header="{{ lang['dashboard']['history']['table']['vehicle'] }}"
               id="history-vehicle">
       </select>
      </div>
      <div class="form-group">
       <div class='input-group date' id='history-startdate'>
        <input type='text' class="form-control input-sm" required="required"
               title="{{ lang['dashboard']['history']['table']['start_placeholder'] }}"
               placeholder="{{ lang['dashboard']['history']['table']['start_placeholder'] }}"/>
        <span class="input-group-addon">
         <span class="glyphicon glyphicon-calendar"></span>
        </span>
       </div>
       <div class='input-group date' id='history-enddate'>
        <input type='text' class="form-control input-sm" required="required"
               title="{{ lang['dashboard']['history']['table']['end_placeholder'] }}"
               placeholder="{{ lang['dashboard']['history']['table']['end_placeholder'] }}"/>
        <span class="input-group-addon">
         <span class="glyphicon glyphicon-calendar"></span>
        </span>
       </div>
       <button type="submit" class="btn btn-info btn-sm" id="history-submit"
               data-toggle="tooltip" data-placement="bottom"
               title="{{ lang['dashboard']['history']['table']['search_tooltip'] }}"
               data-loading-text="{{ lang['dashboard']['history']['table']['search_loading'] }}">
        <span class="glyphicon glyphicon-search" aria-hidden="true"></span>
        {{ lang['dashboard']['history']['table']['search'] }}
       </button>
        <button type="submit" class="btn btn-info btn-sm" id="csv-submit"
               data-toggle="tooltip" data-placement="bottom"
               title="{{ lang['dashboard']['history']['table']['csv_tooltip'] }}"
               data-loading-text="{{ lang['dashboard']['history']['table']['csv_loading'] }}">
        <span class="fa fa-table" aria-hidden="true"></span>
        {{ lang['dashboard']['history']['table']['csv'] }}
       </button>
       <button type="submit" class="btn btn-info btn-sm" id="kml-submit"
               data-toggle="tooltip" data-placement="bottom"
               title="{{ lang['dashboard']['history']['table']['kml_tooltip'] }}"
               data-loading-text="{{ lang['dashboard']['history']['table']['kml_loading'] }}">
        <span class="fa fa-table" aria-hidden="true"></span>
        {{ lang['dashboard']['history']['table']['kml'] }}
       </button>
      </div>
     </form>
    </div>
   </div>
   <br/>
   <div class=row>
    <div class="col-lg-9">
     <div id="history-note" class="bg-warning">
      {{ lang['dashboard']['history']['table']['note'] }}
     </div>
    </div>
    <div class="col-lg-3">
     <div id="history-show-btn" >
      <button type="button" class="btn btn-info btn-block btn-sm" id="panel-btn"
               data-toggle="tooltip" data-placement="bottom"
               title="{{ lang['dashboard']['history']['table']['panel_btn_tooltip'] }}"
               data-loading-text="{{ lang['dashboard']['history']['table']['panel_btn_loading'] }}">
        <span class="fa fa-arrow-down" aria-hidden="true"></span>
        {{ lang['dashboard']['history']['table']['panel_btn'] }}
       </button>
     </div>
    </div>
   </div>
   <br/>
   <div class="row">
    <div class="col-lg-9" id="history-table">
     <div class="row">
      <div class="col-lg-12">
       <div id="history-table-title">
        {{ lang['dashboard']['history']['table']['ev_title'] }}
       </div>
      </div>
     </div>
     <div class="row">
      <div class="col-lg-12">
       <div id="history-table-head">
        <div class="row">
        <div class="col-lg-2 text-center">
          {{ lang['dashboard']['history']['table']['ev_datetime'] }}
         </div>
         <div class="col-lg-2 text-center">
          {{ lang['dashboard']['history']['table']['ev_comm_datetime'] }}
         </div>         
         <div class="col-lg-2 text-center">
          {{ lang['dashboard']['history']['table']['ev_event_code'] }}
         </div>
         <div class="col-lg-2 text-center">
         {{ lang['dashboard']['history']['table']['ev_event_age'] }}
        </div>
         <div class="col-lg-2 text-center">
         {{ lang['dashboard']['history']['table']['ev_event_speed'] }}
        </div>
        <div class="col-lg-2 text-center">
         {{ lang['dashboard']['history']['table']['ev_event_lat'] }}
        </div>
        <div class="col-lg-2 text-center">
         {{ lang['dashboard']['history']['table']['ev_event_lng'] }}
        </div>
        <div class="col-lg-2 text-center">
         {{ lang['dashboard']['history']['table']['ev_event_gpio'] }}
        </div>
        <div class="col-lg-2 text-center">
         {{ lang['dashboard']['history']['table']['ev_event_main'] }}
        </div>
        <div class="col-lg-2 text-center">
         {{ lang['dashboard']['history']['table']['ev_event_aux'] }}
        </div>
        <div class="col-lg-2 text-center">
         {{ lang['dashboard']['history']['table']['ev_event_odo'] }}
        </div>
        <div class="col-lg-2 text-center">
         {{ lang['dashboard']['history']['table']['ev_event_gprs'] }}
        </div>
        <div class="col-lg-2 text-center">
         {{ lang['dashboard']['history']['table']['ev_event_gpslvl'] }}
        </div>
        <div class="col-lg-2 text-center">
         {{ lang['dashboard']['history']['table']['ev_event_gpsstatus'] }}
        </div>
        <div class="col-lg-2 text-center">
         {{ lang['dashboard']['history']['table']['ev_event_gpssat'] }}
        </div>
         <div class="col-lg-2 text-center">
         {{ lang['dashboard']['history']['table']['ev_event_temp'] }}
        </div>
         <div class="col-lg-2 text-center">
         {{ lang['dashboard']['history']['table']['ev_event_liters'] }}
        </div>
         <div class="col-lg-2 text-center">
          {{ lang['dashboard']['history']['table']['ev_gpsid'] }}
         </div>
         <div class="col-lg-2 text-center">
          {{ lang['dashboard']['history']['table']['ev_msgid'] }}
         </div>
        </div>
       </div>
      </div>
     </div>
     <div class="row">
      <div class="col-lg-12">
       <div id="history-table"></div>
      </div>
     </div>
    </div>
    <div class="col-lg-3" id="history-map-panel">
     <div class="row">
      <div class="col-lg-12">
       <div id="history-curr-title">
        {{ lang['dashboard']['history']['table']['map_title'] }}
       </div>
      </div>
     </div>
     <div class="row">
      <div class="col-lg-12">
       <div id="history-map"></div>
      </div>
     </div>
     </br>
     <div class="row">
      <div class="col-lg-12">
       <div id="history-curr-title">
        {{ lang['dashboard']['history']['table']['curr_title'] }}
       </div>
      </div>
     </div>
     <div class="row">
      <div class="col-lg-12">
       <div id="history-curr"></div>
      </div>
     </div>
     <br/>
     <div class="row">
      <div class="col-lg-12">
       <div id="history-curr-title">
        {{ lang['dashboard']['history']['table']['comments_title'] }}
       </div>
      </div>
     </div>
     <div class="row">
      <div class="col-lg-12">
       <div id="history-comments"></div>
      </div>
     </div>
     <br/>
     <br/>
     <br/>
     </div>
   </div>
  </div>
 </div>
</div>
<!-- END | DASHBOARD/HISTORY -->