{% extends "layout.html" %}
{% block body %}

<h1>Add Time</h1>
{% with messages = get_flashed_messages() %}
  {% if messages %}
    <ul class=flashes>
    {% for message in messages %}
      <li>{{ message }}</li>
    {% endfor %}
    </ul>
  {% endif %}
{% endwith %}
<form action="{{ url_for('insert_time') }}" method="post">
<table class="table table-bordered">
  <tr>
    <th>Employee</th>
    <th>Start Date</th>
    <th>Start Time</th>
    <th>End Date</th>
    <th>End Time</th>
  </tr>
  <tr class="time_entries">
    <td>
      <select title="employee" name="employee">
      {% for employee in employees %}
        <option value="{{employee.id}}">{{ employee.first_name }} {{employee.last_name}}</option>
      {% endfor %}
      </select>
    </td>
    <td><input type="date" name="date_start" id="date_start" class="datePicker"></td>
    <td><input type="time" name="start_time" id="start_time"></td>
    <td><input type="date" name="date_end" id="date_end" class="datePicker"></td>
    <td><input type="time" name="end_time" id="end_time"></td>
    <td><button type="submit" class="btn btn-default">Add Time</button></td>
  </tr>
</table>
</form>
<!--<script>-->
  <!--$(document).ready( function() {-->
    <!--var now = new Date();-->
    <!--var today = now.getFullYear() + '-' + (now.getMonth() + 1) + '-' + now.getDate();-->
    <!--$('#datePicker').val(today);-->
<!--});-->
<!--</script>-->
{% endblock %}