@extends('layouts.index')

@section('content')

    <div class="  mt-3">
        {{-- Breadcrumb Section --}}
        @php
            $pages = [] ; $page = [] ;
            $page['title'] = __('lang.home') ; $page['route'] = route('home') ; $page['color'] = 'text_3' ;
            $pages[] = $page ;
            $page['title'] = __('lang.login') ; $page['route'] = 'javascript:void(0)' ; $page['color'] = 'text_1' ;
            $pages[] = $page ;
        @endphp
        @include('components.breadcrumb',$pages)


    </div>

    <div class="container my-5">

            <div class="row justify-content-center align-items-center login-form">
                <div class="col-md-6">
                    @include('includes.errors')
                    <!--Form with header-->
                    <form action="{{ route('postLogin') }}" method="post" autocomplete="off">

                        @csrf
                        <input type="hidden" name="accountId" value="{{env('accountId')}}" >
                        <input type="hidden" name="device_token" id="device_token" value="test">
                        <input type="hidden" name="accounts_country_code"  value="{{$account->accounts_country_code}}" >
                        <input type="hidden" name="coupon_code"  value="{{isset($coupon_code) ? $coupon_code : ''}}" >
                        <input type="hidden" name="page_type"  value="{{isset($page_type) ? $page_type : 'login'}}" >
                        <input type="hidden" name="auth_type"  id="auth_type" value="{{$account->accounts_auth_type}}" >

                        <div class="card client-auth-card ">

                            <div class="card-body p-3">
                                    <div class="login-title text-center text_1 py-5">
                                        <h2 class="fb-900 pb-2">{{ __('lang.WelcomeBack') }}</h2>
                                        @if($account && $account->accounts_website_theme == 'default')
                                        <h4 class="fb-700">{{ __('lang.LetsBuildSometingGreat') }}</h4>
                                        @endif
                                    </div>
                                    @if($account->accounts_auth_type == 'phone')
                                    <div class="mb-4">
                                        <label for="phone" class="form-label text_1 fb-700 font-18">{{ __('lang.phone') }}</label>

                                        <div class="input-group mb-2" dir="ltr" id="mobile-dev">

                                            <div class="input-group-prepend " dir="ltr" >
                                                <div class="input-group-text  px-4">
                                                     <i class="fas fa-phone-alt"></i>
                                                     @if(!$account->accounts_multiple_countries)
                                                     {{$account->accounts_country_code}}
                                                     <input type="hidden" name="countryCode" value="{{$account->accounts_country_code}}">
                                                     @endif

                                                </div>
                                                @if($account->accounts_multiple_countries)  @include('auth.countryCode') @endif
                                            </div>
                                            <input type="text" class="form-control" dir="ltr" id="phone" name="phone" value="{{ old('phone') }}" placeholder="{{ __('lang.phone') }}" onkeypress="return ( event.charCode >= 48 && event.charCode <= 57)" required>
                                        </div>
                                    </div>
                                    @elseif($account->accounts_auth_type == 'email')
                                    <div class="mb-4">
                                        <label for="email" class="form-label text_1 fb-700 font-18">{{ __('lang.email') }}</label>
                                        <input type="text" class="form-control" dir="ltr" id="email" name="email" value="{{ old('email') }}" placeholder="{{ __('lang.email') }}" required>
                                    </div>
                                    @endif
                                    <div class="mb-4">
                                        <label for="phone" class="form-label text_1 fb-700 font-18">{{ __('lang.password') }}</label>
                                        <input type="password" class="form-control  ltrInput" id="password" name="password" placeholder="{{ __('lang.password') }}" value="{{ old('password') }}" autocomplete="new-password" >
                                    </div>

                                    <div class="my-3">
                                        <p class="m-0">
                                            <span class="text_3 font-16"> {{ __('lang.forgetPassword') }} {{ $dir == 'ltr' ? '?' : '؟' }} </span>
                                            {{-- <a aria-label="" href="javascript:void(0)"  class="font-15 text_7">{{ __('lang.resetPassword') }}</a> --}}
                                            <a aria-label="" href="{{ route('forgetPassword') }}"  class="font-15 text_7">{{ __('lang.resetPassword') }}</a>

                                        </p>
                                    </div>

                                    <div class="text-center d-grid gap-2">
                                        <button type="submit" class="btn text_2 background_3   py-2 font-14"> {{__('lang.login')}}</button>
                                    </div>

                                    @if(isset($account->accounts_social_login_btns) && $account->accounts_social_login_btns == '1')
                                        <hr class="text_4"/>
                                        @include('auth.social-login')
                                    @endif


                            </div>

                        </div>
                        <div class="my-3 text-center">
                            <span class="text_3 font-18"> {{ __('lang.hasnotUser') }}</span>
                            <a aria-label="" href="{{ route('register') }}"  class="font-18">{{ __('lang.register') }}</a>
                        </div>
                    </form>
                    <!--Form with header-->

                </div>
            </div>
        </div>
@endsection

@section('script')

<script>
messaging.requestPermission()
    .then(function () {

        // console.log("Notification permission granted.");
        // get the token in the form of promise
        return messaging.getToken()
    })
    .then(function(token) {
        // console.log("token is : " + token);
        if(token){
            $('#device_token').val(token);
        }
    })
    .catch(function (err) {
        console.log("Unable to get permission to notify.", err);
    });

</script>
@endsection