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

{% block title %}Pool Quote Request | {{ parent() }}{% endblock %}

{% block body %}
    <h1>New Fiberglass Pool Quote</h1>
    <p>We'd love to hear from you and answer any of your questions or concerns about installing a Luxury Pool. Please complete the form below so that we can contact you regarding your specific question or comment.</p>
    <div class="row">
        <div class="col-12 col-md-6 formWrapper">
            {{ include('contact_and_quote_requests/_quoteRequestForm.html.twig') }}
        </div>
        <div class="col-12 col-md-6">
            <img src="{{ asset('images/sitting-in-pool.jpg') }}" class="img-fluid" style="margin:0 auto;">
            <p style="font-weight:900;"><br>
                Corporate Office and Studio<br>
                1605 Shawnee Ave.<br>
                Columbus, OH 43211<br>
                P: 614-890-7665<br>
                F: 614-839-9211<br>
                Monday - Friday<br>
                7am - 4pm
            </p>
            <p style="font-weight:900;">
                Sales Team:<br>
                Columbus: 614-890-POOL<br>
                Cincinnati: 513-755-POOL
            </p>
            <p style="font-weight:900;">
                Distribution Yard<br>
                885 Harmon Ave<br>
                Columbus, OH 43223<br>
                Seasonal / By Appointment
            </p>
        </div>
    </div>
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script>
        $(document).ready(function () {

            $(document).on('submit', '.quoteRequest', function (event) {

                event.preventDefault();

                $.ajax({
                    url: '{{ path('quoteRequestSubmit') }}',
                    method: 'POST',
                    data: $('.quoteRequest').serialize(),
                    beforeSend: function () {
                        $('.formWrapper button').prop('disabled', true).html('Please wait.');
                    },
                    success: function (data) {
                        $('.formWrapper').html(data);
                    },
                    error: function (jqXHR) {
                        $('.formWrapper').html(jqXHR.responseText);
                        scrollToError();
                    }
                });
            });

        });
    </script>
{% endblock %}