@extends('../../master_layout/website_master')

@section('title')
<title>{{env('APP_NAME')}} :: Register Advertiser</title>
@endsection


@section('heading')
<section class="page-heading">
    <div class="container-fluid">
        <div class="row">
            <div class="col-12">
                <div class="content">
                    <a href="javascript:history.back()" class="btn btn-link">
                        <i class="fa fa-angle-left"></i> Back
                    </a>
                    <h1>Escort Advertising for Independents</h1>
                    <a href="#" class="btn btn-link hidden">
                        Next <i class="fa fa-angle-right"></i>
                    </a>
                </div>
            </div>
        </div>
    </div>
</section>
@endsection

@section('content')

@if (session('errors'))
<div class="alert alert-danger alert-dismissible">
    @foreach($errors->all() as $message)
    <li class="text-danger">{{$message}}</li>
    @endforeach
</div>
@endif

<!-- Section: Signup Block -->
<section class="overflow-hidden login-page">
<div class="container px-4 px-md-5 text-lg-start ">
    <div class="row gx-lg-5 mb-5">
        <!-- Message-->
        @if (session('message'))
        <div class="col-12">
            <div class="alert alert-{{session('message.type')}} alert-dismissible fade show" role="alert">
                @if(session('message.type')=='danger')
                <strong>Oops!</strong> {!! session('message.text') !!}
                @else
                <strong>Success!</strong> {!! session('message.text') !!}
                @endif
                <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
        </div>
        @endif
        <!--end message-->

        <div class="col-lg-6 mb-5 mb-lg-0 position-relative">
            <div class="card bg-glass">                
                <div class="card-body px-4 py-5 px-md-5">
                    <h3 class="mb-4">Register As an Escort</h3>     
                    
                    
                    <div class="mb-4">                        
                        <a href="{{ route('google.signup-advertiser') }}" class="btn btn-main auth-form-btn flex-grow w-100">
                            <img src="{{asset('public/frontend_assets/images/icon/google.svg')}}" class="mr-2" width="18" height="18"> Sign up with Google
                        </a>
                    </div>  

                                    </div>
            </div>
        </div>
        <div class="col-lg-6 mb-lg-0 text-center" style="z-index: 10">
            <img class="img-fluid" src="{{asset('public/frontend_assets/images/girls.png')}}" alt="">
        </div>
        
    </div>
</div>
</section>
<!-- Section: Signup Block -->
@endsection

@section('custom_js')
<script>
    $(function() {
        $('#addAdvertiser').validate({
            rules: {
                login_username: {
                    required: true,
                    email: true,
                    remote: {
                        url: "{{ route('user.check.email')}}",
                        type: "get",
                        data: {
                            login_username: function() {
                                return $("#login_username").val();
                            }
                        },
                        dataType: 'json'
                    }
                },

                login_password: {
                    required: true,
                },

                /*type: {
                    required: true,
                },*/

                display_name: {
                    required: true,
                    alphanumeric: true,
                    remote: {
                        url: "{{ route('user.check.display.name')}}",
                        type: "get",
                        data: {
                            display_name: function() {
                                return $("#display_name").val();
                            }
                        },
                        dataType: 'json'
                    }
                },

                term_accept: {
                    required: true,
                }



            },
            messages: {
                login_username: {
                    required: "Please enter email",
                    remote: "This email is already registered. Please try with another one"

                },
                login_password: {
                    required: "Please enter password",
                },
                display_name: {
                    required: "Please enter display name",
                    remote: "This display name is already registered. Please try with another one"
                },

                /*type: {
                    required: "Please select your option"

                },*/

                term_accept: {
                    required: "Please accept the terms and conditions",
                }
            },
            errorElement: 'span',
            errorPlacement: function(error, element) {
                error.addClass('invalid-feedback');
                element.closest('.form-group').append(error);
            },
            highlight: function(element, errorClass, validClass) {
                $(element).addClass('is-invalid');
            },
            unhighlight: function(element, errorClass, validClass) {
                $(element).removeClass('is-invalid');
            }
        });

    });
</script>
@endsection