{% extends 'front.html.twig' %}
{% block title %} Profile  {% endblock %}
{% block stytesheets %}
    {{ parent() }}
{% endblock %}
{% block body %}

    <div class="main-content">
        <section class="inner-header divider parallax layer-overlay overlay-white-8">
            <div class="container pt-60 pb-60">
                <!-- Section Content -->
                <div class="section-content">
                    <div class="row">
                        <div class="col-md-12 text-center" style="margin-top: -45px;">
                            <h2 class="title bg-text-new"> Profile</h2>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section>

            <div class="container mt-30 mb-30 pt-30 pb-30">
                <div class="col-md-8 pull-right flip sm-pull-none bg-lightest border-1px p-25 formEditPwd">



                    <div class="flip-card-3D-wrapper formEditPwd">
                        <div id="flip-card">
                            <!--form edit pwd -->
                            <div class="row">
                                <div class="col-md-6">
                                    {{ include('default/flash_bag.html.twig') }}

                                </div>
                            </div>
                            <div class="flip-card-front">
                                <div class="">



                                    <!-- form de change password -->
                                    <h3 class="bg-text-new text-uppercase m-0" style="">Changer  mot de passe </h3>
                                    <div class="line-bottom mb-30"></div>
                                    {{ form_start(form, {'method': 'post', 'attr': { 'id' : 'formEditPassword'}}) }}



                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="form-group mb-10">
                                                {{ form_widget(form.plainPassword.first , { 'attr': {'class': 'form-control', 'placeholder':'Mot de passe',  'id' : 'pwdFirst'}}) }}

                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="form-group mb-10">
                                                {{ form_widget(form.plainPassword.second , { 'attr': {'class': 'form-control', 'placeholder':'confirmer mot de passe',   'id' : 'pwdSecond'}}) }}

                                            </div>
                                        </div>
                                    </div>


                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="form-group">
                                                <button type="submit"
                                                        class="btn bg-new btnSavepwd2 pull-right">
                                                    Enregistrer
                                                </button>
                                            </div>
                                        </div>
                                    </div>

                                    {{ form_end(form) }}

                                </div>
                                <button id="flip-card-btn-turn-to-back" class="btn colorpremiere"  style=" margin-right: -27px;margin-top: -24px; color: #fff">Modifier
                                    Mes Informations
                                </button>
                            </div>
                            <!--form edit info -->
                            <div class="flip-card-back">
                                <div class="">

                                    <h3 class="bg-text-new text-uppercase m-0" style="">Modifier mes informations </h3>
                                    <div class="line-bottom mb-30"></div>

                                    <form method="post" action="{{ path('change-info') }}" id="formEditInfo" novalidate>

                                        <div class="row">
                                            <div class="col-sm-6">
                                                <div class="form-group mb-10">
                                                    <input type="text" id="userbundle_user_lastName" name="lastName"
                                                           value="{{ app.user.lastName }}"
                                                           required="required" class="form-control" placeholder="Nom"
                                                           aria-required="true">
                                                </div>
                                            </div>
                                            <div class="col-sm-6">
                                                <div class="form-group mb-10">
                                                    <input type="text" id="userbundle_user_firstName" name="firstName"
                                                           value="{{ app.user.firstName }}"
                                                           required="required" class="form-control" placeholder="Prénom"
                                                           aria-required="true">
                                                </div>
                                            </div>
                                        </div>

                                        <div class="row">
                                            <div class="col-sm-12">
                                                <div class="form-group mb-10">
                                                    <input type="email" id="userbundle_user_email" name="email"
                                                           value="{{ app.user.email }}"
                                                           required="required" class="form-control"
                                                           placeholder="Example@email.com"
                                                           aria-required="true">
                                                </div>
                                            </div>
                                        </div>


                                        <div class="row">
                                            <div class="col-sm-12">
                                                <div class="form-group mb-10">
                                                    <input type="text" id="userbundle_user_phone" name="phone"
                                                           value="{{ app.user.phone }}"
                                                           required="required" class="form-control"
                                                           placeholder="Téléphone"
                                                           aria-required="true">
                                                </div>
                                            </div>
                                        </div>

                                        <div class="row">
                                            <div class="col-sm-12">
                                                <div class="form-group mb-10">
                                                    <input type="hidden" value="{{ app.user.specialite }}" class="inputSpec">
                                                    <select id="userbundle_user_specialite" name="specialite"
                                                            required="required" class="form-control"
                                                            aria-required="true">

                                                            <option id="spec1" value="spec1" >Spec1</option>
                                                            <option id="spec3" value="spec3" >Spec3</option>
                                                            <option id="spec2" value="spec2" >Spec2</option>
                                                    </select>

                                                </div>
                                            </div>
                                        </div>



                                        <div class="row">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <button type="submit"
                                                            style="margin-top: 13px;"
                                                            class="btn bg-new btnSavepwd pull-right">
                                                        Enregistrer
                                                    </button>
                                                </div>
                                            </div>
                                        </div>


                                    </form>

                                </div>
                                <button type="button" id="flip-card-btn-turn-to-front"   style=" margin-top: -24px; color: #fff;margin-right: -27px;"
                                        class="btn colorpremiere">Modifier mot de passe
                                </button>

                            </div>

                        </div>
                    </div>


                </div>
                <div class="col-md-4">
                    <div class="sidebar sidebar-left mt-sm-30">
                        {{ render(controller('UserBundle:Profile:infoAdherent')) }}
                    </div>
                </div>
            </div>
        </section>
    </div>

{% endblock %}

        {% block javascripts %}
            {{ parent() }}
        {% endblock %}