{% extends "layout.html.twig" %}

{% block content %}
	{% embed "embed/grid_page.html.twig" %}

		{% block page_title %}
			<a href="{{ path("filter_appointments" ) }}">
				<i class="fa fa-chevron-left" aria-hidden="true"></i>
			</a>
			<h3>Várólistás jelentkezés</h3>

		{% endblock %}

		{% block grid_body %}
			<div>
				<a href="{{ path('reserve_booking',{id: app.request.attributes.get('id')}) }}" class="btn btn-sm btn-danger text-nowrap"
				   title="Időpont foglalás">
					<i class="fa fa-calendar reserve-icon" aria-hidden="true"></i>
					Időpont foglalás
				</a>
			</div>
			<div class="subscribeBooking reserve-booking subscribe"
				 data-calendar="{{ path('show_booking_calendar',{id: app.request.attributes.get('id')}) }}">
				{{ form_errors(form) }}

				{% if cannotResolveBooking is defined %}
					<span class="alert alert-danger d-block">
				<span class="d-block">
                    <span class="form-error-icon badge badge-danger text-uppercase">Hiba</span>
					<span class="form-error-message">
						A kiválasztott időpont időközben elérhetetlenné vált. Válasszon másik időpontott.
					</span>
                </span>
			</span>
				{% endif %}

				<div class="calendar">
					<i class="fa fa-spinner fa-pulse fa-4x fa-fw loader"></i>
				</div>
				{{ form_start(form) }}
				<div style="display: none;">
					{{ form_widget(form.bookingDates, {type: "hidden", attr: {class: "bookingTimeIdSelect"}}) }}
				</div>
				<button type="button" class="btn btn-danger btn-block btn-lg reserve-button" data-toggle="modal" data-target="#subscribeConfirm">Várólistához adom</button>
				{% embed "embed/modal.html.twig" with {
					id: "subscribeConfirm"
				} %}
					{% block modal_title %}
						Foglalás rögzítés
					{% endblock %}

					{% block modal_body %}
						<p class="text-center">Felhívjuk figyelmed, hogy amennyiben rögzítettél foglalást, ne adj meg várólistás időpontot, mert az automatikusan az időpontod törlésével jár.</p>

						<p class="text-center">Az időpontok várólistára kerülnek. Amennyiben valamelyik kiválasztott időpont felszabadul, csoportod automatikusan megkapja. Erről e-mailben tájékoztatunk.</p>
					{% endblock %}

					{% block modal_footer %}
						<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">Mégsem</button>
						<button type="submit" class="btn btn-danger">Ok</button>
					{% endblock %}

				{% endembed %}
				{{ form_end(form) }}
			</div>
		{% endblock %}

	{% endembed %}

{% endblock %}