{% extends 'front/layout.html.twig' %}

{% block content %}

{% include 'front/components/navbar.html.twig' %}

<header id="header" class="no-index" style="background: url({{ asset('assets/files/booking/cover.jpg') }} ) no-repeat center center scroll;">
    <div class="header-wrapper">
        <div class="container">
            <div class="row">
                <div class="col-xs-12 col-md-10 col-lg-8 col-md-offset-1 col-lg-offset-2">
                    {% include 'front/components/booking-form.html.twig' %}
                </div>
            </div>
        </div>
    </div>
</header>

<section id="my-booking">
    <div class="container">
        <div class="row">
            <div class="col-xs-12">
                {% block flashMessages %}
                    {% for flashMessage in app.session.flashbag.get('accommodationNotAvailable') %}
                        <div class="row message">
                            <div class="col-xs-12">
                                <div class="alert alert-danger alert-dismissible" role="alert">
                                    <i class="fa fa-exclamation-triangle"></i> {{ flashMessage }}
                                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                </div>
                            </div>
                        </div>
                    {% endfor %}
                {% endblock %}

            <h2>{{ "menu.my.booking" | trans({}, 'plaza') }}</h2>
            <p class="subheader">
                {{ "my.booking.1.reference.description.1" | trans({}, 'plaza') }}<br>
                ({{ "my.booking.1.reference.description.2" | trans({}, 'plaza') }}).
            </p>
            </div>
            <div class="col-xs-12">
                <form id="my-booking-form" name="my-booking-form" action="{{ path(app.request.attributes.get('_route'), app.request.attributes.get('_route_params')) }}" method="POST">
                    <input name="reserv_id" class="form-control" style="border-radius:0;"
                        placeholder="{{ "my.booking.1.enter.reference" | trans({}, 'plaza') }}" autocomplete="off" required>
                    <input id="reservArrival" name="check_in" class="form-control date" style="border-radius:0;"
                        placeholder="{{ "my.booking.2.arrival" | trans({}, 'plaza') }}" required readonly>
                    <input name="email" class="form-control" style="border-radius:0;"
                        placeholder="{{ "booking.step.2.enter.email" | trans({}, 'plaza') }}" required>
                    <button type="submit" class="btn btn-blue">{{ "my.booking.1.go" | trans({}, 'plaza') }}</button>
                </form>

{#                {{ form_start(myBookingForm) }}#}
{#                    {{ form_widget(myBookingForm.reference, {'attr': {'class': 'form-control', 'style': 'border-radius:0;', 'placeholder': "my.booking.1.enter.reference" | trans({}, 'plaza'), 'value': reference ? reference, 'autocomplete': 'off'} }) }}#}
{#                    <br>#}
{#                    {{ form_widget(myBookingForm.email, {'attr': {'class': 'form-control', 'style': 'border-radius:0;', 'placeholder': "booking.step.2.enter.email" | trans({}, 'plaza')} }) }}#}
{#                    <br>#}
{#                    {{ form_widget(myBookingForm.submit, {'label': "my.booking.1.go" | trans({}, 'plaza'),'attr': {'class': 'btn btn-blue'} }) }}#}
{#                {{ form_end(myBookingForm) }}#}
            </div>
        </div>
    </div>
</section>

{% endblock %}

{% block javascripts %}
{{ parent() }}
{% include 'front/default/js/my-booking.html.twig' %}
{% endblock %}