@extends('front.layouts.main')


@section('title'){{ @trans('seo.login_title') }}@endsection

@section('description'){{ @trans('seo.login_desc') }}@endsection

@section('content')

<main class="before-login-page">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-lg-4 offset-lg-1 col-md-6">
                <h1 class="bold">{{ @trans('client_index.welcome_back') }},</h1>
                @guest
                <form action="{{route('auth.postUserLogin')}}" name="frmLoginUser" id="frmLoginUser" method="post"
                    autocomplete="off">
                    @csrf
                    <div class="form-body">
                        @if(Session::get('fail_message', false))
                        @component('admin.components.fail_message')
                        {!! Session::get('fail_message') !!}
                        @endcomponent
                        @endif
                        @if(Session::get('success'))
                        @component('admin.components.success_message')
                        {{ Session::get('success') }}
                        @endcomponent
                        @endif
                        <div class="form-group">
                            <label class="control-label">{{ @trans('client_index.email') }}</label>
                            <input type="email" name="username" id="username" class="form-control" placeholder="Email"
                                value="{{old('username')}}" />
                            @if($errors->has('username'))
                            <span class="invalid-feedback">{{ $errors->first('username') }}</span>
                            @endif
                        </div>
                        <div class="form-group">
                            <label class="control-label">{{ @trans('client_index.password') }}</label>
                            <input type="password" class="form-control" name="password" id="password"
                                placeholder="Password" />
                            @if($errors->has('password'))
                            <span class="invalid-feedback">{{ $errors->first('password') }}</span>
                            @endif
                        </div>
                        <div class="form-group">
                            <div class="custom-control custom-checkbox">
                                <input type="checkbox" class="custom-control-input" name="remember" id="remember"
                                    value="1" />
                                <label class="custom-control-label font-weight-normal" for="remember">
                                    @lang('app.keep_me_logged_in')
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="form-action">
                        <input type="submit" class="btn btn-transparent sign-in"
                            value="{{ @trans('client_index.sign_in') }}">
                        <a href="{{ route('user-password-reset-form') }}" class="login-link float-right gray">Forgot
                            Password?</a>
                    </div>
                    <p class="gray">{{ @trans('client_index.new_to_empower') }}? <a href="{{ route('signup') }}"
                            class="gray btn font-orange small-font nav-btn ml-sm-2">{{ @trans('client_index.register')
                            }}</a>
                    </p>
                </form>
                @endguest
            </div>
            <div class="col-md-6 my-md-auto">
                <img src="{{ asset('img/login-img.png') }}" srcset="{{ asset('img/login-img.png') }}" alt="Empower"
                    class="d-none d-md-block" />
            </div>
        </div>
    </div>
</main>

@endsection

@push('pageJs')
<script type="text/javascript" src="{{ asset('js/vendor/js.cookie.min.js') }}"></script>
<script>
    $(document).ready(function() {

        // check cookies are enable or not
        Cookies.set('is_created_cookie', 'yes');
        if(Cookies.get('is_created_cookie')) {
            Cookies.remove('is_created_cookie');
        } else {
            $('.form-body').prepend(`<div class="alert alert-danger">Your browser has cookies disabled. 
                Make sure that your cookies are enabled and try again.</div>`);
        }

        $(".sign-in").click(function() {
            $("#frmLoginUser").submit();
            $(".sign-in").attr("disabled", true);
            $(".sign-in").val("Please wait..");
        });
    });
</script>
@endpush