{% extends 'speleoferata/base.html.twig' %}
{% block title %}Rezervace{% endblock %}
{% block body %}
    <section id="calendar-header" class="mb-5">
        <div class="container">
            <div class="row">
                <div class="col-12 text-center">
                    <h1 class="mb-5">Rezervace {{ product ? '- '~ product.name }}</h1>
                    {% if product and product.slug == 'speleoferata' %}
                        {#<p class="text-center">Pro nestandardní rezervace a pro rezervace Rande v jeskyni, Sólo pro 2 a variantu Rodina<br>nás kontaktujte na emailové adrese info@speleoart.cz</p>#}
                        <h4 class="text-center mb-5">Rezervační kalendář je pro skupinové vstupy. Pro rezervaci termínu na Rande v jeskyni, Sólo pro 2, Akce Rodina kontaktujte infolinku na info@speleoferata.cz</h4>
                        <a class="btn btn-success mr-1" href="{{ path('speleoferata_index') }}">Koupit voucher {{ product.name }}</a>
                    {% endif %}
                </div>
            </div>
        </div>
    </section>
    <section id="calendar-body" class="container">
        <div class="row justify-content-center">
            {% if product %}
                <div class="col-lg-8 col-md-10 col-12">
                    <p>
                        Volné termíny jsou označeny <span class="calendar-green">zeleně</span>
                    </p>
                </div>
        </div>
            <div class="row justify-content-center">
                <div class="col-6 col-md-5 col-lg-4">
                    <a id="calendar-prev-month" href="#">Předchozí</a>
                    <span id="calendar-month">Měsíc Rok</span>
                    <a id="calendar-next-month" href="#">Další</a>
                </div>
                <div class="col-6 col-md-5 col-lg-4 text-right">
                    <a id="calendar-actual-month" href="#">Přejít na aktuální měsíc</a>
                </div>
                <div id="calendar-days"
                     data-durl="{{ path('speleoferata_calendar_day', {'date': '__DATE__', 'id': product.id}) }}"
                     data-murl="{{ path('speleoferata_calendar_month', {'month': '__MONTH__', 'year': '__YEAR__', 'id': product.id}) }}"
                     class="col-12"></div>
            {% else %}
                <a href="{{ path('speleoferata_calendar_index', {'slug': 'speleoferata'}) }}" class="btn btn-lg btn-info">Speleoferata</a> &nbsp;
            {% endif %}
        </div>
    </section>
{% endblock %}
{% block javascripts %}
    {{ parent() }}
    <script src="{{ asset('build/js/calendar.js') }}"></script>
{% endblock %}