{% extends '@syndexContactUs/layout.html.twig' %}

{% block title %}{{ 'page.title'|trans({}, 'ContactUs') }}{% endblock%}

{% block body %}
    {#<div id="envelope">#}
<div class="container-fluid">
    <div class="row">
        <div class="col-sm-6 col-sm-offset-3">
            <div class="page-header">
                <h2 style="color:#00a550;">{{ 'page.title'|trans({}, 'ContactUs') }}</h2>
            </div>
            <div>
                <p>{{ 'page.message'|trans({}, 'ContactUs') }}</p>
            </div>
            {% for flashMessage in app.session.flashbag.get('notice') %}
                <div class="alert alert-success" role="alert">
                    <div align="right" style="font-weight: bold;">{{ flashMessage }}</div>
                </div>
            {% endfor %}
            <div>
                <br>
            <form class="form-horizontal" id="contact-us-form" action="{{ path('syndexContactUsBundle_contact') }}" method="post"  novalidate>
                {{form_row(form._token)}}
                <div class="form-group">
                    <label class="control-label">{{ 'page.name'|trans({}, 'ContactUs') }}</label>
                    {{ form_widget(form.name, { 'attr': {'dir': 'rtl'} }) }}

                    {% if form_errors(form.name) is not empty %}
                            {{ form_errors(form.name) }}
                    {% endif %}
                </div>
                <div class="form-group">
                    <label class="control-label">{{ 'page.email'|trans({}, 'ContactUs') }}</label>
                    {{form_widget(form.email, {'attr': {'dir': 'rtl'}})}}
                    {% if form_errors(form.email) is not empty %}
                            {{ form_errors(form.email) }}
                    {% endif %}
                </div>

                <div class="form-group" id="email-confirm">
                    <label class="control-label">تأكيد البريد الإلكتروني </label>
                        <input id="email-confirm" name="email-confirm"  placeholder="أكد بريدك الالكتروني" class="form-control" type="email">
                </div>

                <div class="form-group">
                    <label class="control-label">{{ 'page.mailTitle'|trans({}, 'ContactUs') }}</label>
                    {{form_widget(form.subject, {'attr': {'dir': 'rtl'}})}}
                    {% if form_errors(form.subject) is not empty %}
                            {{ form_errors(form.subject) }}
                    {% endif %}
                </div>
                <div class="form-group">
                    <label class="control-label">{{ 'page.mailText'|trans({}, 'ContactUs') }}</label>
                    {{form_widget(form.body, {'attr': {'dir': 'rtl'}})}}
                    {% if form_errors(form.body) is not empty %}
                            {{ form_errors(form.body) }}
                    {% endif %}
                </div>

                    {% if form.reCaptcha is defined %}
                        <div class="form-group">
                            {{ form_errors(form.reCaptcha) }}
                            {{ form_widget(form.reCaptcha,
                                    {'attr': {'data-toggle':'reCaptcha',
                                    'data-type':'checkbox',
                                }}) }}
                            {{form_errors(form.reCaptcha)}}
                        </div>
                    {% endif %}
                    <br/>
                {{form_errors(form)}}
                <hr>
                <input type="submit" value="{{ 'page.send'|trans({}, 'ContactUs') }}" class="btn" style="color: white;background-color: #00a550" />
            </form>
        </div>
    </div>
    </div>
    </div>
{% endblock %}


{% block javascripts %}
    {{ parent() }}
    <script type="text/javascript" src="https://www.google.com/recaptcha/api.js?onload=onGoogleReCaptchaApiLoad&render=explicit&hl={{app.request.locale}}" async defer></script>
    <script src="{{ asset('bundles/syndexacademic/js/tagmanager.js') }}" ></script>
    <script src="{{ asset('bundles/syndexacademic/js/bootstrap-filestyle.min.js') }}"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/jquery-form-validator/2.2.43/jquery.form-validator.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/qtip2/3.0.2/jquery.qtip.js"></script>
    <script src="{{ asset('bundles/syndexacademic/js/jquery.are-you-sure.js') }}"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-form-validator/2.2.43/jsconf.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-form-validator/2.2.43/file.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-form-validator/2.2.43/date.js"></script>
    <script src="{{ path('contact_us_bundle_translate_files',{'file':'ContactUs'}) }}"></script>
    <script src="{{ asset('bundles/syndexcontactus/js/new_contactUs.js') }}?v=2" ></script>
{% endblock %}