{% extends 'base.html.twig' %}

{% block title %}OTO {% endblock %}

{% block body %}


	<section id="search" style="background:url('/images/bg/aeroport.jpg') no-repeat;background-size: cover;">
		<div class="container">

			<br/><br/><br/><br/>
           <h3>Réservation <i class="fas fa-chevron-right"></i> voyageurs
		   Vols ID :[ {{ pointToPoint[0] }}  - {{ pointToPoint[1] }} ]
		   </h3>
			<form class="search-form"  role="search" action="" method="POST">

                {#% if counter == 0 %}{{ app.session.get('user').NOM }} {% endif %#}

                {%  set counter = 0 %}
                {%  set nbrPax = -1 %}

				<fieldset>
					<legend>Adultes : ({{ travelers.adult }})</legend>
					{% for i in 1 .. travelers.adult %}
						{%  set nbrPax =  nbrPax+1 %}
						<div class="form-row">

							<div class="col-md-2 mb-3">
								<label for="firstName">Civilité</label>
								<select
										name="book[pax][{{ nbrPax }}][title]"
										class="form-control custom-select"
										placeholder="Civilité" required>
										<option value="M">Monsieur</option>
										<option value="Mme">Madame</option>
								</select>
							</div>

							<input type="hidden" value="adult" name="book[pax][{{ nbrPax }}][type]" />

							<div class="col-md-2 mb-3">
								<label for="firstName">Nom</label>
								<input type="text"
									   name="book[pax][{{ nbrPax }}][firstName]"
									   class="form-control" id="firstName-{{ counter }}"
									   value="Misterfly{#% if counter == 0 %}{{ app.session.get('user').NOM }} {% endif %#}" required />

							</div>

							<div class="col-md-2 mb-3">
								<label for="lastName">Prénom</label>
								<input type="text"
									   name="book[pax][{{ nbrPax }}][lastName]"
									   class="form-control"
									   value="{#% if counter == 0 %}{{ app.session.get('user').NOM }} {% endif %#}" required />
							</div>

							<div class="col-md-2  mb-3">
									<label for="birthDate">Date de naissance</label>
										<input type="text"
											   name="book[pax][{{ nbrPax }}][birthDate]"
											   class="form-control"
											   placeholder="01/01/1999"
											   value="01/01/2000"
											   required />
							</div>

							<div class="col-md-2 mb-3">
								<label for="birthDate">Bagages</label>
								<select
										name="book[pax][{{ nbrPax }}][bagage]"
										class="form-control custom-select"
										placeholder="" required>

									<option selected>Sélectionnez votre bagage</option>

									{% for baggageInfo in fareDetails.baggageInformation %}

										{% if baggageInfo.id is defined %}
										<option value="{{ baggageInfo.id }}">
                                            {{ baggageInfo.baggageWeight.weight }}
                                            {{ baggageInfo.baggageWeight.unit }}
                                            {{ baggageInfo.net|round }} €
										</option>

										{% else %}
											<option>
                                                {% if  baggageInfo.numberOfPieces is defined %}
                                                    {{  baggageInfo.numberOfPieces }}
                                                {% endif %}
												bagage de

                                                {% if baggageInfo.baggageWeight.weight is defined %}
                                                    {{ baggageInfo.baggageWeight.weight }}
                                                {% endif %}

                                                {% if baggageInfo.baggageWeight.unit  is defined %}
                                                    {{ baggageInfo.baggageWeight.unit }}
                                                {% endif %}
                                                inclu
											</option>
										{% endif %}
                                    {% endfor %}
								</select>
							</div>
						</div>
					{% endfor %}
				</fieldset>

                {# if if there are child travelers #}
                {% if travelers.child is defined  and  travelers.child > 0 %}
				<fieldset style="margin-top:30px; margin-bottom: 30px;">
					<legend>Enfant(s) : ({{ travelers.child }})</legend>
                    {% for i in 1 .. travelers.child %}
                        {%  set nbrPax =  nbrPax+1 %}
						<div class="form-row">
                           <input type="hidden" value="" />
							<div class="col-md-2 mb-3">
								<label for="firstName">Civilité </label>
								<select
										name="book[pax][{{ nbrPax }}][title]"
										class="form-control custom-select"
										placeholder="Civilité" required>
									<option value="Mme">Madame</option>
									<option value="M">Monsieur</option>

								</select>
							</div>

							<input type="hidden" value="child" name="book[pax][{{ nbrPax }}][type]" />
							<input type="hidden" value="{{ i+4 }}" name="book[pax][{{ nbrPax }}][age]" />

							<div class="col-md-2 mb-3">
								<label for="firstName">Nom</label>
								<input type="text"
									   name="book[pax][{{ nbrPax }}][firstName]"
									   class="form-control" id="firstName-{{ counter }}"
									   value="Misterfly{#% if counter == 0 %}{{ app.session.get('user').NOM }} {% endif %#}" required />

							</div>

							<div class="col-md-2 mb-3">
								<label for="lastName">Prénom</label>
								<input type="text"
									   name="book[pax][{{ nbrPax }}][lastName]"
									   class="form-control"
									   value="{#% if counter == 0 %}{{ app.session.get('user').NOM }} {% endif %#}" required />
							</div>

							<div class="col-md-2  mb-3">
								<label for="birthDate">Date de naissance</label>

								<input type="text"
									   name="book[pax][{{ nbrPax }}][birthDate]"
									   class="form-control"
									   placeholder="01/01/1999"
									   value="01/01/2010"
									   required />
							</div>

							<div class="col-md-2 mb-3">
								<label for="birthDate">Bagages</label>
								<select
										name="book[pax][{{ nbrPax }}][bagage]"
										class="form-control custom-select"
										placeholder="" required>

									<option selected>Sélectionnez votre bagage</option>

                                    {% for baggageInfo in fareDetails.baggageInformation %}

										{# ------- payant non inclu ---------- #}
                                        {% if baggageInfo.id is defined %}
											<option value="{{ baggageInfo.id }}">
                                                {{ baggageInfo.baggageWeight.weight }}
                                                {{ baggageInfo.baggageWeight.unit }}
                                                {{ baggageInfo.net|round }} €
											</option>
                                        {% else %}
                                            {# -------  inclu ---------- #}
											<option>
                                                {% if  baggageInfo.numberOfPieces is defined %}
                                                    {{  baggageInfo.numberOfPieces }}
                                                {% endif %}
												bagage de

                                                {% if baggageInfo.baggageWeight.weight is defined %}
                                                    {{ baggageInfo.baggageWeight.weight }}
                                                {% endif %}

                                                {% if baggageInfo.baggageWeight.unit  is defined %}
                                                    {{ baggageInfo.baggageWeight.unit }}
                                                {% endif %}

												inclu
											</option>
                                        {% endif %}
                                    {% endfor %}
								</select>
							</div>

						</div>
                    {% endfor %}
				</fieldset>
				{% endif %}

                {% if travelers.infant is defined and travelers.infant >0 %}
				<fieldset >
					<legend>Bébé(s) : ({{ travelers.infant }})</legend>
                    {% for i in 1 .. travelers.infant %}
                        {%  set nbrPax =  nbrPax+1 %}
						<div class="form-row">

							<div class="col-md-2 mb-3">
								<label for="firstName">Civilité</label>
								<select
										name="book[pax][{{ nbrPax }}][title]"
										class="form-control custom-select"
										placeholder="Civilité" required>
									<option value="M">Monsieur</option>
									<option value="Mme">Madame</option>
								</select>
							</div>

							<input type="hidden" value="infant" name="book[pax][{{ nbrPax }}][type]" />

							<div class="col-md-2 mb-3">
								<label for="firstName">Nom</label>
								<input type="text"
									   name="book[pax][{{ nbrPax }}][firstName]"
									   class="form-control" id="firstName-{{ counter }}"
									   value="Misterfly{#% if counter == 0 %}{{ app.session.get('user').NOM }} {% endif %#}" required />

							</div>

							<div class="col-md-2 mb-3">
								<label for="lastName">Prénom</label>
								<input type="text"
									   name="book[pax][{{ nbrPax }}][lastName]"
									   class="form-control"
									   value="{#% if counter == 0 %}{{ app.session.get('user').NOM }} {% endif %#}" required />
							</div>

							<div class="col-md-2  mb-3">
								<label for="birthDate">Date de naissance</label>

								<input type="text"
									   name="book[pax][{{ nbrPax }}][birthDate]"
									   class="form-control"
									   placeholder="01/01/1999"
									   value="01/01/2020"
									   required />
							</div>

							<div class="col-md-2 mb-3">
								<label for="birthDate">Bagages</label>
								<select
										name="book[pax][{{ nbrPax }}][bagage]"
										class="form-control custom-select"
										placeholder="" required>

									<option selected>Sélectionnez votre bagage</option>

                                    {% for baggageInfo in fareDetails.baggageInformation %}

                                        {% if baggageInfo.id is defined %}
											<option value="{{ baggageInfo.id }}">
                                                {{ baggageInfo.baggageWeight.weight }}
                                                {{ baggageInfo.baggageWeight.unit }}
                                                {{ baggageInfo.net|round }} €
											</option>

                                        {% else %}
											<option>
                                                {% if  baggageInfo.numberOfPieces is defined %}
                                                    {{  baggageInfo.numberOfPieces }}
                                                {% endif %}
												bagage de

                                                {% if baggageInfo.baggageWeight.weight is defined %}
                                                    {{ baggageInfo.baggageWeight.weight }}
                                                {% endif %}

                                                {% if baggageInfo.baggageWeight.unit  is defined %}
                                                    {{ baggageInfo.baggageWeight.unit }}
                                                {% endif %}
												inclu
											</option>
                                        {% endif %}
                                    {% endfor %}
								</select>
							</div>

						</div>
                    {% endfor %}
				</fieldset>
                {% endif %}

				<fieldset style="margin-top:30px; margin-bottom: 30px;">
					<legend>Contact </legend>

					<div class="form-row">

						<div class="col-md-2 mb-3">
							<label for="firstName">Civilité</label>
							<select
									name="book[contact][title]"
									class="form-control custom-select"
									placeholder="Civilité" required>
								<option value="M">Monsieur</option>
								<option value="Mme">Madame</option>
							</select>
						</div>

						<div class="col-md-2 mb-3">
							<label for="lastName">Nom</label>
							<input type="text"
								   name="book[contact][lastName]"
								   class="form-control" id="firstName-{{ counter }}"
								   value="Misterfly" required />

						</div>

						<div class="col-md-2 mb-3">
							<label for="firstName">Prénom</label>
							<input type="text"
								   name="book[contact][firstName]"
								   class="form-control"
								   value="Julien" required />
						</div>

						<div class="col-md-2  mb-3">
							<label for="birthDate">Email</label>

							<input type="text"
								   name="book[contact][email]"
								   class="form-control"
								   value="julien@mister.com"
								   placeholder="" required />
						</div>

						<div class="col-md-2 mb-3">
							<label for="birthDate">Téléphone</label>
							<input
									name="book[contact][phone]"
									class="form-control custom-select"
									placeholder=""
									value="06 25 25 47 85" />
						</div>

					</div>

					<div class="form-row">

						<div class="col-md-2 mb-3">
							<label for="lastName ">Adresse</label>
							<input type="text"
								   name="book[contact][address]"
								   class="form-control"
								   value="45 rue de France"/>

						</div>
						<div class="col-md-2 mb-3">
							<label for="lastName ">Code postal</label>
							<input type="text"
								   name="book[contact][zipCode]"
								   class="form-control"
								   value="75600"/>

						</div>
						<div class="col-md-2 mb-3">
							<label for="lastName ">Ville</label>
							<input type="text"
								   name="book[contact][cityName]"
								   class="form-control"
								   value="Paris" />

						</div>
						<div class="col-md-2 mb-3">
							<label for="lastName ">Pays</label>
							<select type="text" class="form-control custom-select"
								   name="book[contact][countryCode]"
								   required >
								<option value="FR">France</option>
							</select>

						</div>

					</div>

				</fieldset>


				<div class="form-row">
					<div class="col-md-4 mb-3"></div>
					<div class="col-md-4 mb-3">
						<div class="input-group">
							<div class="input-group-prepend">
								<span class="input-group-text"><i class="fas fa-luggage-cart"></i></span>
							</div>
							<button
									type="submit"
									class="form-control"
									id="submit-book"
									value=" Réserver"
									style="background-color:#F7831A;color:white">Réserver
							</button>
						</div>
					</div>
					<div class="col-md-4 mb-3"></div>
				</div>



			</form>
		</div>

	</section>

	{{ dump(search) }}
    {{ dump(pointToPoint) }}
    {{ dump(fareDetails) }}




 {% if flights is defined  %}
	<section id="search" style="background:url('/images/bg/aeroport.jpg') no-repeat;background-size: cover;">
		<div class="container">

		<div class="row">
			<div class="col-md-3">

				{% if flights.status is defined  %}
                {{ flights.code }}  : {{ flights.message }}
				{% else %}

					{{ flights.sessionid }}
					{% for key, flight in flights %}
						{% if key != "sessionid" %}
						 <li> {{ flight.fare.net}} </li>

							{% for ptop in flight.pointToPoints %}
								{{ ptop.id }}
							{% endfor %}

						 {% endif %}
					{% endfor %}
                {% endif %}
                {{ dump(flights) }}
			</div>
		</div>
		</div>
	</section>
	{% endif %}

{% block javascripts %}

<script type="text/javascript">

	$("#submit-search").on( "click", function() {
                $(".spinner").removeClass('d-none').addClass('d-block');
    });


{% endblock %}  <!-- /Optional js -->

{% endblock %}