{% extends 'base.html.twig' %}
{% block body %}
	<nav class="breadcrumb bg-white push">
		<a class="breadcrumb-item" href="{{ path('home')}}">Início</a>
		<a class="breadcrumb-item" href="{{ path('transporte_index')}}">Transportes</a>
		<a class="breadcrumb-item" href="{{ path('transporte_show', {'token': transporte.token})}}">{{transporte.ordem}}</a>
		<span class="breadcrumb-item active">Editar</span>
	</nav>
	<div class="block">
		<div class="block-header block-header-default">
			<h3 class="block-title">Editar</h3>
		</div>
		<div class="block-content block-content-full">
			<div class="row justify-content-center py-20">
				<div class="col-xl-10">
					{% for error in form.vars.errors.form.getErrors(true) %}
					<div class="alert alert-danger alert-dismissible fade show col-lg-11">
						<button type="button" class="close" data-dismiss="alert" aria-label="Close">
							<span aria-hidden="true">×</span>
						</button>
						{{error.message}}
					</div>
					{% endfor %}
					{{ include('transporte/_form.html.twig') }}
				</div>
			</div>
		</div>
	</div>
{% endblock %}
{% block javascripts %}
<script>
	$(document).ready(function() {
		$('.m_transporte').addClass("open");
		
		fornecedor = $( "#transporte_fornecedor" ).val();
		$("#transporte_matricula option").each(function(){
			if($(this).attr("fornecedor") == fornecedor){
				$(this).show();
			}else{
				$(this).hide();
			}
		});	
	} );

	var dc = flatpickr('#transporte_data_descarga', {
			enableTime: true,
			dateFormat: "Y-m-d H:i",
			time_24hr: true
		});
	
	$(function () {
		/*selecting datepiker language*/
		flatpickr.localize(flatpickr.l10ns.pt);
		/*declaring return datepicker*/
		var dd = flatpickr('#transporte_data_prevista', {
			enableTime: true,
			dateFormat: "Y-m-d H:i",
			time_24hr: true,
			onChange: function (dateStr, dateObj) {				
				var data_carga = dc.selectedDates;			
				var data_descarga = dd.selectedDates;
			}
		});
		/*declaring outbound datepicker*/
		var dc = flatpickr('#transporte_data_carga', {
			enableTime: true,
			dateFormat: "Y-m-d H:i",
			time_24hr: true,
			onChange: function (dateStr, dateObj) {				
				var zona_carga = $("#transporte_zona_carga").val();
				var zona_descarga = $("#transporte_zona_descarga").val();
				var tt = Number($("#transporte_tempo_transito").val());
				
				var horas = Number(tt) + Number(zona_descarga) - Number(zona_carga);
				dd.set("minDate", new Date(dateObj).addHours(horas));
				dd.setDate(new Date(dateObj).addHours(horas));
			}
		});
		
		$( "#transporte_tempo_transito" ).change(function() {
			var data_carga = dc.selectedDates;
			
			var zona_carga = $("#transporte_zona_carga").val();
			var zona_descarga = $("#transporte_zona_descarga").val();
			var tt = Number($(this).val());

			var horas = Number(tt) + Number(zona_descarga) - Number(zona_carga);
			dd.setDate(new Date(data_carga).addHours(horas));
		});
		
		$( "#transporte_zona_carga" ).change(function() {
			var data_carga = dc.selectedDates;
			
			var zona_carga = $("#transporte_zona_carga").val();
			var zona_descarga = $("#transporte_zona_descarga").val();
			var tt = Number($("#transporte_tempo_transito" ).val());

			var horas = Number(tt) + Number(zona_descarga) - Number(zona_carga);
			dd.setDate(new Date(data_carga).addHours(horas));
		});
		
		$( "#transporte_zona_descarga" ).change(function() {
			var data_carga = dc.selectedDates;
			
			var zona_carga = $("#transporte_zona_carga").val();
			var zona_descarga = $("#transporte_zona_descarga").val();
			var tt = Number($("#transporte_tempo_transito" ).val());

			var horas = Number(tt) + Number(zona_descarga) - Number(zona_carga);
			dd.setDate(new Date(data_carga).addHours(horas));
		});
	
		Date.prototype.addHours= function(h){
			this.setHours(this.getHours()+h);
			return this;
		}
	});
 
	$(".custom-file-input").on("change", function() {
	  var fileName = $(this).val().split("\\").pop();
	  $(this).siblings(".custom-file-label").addClass("selected").html(fileName);
	});
	
	var fornecedor = 0;

	$( "#transporte_fornecedor" ).change(function() {
		$("#transporte_matricula").val($("#target option:first").val());
		fornecedor = $(this).val();
		$("#transporte_matricula option").each(function(){
			if($(this).attr("fornecedor") == fornecedor){
				$(this).show();
			}else{
				$(this).hide();
			}
		});		
	});
	
	Date.prototype.addHours= function(h){
		this.setHours(this.getHours()+h);
		return this;
	}
</script>
{% endblock %}
{% block stylesheets %}
<style>
.label:required{
	display:none;
}
</style>
{% endblock %}