@extends('layouts.app')

@section('content')
    <div class="main">
        <section class="signup">
            <!-- <img src="images/signup-bg.jpg" alt=""> -->
            <div class="container">

                <div class="signup-content">
                    <div class="card-header">
                        <a href="/" class="h1"><img src="{{ url('dashboard/img/Turant_logo.png') }}" width="30%"></a>
                      </div>
                    <form method="POST" id="login-form" class="login-form" action="{{ route('login') }}">
                        @csrf
                        <h2 class="form-title">{{ __('Login') }}</h2>
                        <div class="form-group">
                            <input id="email" type="email" class="form-input @error('email') is-invalid @enderror" name="email" value="{{ old('email') }}" required autocomplete="email" autofocus placeholder="Your Email">
                            @error('email')
                                <span class="text-danger" role="alert">
                                    <strong>{{ $message }}</strong>
                                </span>
                            @enderror
                        </div>
                        <div class="form-group">
                            <input id="password" type="password" class="form-input @error('password') is-invalid @enderror" name="password" required autocomplete="current-password"  placeholder="Password">
                            <span toggle="#password" class="zmdi zmdi-eye field-icon toggle-password"></span>
                            @error('password')
                                <span class="text-danger" role="alert">
                                    <strong>{{ $message }}</strong>
                                </span>
                            @enderror
                        </div>

                        @if ($errors->has('g-recaptcha'))
                        <span class="text-danger">{{ $errors->first('g-recaptcha') }}</span>
                       @endif

                        <div class="form-group mb-0">
                            <input class="agree-term" type="checkbox" checked name="remember" id="remember" {{ old('remember') ? 'checked' : '' }}>

                            <label for="agree-term" class="label-agree-term"><span><span></span></span> {{ __('Remember Me') }}</label>
                        </div>

                        <div class="form-group">
                            <input type="submit" name="submit" id="submit" class="form-submit cmn-btn" value="Login"/>
                        </div>
                    </form>
                    <p class="loginhere">
                        <span class="text-left account_text"> New account ? <a href="{{ route('register') }}" class="loginhere-link">Register here</a></span>
                     <span class="text-right">
                        @if (Route::has('password.request'))
                        <a class="btn btn-link" href="{{ route('password.request') }}">
                            {{ __('Forgot Your Password?') }}
                        </a>
                    @endif
                    </span>
                    </p>
                </div>
            </div>
        </section>

    </div>

@endsection


@push('scripts')
<script type="text/javascript">
    $(document).ready(function () {
        $('#login-form').on('submit', function (event) {
        //    event.preventDefault(); // Prevent default submission

            let form = this; // Store reference to the form

            grecaptcha.ready(() => {
                grecaptcha.execute("{{ config('app.recaptcha_site_key') }}", { action: '/login' }).then((token) => {
                    // Ensure reCAPTCHA token is added only once
                    if (!$(form).find('input[name="g-recaptcha"]').length) {
                        $('<input>')
                            .attr({ type: 'hidden', name: 'g-recaptcha', value: token })
                            .appendTo(form);
                    } else {
                        $(form).find('input[name="g-recaptcha"]').val(token);
                    }

                    // Unbind event before submitting to prevent duplicate triggers
                    $(form).off('submit').submit();
                });
            });
        });

        // Allow "Enter" key to submit form
        $('#email, #password').keypress(function (event) {
            if (event.which === 13) { // 13 is the Enter key
                event.preventDefault();
                $('#login-form').submit();
            }
        });
    });
</script>

@endpush