{% extends "users/base.html" %}
{% block content %}
{% load crispy_forms_tags %}
{% load counter_tag %}
{% if request.user.profile.agency.module_timemanagement %}
<div class="content-section col-7">
	
	<h3>Zum Arbeitstag am {{workday.start|date:"d.m.Y"}} Pause hinzufügen</h3>
  <hr>
  <div class="col-6" style="margin-left: -10px;">
    <form method="POST" class="">
    {% csrf_token %}
    {{form.media}}
      {{form}}
    
    <hr>
  <a class="btn" href="{% url 'tm-update' workday.pk %} ">Abbrechen</a>
  <button type="submit" class="btn btn-primary" style="float: right" id="addbreakbutton" disabled="true">Pause hinzufügen</button>
  </form>
  </div>  


<script type="text/javascript">

$("#id_end").blur(function(){
  checkBreaks();
})

$("#id_start").blur(function(){
  checkBreaks();
})

function checkBreaks(){  
  $('.ui-datepicker-calendar').hide();
  $('.ui-datepicker-header').hide();

  new_start = $("#id_start").datepicker().val();
  new_end = $("#id_end").datepicker().val();
  if(new_start >= new_end){
    $("#addbreakbutton").prop("disabled", true);
  }
  else{
    $("#addbreakbutton").prop("disabled", false);
  }
}
</script>

{% endif %}
{% endblock content %}