{% extends '@RxConnexion/Layouts/global.html.twig' %}

{% block body %}

    {% include '@RxConnexion/Layouts/fixed_header_only.html.twig' %}

    {% if errors|length > 0 %}

        <div class="row">
            <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">

                <div data-alert class="alert-box alert" style="margin-top: 20px;">
                    {% for error in errors %}
                        <div>{{ error }}</div>
                    {% endfor %}
                </div>

            </div>
        </div>

    {% endif %}

    <div class="row">
        <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">

            <div class="rxgrab-registration-form-container">

                <h1>Clinic Registration</h1>

                <form method="POST" action="{{ path('rx_grab_front_end_health_facility_registration') }}" novalidate>
                    <div class="row">
                        <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">
                            {{ form_label(form.healthFacilityType) }}
                            {{ form_widget(form.healthFacilityType) }}
                        </div>
                    </div>
                    <div class="row">
                        <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">
                            {{ form_label(form.company_description) }}
                            {{ form_widget(form.company_description) }}
                        </div>
                    </div>
                    <div class="row">
                        <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">
                            {{ form_label(form.branch_description) }}
                            {{ form_widget(form.branch_description) }}
                        </div>
                    </div>
                    <div class="row">
                        <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">
                            {{ form_label(form.description) }}
                            {{ form_widget(form.description) }}
                        </div>
                    </div>
                    <div class="row">
                        <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">
                            {{ form_label(form.street) }}
                            {{ form_widget(form.street) }}
                        </div>
                    </div>
                    <div class="row">
                        <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">
                            <label class="required" for="healthFacilityRegistrationCity">City</label>
                            <select name="city" id="healthFacilityRegistrationCity">
                                {% for country in countries %}
                                    {% for province in country.provinces %}
                                        {% for city in province.cities %}
                                            <option class="{{ province.id }}" value="{{ city.id }}" {{ addressData.city == city.id ? 'selected' : '' }} >{{ city.description }}</option>
                                        {% endfor %}
                                    {% endfor %}
                                {% endfor %}
                            </select>
                        </div>
                    </div>
                    <div class="row">
                        <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">
                            <label class="required" for="healthFacilityRegistrationProvince">Province</label>
                            <select name="province" id="healthFacilityRegistrationProvince">
                                {% for country in countries %}
                                    {% for province in country.provinces %}
                                        <option class="{{ country.id }}" value="{{ province.id }}" {{ addressData.province == province.id ? 'selected' : '' }} >{{ province.description }}</option>
                                    {% endfor %}
                                {% endfor %}
                            </select>
                        </div>
                    </div>
                    <div class="row">
                        <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">
                            <label class="required" for="healthFacilityRegistrationCountry">Country</label>
                            <select name="country" id="healthFacilityRegistrationCountry">
                                {% for country in countries %}
                                    <option value="{{ country.id }}" {{ addressData.country == country.id ? 'selected' : '' }} >{{ country.description }}</option>
                                {% endfor %}
                            </select>
                        </div>
                    </div>
                    <div class="row">
                        <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">
                            {{ form_label(form.zip_code) }}
                            {{ form_widget(form.zip_code) }}
                        </div>
                    </div>
                    <div class="row">
                        <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">
                            {{ form_label(form.mobile_no) }}
                            {{ form_widget(form.mobile_no) }}
                            {{ form_widget(form.mobile_no_two) }}
                            {{ form_widget(form.mobile_no_three) }}
                        </div>
                    </div>
                    <div class="row">
                        <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">
                            {{ form_label(form.phone_no) }}
                            {{ form_widget(form.phone_no) }}
                            {{ form_widget(form.phone_no_two) }}
                            {{ form_widget(form.phone_no_three) }}
                        </div>
                    </div>
                    <div class="row">
                        <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">
                            <label class="required">Email</label>
                            {{ form_widget(form.email) }}
                            {{ form_widget(form.email_two) }}
                            {{ form_widget(form.email_three) }}
                        </div>
                    </div>
                    <div class="row">
                        <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">
                            {{ form_label(form.website) }}
                            {{ form_widget(form.website) }}
                        </div>
                    </div>
                    <div class="row">
                        <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">
                            {{ form_label(form.facebook) }}
                            {{ form_widget(form.facebook) }}
                        </div>
                    </div>
                    <div class="row">
                        <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">
                            {{ form_label(form.twitter) }}
                            {{ form_widget(form.twitter) }}
                        </div>
                    </div>
                    <div class="row">
                        <div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns">
                            <hr>
                            <div class="buttons-container">
                                <button type="submit" class="button tiny rxgrab-submit-loading">Submit</button>
                                <a href="{{ path('rx_grab_front_end') }}" class="button tiny secondary">Cancel</a>
                            </div>
                        </div>
                    </div>

                    {{ form_widget(form.action) }}
                    {{ form_widget(form.id) }}
                    {{ form_widget(form._token) }}
                </form>
            </div>
        </div>
    </div>

    <script language="javascript">
        //<![CDATA[
        jQ(document).ready(function(){
            jQ('#healthFacilityRegistrationProvince').chained('#healthFacilityRegistrationCountry');
            jQ('#healthFacilityRegistrationCity').chained('#healthFacilityRegistrationProvince');
            jQ('.rxgrab-submit-loading').bind('click', global.submitLoading);
        });
        //]]>
    </script>

{% endblock %}