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

{% block content %}

	{% embed "embed/page.html.twig" %}

		{% block page_title %}
			{% import "macro.html.twig" as macro %}
			<h3>Csoport hozzáadása</h3>

			<div class="logo-container">
				{{ macro.projectLogo(form.vars["projectName"]) }}
			</div>
		{% endblock %}

		{% block page_content %}
			{% set projectName = form.vars["projectName"] %}
			{{ form_start(form) }}
			{% set updateType = form.updateAnswer %}
			<div class="d-flex align-items-center justify-content-start mb-3">
				Állandó csoport:
				{% if permanentAppointments|length %}
					<div class="dropdown show ml-2">
						<a class="btn btn-danger dropdown-toggle" href="#" role="button" id="dropdownMenuLink"
						   data-toggle="dropdown"
						   aria-haspopup="true" aria-expanded="false">
							{% if currentPermanentAppointment is not null %}
								{{ currentPermanentAppointment.name }}
							{% else %}
								Nincs
							{% endif %}
						</a>
						<div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuLink">
							<a class="dropdown-item {{ currentPermanentAppointment is null ? "active" : "" }}"
							   href="{{ path('make_appointment', {
								   'project': app.request.attributes.get("project")
							   }) }}">Nincs</a>
							{% for permanentAppointment in permanentAppointments %}
								<a class="dropdown-item {{ permanentAppointment == currentPermanentAppointment ? "active" : "" }}"
								   href="{{ path('make_permanent_appointment', {
									   'project': app.request.attributes.get("project"),
									   "appointmentId": permanentAppointment.id
								   }) }}">{{ permanentAppointment.name }}</a>
							{% endfor %}
						</div>
					</div>
				{% else %}
					<a href="{{ path("add_permanent_appointments") }}" class="btn btn-danger ml-2">
						Állandó csoport hozzáadása
					</a>
				{% endif %}
			</div>
			<h4 class="">Helyszín</h4>
			<div class="row" data-component="tourTypeChooser">
				<div class="col-sm-4">
					{% set tourTypeOptions = {label: "Program / túra helyszín", attr: {class: 'sortSelect'}} %}
					{% if form.tourType.vars.choices|length > 1 %}
						{% set tourTypeOptions = tourTypeOptions|merge({placeholder: "Válassz!"}) %}
					{% endif %}

					{{ form_row(form.tourType, tourTypeOptions) }}
				</div>
				<div class="col-sm-8">
					<label class="descriptionLabel">Helyszín leírás</label>
					{% for key, tourTypeDescription in form.vars["tour_type_descriptions"] %}
						<div class="tour-type-description {{ key }} d-none">
							{{ tourTypeDescription }}
						</div>
					{% endfor %}
				</div>
			</div>
			<h4 class="">Iskola</h4>
			<div class="row">
				<div class="col-md-6">
					{{ form_row(form.schoolName, {label: "Neve"}) }}
				</div>
			</div>
			{{ form_label(form.schoolAddress, "Címe") }}
			<div class="row">
				<div class="col-sm-3">
					{{ form_row(form.schoolAddress.county, {label: "Megye"}) }}
				</div>
				<div class="col-sm-3">
					{{ form_row(form.schoolAddress.postcode, {label: "Irányítószám"}) }}
				</div>
				<div class="col-sm-3">
					{{ form_row(form.schoolAddress.city, {label: "Település"}) }}
				</div>
				<div class="col-sm-3">
					{{ form_row(form.schoolAddress.street, {label: "Utca/házszám"}) }}
				</div>
			</div>
			<h4 class="">Szervező tanár</h4>
			<div class="row">
				<div class="col-sm-4">
					{{ form_row(form.organizingTeacherName, {label: "Neve"}) }}
				</div>
				<div class="col-sm-4">
					{{ form_row(form.organizingTeacherEmail, {label: "E-mail címe"}) }}
				</div>
				<div class="col-sm-4">
					{{ form_row(form.organizingTeacherPhone, {label: "Telefonszáma"}) }}
				</div>
			</div>
			<h4 class="">Csoport</h4>
			<div class="row">
				<div class="col-sm-4">
					{{ form_row(form.appointmentName, {label: "Neve"}) }}
				</div>
			</div>
			<div class="row">
				<div class="col-sm-3">
					{{ form_row(form.headCount, {type: 'text', label: "Tervezett létszám (min. %s- max. %s fő )"|format(form.vars["min_date_capacity"], form.vars["max_date_capacity"])}) }}
				</div>
				<div class="col-sm-3">
					{{ form_row(form.averageAge, {type: 'text', label: "Tervezett korosztály", placeholder: "Válassz!"}) }}
				</div>
				<div class="col-sm-4">
					<div class="form-group">
						{{ form_label(form.accompanyingNumber, "Kísérő személyek száma") }}
						{% if projectName == "row" %}
							<p style="font-size: 12px">
								Minden kenuban 1 felnőtt kísérő szükséges. <br/>
								Egy kenuban 6 gyerek fér el. Az egyik kenu kísérője a túravezető, a többi kenuba 1
								felnőtt kísérőt a résztvevőknek kell biztosítani.<br/>
								Példa: 24 gyerek 4 kenuba fér el. Az 1. kenu kísérője a túravezető, így nektek 3 felnőtt kísérővel kell érkeznetek.
							</p>
						{% elseif projectName == "bike" %}
							<p style="font-size: 12px">
								Minden csoporthoz 3 felnőtt kísérő szükséges.<br/>
								A kerékpáros csoport elején, közepén és a végén is kell egy kísérő!
							</p>
						{% endif %}
						{{ form_widget(form.accompanyingNumber, {placeholder: "Válassz!"}) }}
					</div>
				</div>
			</div>


			{% import "macro.html.twig" as macro %}
			<div class="row mt-3">
				<div class="col-md-4 offset-md-4 d-flex justify-content-between">
					<a href="{{ macro.teacherConsent(projectName) }}" target="_blank"
					   class="btn btn-primary mr-2">
                            <span class="title">
                                Tanári felelősségvállalási nyilatkozat
                            </span>
					</a>
					<a href="{{ macro.parentConsent(projectName) }}"
					   class="btn btn-primary"
					   target="_blank">
                            <span class="title">
                                Szülői nyilatkozat sablon
                            </span>
					</a>
				</div>
			</div>
			{% do updateType.setRendered() %}
			{{ form_rest(form) }}
			<div class="d-flex justify-content-between mt-3">
				{% if currentPermanentAppointment is not null %}
					<a href="{{ path('show_available_projects_for_permament_appointment', {
						appointmentId: currentPermanentAppointment.id
					}) }}" class="btn btn-outline-secondary">
						<i class="fa fa-fw fa-angle-double-left"></i> Vissza
					</a>
				{% else %}
					<a href="{{ path('show_available_projects_for_appointment') }}" class="btn btn-outline-secondary">
						<i class="fa fa-fw fa-angle-double-left"></i> Vissza
					</a>
				{% endif %}
				<button class="btn btn-primary" type="submit">
					<i class="fa fa-fw fa-save"></i> Mentés
				</button>
			</div>
			{{ form_end(form) }}
		{% endblock page_content %}

	{% endembed %}

{% endblock content %}