@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">  
                        @php
                        $route = array();
                        if(isset($dealercode) && $dealercode !=''){
                            $route['dealercode'] = $dealercode;
                        }                        
                        @endphp                      
                        <a href="{{ route('google.signup-advertiser',$route) }}" 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 class="py-2">
                        <small class="btn-block text-center my-1 text-uppercase or">or</small>
                    </div>
                    <form id="addAdvertiser" action="{{route('register.advertiser.process')}}" method="post" enctype="multipart/form-data">
                        <input type="hidden" name="dealercode" value="@if(isset($dealercode) && $dealercode !=''){{$dealercode}}@endif"/>
                        @csrf
                        <div class="form-group">
                            <label for="">Email</label>
                            <input type="email" name="login_username" id="login_username" class="form-control" placeholder="Enter your email" />
                            <small>
                                <i>Never displayed, never shared</i>
                            </small>
                        </div>
                        <div class="form-group">
                            <label for="">Password</label>
                            <input type="password" name="login_password" id="login_password" class="form-control" placeholder="Password" />
                            <small>
                                <i>Do not use the same password as on the other sites!</i>
                            </small>
                        </div>
                        <div class="form-group">
                            <label for="">Display name</label>
                            <input type="text" name="display_name" id="display_name" class="form-control" placeholder="Enter name you want to display" />
                            <small>
                                <i>Used on the forums</i>
                            </small>
                        </div>
                        <div class="form-group">
                            <div>
                                <label class="checkbox-one">I accept the <a href="{{route('cms.content',['slug'=>'terms-conditions'])}}">Terms and Conditions</a> of use
                                    <input type="checkbox" name="term_accept" value="1" id="term_accept" />
                                    <span class="checkmark"></span>
                                </label>
                            </div>
                        </div>
                        <div class="text-center">
                            <button class="btn btn-block btn-main" type="submit">Register Now</button>
                        </div>
                        <div class="extra-links mt-2">
                            <a href="{{route('login')}}">Already have an account? Sign In</a>
                        </div>
                    </form>                         
                    
                    <div class="help-adviser mt-4">
                        <h6 class="mb-2">Have questions?</h6>
                        <a href="{{route('cms.content',['slug'=>'help-for-advertisers'])}}">See Help for Escorts</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