@extends('template.cadastro')
@section('title')
    {{ custom_system('NOME_SISTEMA') }} - Recuperar Senha
@stop
@section('conteudo')


    <!-- reperar senha  -->
    <div id="login-page" class="row">
        <div class="col s12 z-depth-4 card-panel font-weight-900 grey-text border-radius-10">

            <div class="login-form">
                <div class="row">
                    <div id="titulo" class="input-field col s12 center-align">
                        <img src="{{ custom_system('LOGO') }}" width="150" height="150">
                        <h5 class=" font-weight-700">Recuperar senha</h5>
                    </div>
                </div>

                <div id="load" hidden class="center-align">
                    <div class=" preloader-wrapper large active">
                        <div class="spinner-layer spinner-orange-only">
                            <div class="circle-clipper left">
                                <div class="circle"></div>
                            </div>
                            <div class="gap-patch">
                                <div class="circle"></div>
                            </div>
                            <div class="circle-clipper right">
                                <div class="circle"></div>
                            </div>
                        </div>
                    </div>
                </div>

                <form id="formEmail" method="post" action="/esqueciminhasenha">
                    {{ csrf_field() }}
                    <div class="row margin col s12 ">
                        <div class="input-field">
                            <input id="email" name="email" type="text">
                            <label for="email">E-mail*</label>
                        </div>
                    </div>
                    <div onclick="validaEmail()" class=" row center-align">
                        <a class="waves-effect waves-light  btn">Enviar</a>
                    </div>
                </form>

                <div hidden id="nao-validado" class="center-align">
                    <i class="material-icons" style="font-size: 60px;">report_problem</i>
                    <spam>
                        <p>
                            Que pena!<br>
                            Esse E-mail não existe em nossos registros.
                            Faça seu cadastro ou Tente novamente!
                        </p>
                        <p>
                            <a href="/registro" style="color: #f57f17">Cadastre-se</a>
                            &emsp; &emsp; &emsp; &emsp;
                            <a href="/esqueciminhasenha" style="color: #f57f17">Tentar Novamente</a>
                        </p>
                    </spam>
                </div>

                <div hidden id="validado" class="center-align">
                    <i class="material-icons" style="font-size: 60px;">email</i>
                    <spam>
                        <p>
                            Tudo Certo!<br>
                            Confira sua caixa de email,
                            já enviamos um link para você redefir sua senha.
                        </p>
                    </spam>
                </div>

            </div>
        </div>
    </div>
@endsection
@section('script')
    <script>

        $("#formEmail").validate({
            rules: {
                email: {
                    required: true,
                    email: true
                },
            },
            messages: {
                email: {
                    required: "O campo E-mail é obrigatório!",
                },
            },
            errorElement: 'div',
            errorPlacement: function (error, element) {
                var placement = $(element).data('error');
                if (placement) {
                    $(placement).append(error)
                } else {
                    error.insertAfter(element);
                }
            }
        });


        function validaEmail() {

            var valida = $('#formEmail').validate();
            valida.form();
            var retorno = valida.form();

            if (retorno === false) {

                $('#formEmail').attr('hidden', 'hidden');
                $('#load').attr('hidden', 'hidden');
                $('#titulo').attr('hidden', 'hidden');
                $('#nao-validado').removeAttr('hidden', 'hidden');
                $('#load').removeAttr('hidden', 'hidden');

            } else {

                verificarEmail();

            }
        }

        function verificarEmail() {

            $.ajax({
                type: 'POST',
                dataType: 'json',
                url: '/registro/validar/email',
                data: $('#formEmail').serialize(),
                beforeSend: function () {

                    $('#formEmail').attr('hidden', 'hidden');
                    $('#load').removeAttr('hidden', 'hidden');

                },
                success: function (data) {

                    if (data === false) {

                        $('#load').attr('hidden', 'hidden');
                        $('#titulo').attr('hidden', 'hidden');
                        $('#validado').removeAttr('hidden', 'hidden');
                        $('#formEmail').attr('hidden', 'hidden');

                        setTimeout(function () {
                            $('#formEmail').submit();
                        }, 500);

                    } else {

                        $('#load').attr('hidden', 'hidden');
                        $('#titulo').attr('hidden', 'hidden');
                        $('#nao-validado').removeAttr('hidden', 'hidden');

                    }

                },
                error: function (xhr) {

                }
            });
        }
    </script>

@stop