@extends('layouts/app')

@section('content')
<section class="page-header page-header-xs">
    <div class="container">

        <h1>Sign in at Webmoto.us</h1>

        <!-- breadcrumbs -->
        <ol class="breadcrumb">
            Category:
            <li><a href="#">Sign in</a></li>
            <li><a href="#"></a></li>
        </ol><!-- /breadcrumbs -->

    </div>
</section>
<div class="container margin-top-40">
    <div class="row">
        <div class="col-md-8 col-md-offset-2">
            <div class="panel panel-default">
                <div class="panel-heading"><h5>To complete the registration, please add an email address to your
                        account!</h5></div>

                <div class="panel-body">
                    <form class="form-horizontal" role="form" method="POST" action="{{ url('/emailrequest') }}">
                        {{ csrf_field() }}

                        <div class="form-group{{ $errors->has('email') ? ' has-error' : '' }}">
                            <label for="email" class="col-md-3 control-label">E-Mail</label>

                            <div class="col-md-7">
                                <input id="emailunique" type="email" class="form-control" name="email" value="{{ old('email') }}" required autofocus>

                                @if ($errors->has('email'))
                                <span class="help-block">
                                        <strong>{{ $errors->first('email') }}</strong>
                                    </span>
                                @endif
                            </div>
                            <div class="col-sm-2">
                                <div id="statuspass" class="text-left margin-top-6"></div>
                            </div>
                        </div>
                        <div class="col-sm-12 text-center">
                            <button type="submit" class="btn btn-blue mce-btn-large" id="submitbtn">Post</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

@endsection
@section('footer_scripts')
<script type="text/javascript">
    $(document).ready(function(){

        $("#emailunique").change(function() {

            var usrN = $("#emailunique").val();
            var token = jQuery("meta[name='csrf-token']").attr('content');

            if(usrN.length >= 4)
            {
                $("#statuspass").html('<img src="/images/loaders/5.gif"> Checking ...');

                $.ajax({
                    type: "PUT",
                    url : "{{ url('emailrequest') }}",
                    data: {email: usrN, _token: token},
                    success: function (res) {
                        console.log(res);
                        if (res.exists) {
                            $("#statuspass").html('');
                            swal("Error!", "This email address has already been used in another registration", "success");

                        } else {
                            $("#submitbtn").removeAttr('disabled');
                            $("#statuspass").html('');
                            $("#statuspass").html('<i class="fa fa-thumbs-o-up text-green size-18"></i>');
                        }
                    },
                    error: function (jqXHR, exception) {

                    }
                });

            } else {
                $("#statuspass").html('<i class="fa fa-warning text-warning" title="Invalid email!"></i>');

            }

        });

    });

</script>

@endsection