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

{% block body_class %}index{% endblock %}

{% block body %}
	<div class="row p-3" {{ stimulus_controller('index') }}>
		{# booking form #}
		<div class="col col-md-3 calendar-left">
			<h2>Réserver</h2>

			<div
				class="w-100"
				{{ stimulus_controller('my_bookings') }}
			>
				<p>Cliquez sur les jours où vous souhaitez occuper la maison, sur le calendrier.</p>

				<a
					href="{{ path('get_my_bookings_modal') }}"
					class="btn btn-purple mt-3 js-my-bookings-modal-btn"
					{{ stimulus_action('my_bookings', 'get', 'click') }}
				>
					Voir mes réservations
				</a>
			</div>
		</div>

		{# calendar #}
		<div
			class="col col-md-9 calendar js-calendar-container"
			{{ stimulus_controller('calendar') }}
			{{ stimulus_action('calendar', 'init', 'load@window') }}
			{{ stimulus_target('calendar', 'calendarWrapper') }}
			data-current-month="{{ 'now'|date('m') }}"
			data-current-year="{{ 'now'|date('Y') }}"
			data-load-month-url="{{ path('calendar_load_month') }}"
			data-save-booking-url="{{ path('booking_save') }}"
		></div>
	</div>
{% endblock %}