@extends('layouts.app')
@section('head')
@endsection
@section('content')

@php
$locale = session('lang');
use App\Http\Controllers\Controller;
$registration = Controller::registrationText();
@endphp
<div class="container inner-header">
    <div class="row flex flex-row space-between align-center flex-wrap">
        <div class="flex flex-row breadcrumbs">
            <a class="text-decoration-none" href="{{ url($locale,'/') }}"><svg width="18" height="14" viewBox="0 0 18 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8.76154 3.63312L2.99998 8.37843V13.5C2.99998 13.6326 3.05266 13.7598 3.14643 13.8535C3.24019 13.9473 3.36737 14 3.49998 14L7.00185 13.9909C7.13403 13.9903 7.26056 13.9373 7.35379 13.8436C7.44702 13.7499 7.49936 13.6231 7.49935 13.4909V10.5C7.49935 10.3674 7.55203 10.2402 7.6458 10.1464C7.73957 10.0527 7.86675 9.99999 7.99935 9.99999H9.99936C10.132 9.99999 10.2591 10.0527 10.3529 10.1464C10.4467 10.2402 10.4994 10.3674 10.4994 10.5V13.4887C10.4991 13.5545 10.5119 13.6197 10.537 13.6806C10.562 13.7414 10.5988 13.7967 10.6452 13.8433C10.6917 13.8899 10.7469 13.9269 10.8077 13.9521C10.8684 13.9773 10.9336 13.9903 10.9994 13.9903L14.5 14C14.6326 14 14.7598 13.9473 14.8535 13.8535C14.9473 13.7598 15 13.6326 15 13.5V8.37499L9.23967 3.63312C9.17195 3.57853 9.08759 3.54877 9.0006 3.54877C8.91362 3.54877 8.82926 3.57853 8.76154 3.63312ZM17.8625 6.85843L15.25 4.70499V0.376556C15.25 0.2771 15.2105 0.181718 15.1401 0.111391C15.0698 0.0410653 14.9744 0.0015564 14.875 0.0015564H13.125C13.0255 0.0015564 12.9301 0.0410653 12.8598 0.111391C12.7895 0.181718 12.75 0.2771 12.75 0.376556V2.64562L9.95217 0.343744C9.68367 0.1228 9.34676 0.00199807 8.99904 0.00199807C8.65133 0.00199807 8.31441 0.1228 8.04592 0.343744L0.135605 6.85843C0.0976324 6.88982 0.0662161 6.92838 0.0431511 6.97191C0.0200861 7.01544 0.00582446 7.06309 0.00118114 7.11213C-0.00346217 7.16118 0.0016038 7.21066 0.0160896 7.25775C0.0305754 7.30483 0.0541971 7.3486 0.0856051 7.38656L0.88248 8.35531C0.913802 8.39339 0.952329 8.42493 0.995854 8.44811C1.03938 8.47128 1.08705 8.48565 1.13613 8.49038C1.18522 8.49511 1.23475 8.49012 1.28191 8.47568C1.32906 8.46124 1.3729 8.43765 1.41092 8.40624L8.76154 2.35187C8.82926 2.29728 8.91362 2.26752 9.0006 2.26752C9.08759 2.26752 9.17195 2.29728 9.23967 2.35187L16.5906 8.40624C16.6286 8.43765 16.6723 8.46127 16.7194 8.47576C16.7665 8.49024 16.816 8.49531 16.865 8.49067C16.9141 8.48602 16.9617 8.47176 17.0053 8.4487C17.0488 8.42563 17.0873 8.39422 17.1187 8.35624L17.9156 7.38749C17.947 7.34932 17.9705 7.30532 17.9848 7.25803C17.9991 7.21074 18.004 7.16108 17.999 7.11192C17.9941 7.06275 17.9795 7.01505 17.956 6.97155C17.9326 6.92805 17.9008 6.8896 17.8625 6.85843Z" fill="black" fill-opacity="0.45"/></svg></a>
            <a class="text-decoration-none" href="{{ url($locale,'personal') }}">{{ __('auth.personal', [], $locale) }}</a>  
            <a class="text-decoration-none" href="{{ url($locale,'login') }}">{{ __('auth.login', [], $locale) }}</a>              
        </div>
        <div class="social">
            {{ __('auth.Share this', [], $locale) }}: <a href=""><svg width="13" height="24" viewBox="0 0 13 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.0845 13.5L12.751 9.15656H8.58338V6.33797C8.58338 5.14969 9.16557 3.99141 11.0321 3.99141H12.9268V0.293438C12.9268 0.293438 11.2074 0 9.56354 0C6.13135 0 3.88791 2.08031 3.88791 5.84625V9.15656H0.0727539V13.5H3.88791V24H8.58338V13.5H12.0845Z" fill="black" fill-opacity="0.45"/></svg></a>
            <a href=""><svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.0001 6.87578C8.2798 6.87578 6.87589 8.27969 6.87589 10C6.87589 11.7203 8.2798 13.1242 10.0001 13.1242C11.7204 13.1242 13.1243 11.7203 13.1243 10C13.1243 8.27969 11.7204 6.87578 10.0001 6.87578ZM19.3704 10C19.3704 8.70625 19.3821 7.42422 19.3095 6.13281C19.2368 4.63281 18.8946 3.30156 17.7978 2.20469C16.6985 1.10547 15.3696 0.765623 13.8696 0.692967C12.5759 0.620311 11.2939 0.63203 10.0025 0.63203C8.7087 0.63203 7.42667 0.620311 6.13527 0.692967C4.63527 0.765623 3.30402 1.10781 2.20714 2.20469C1.10792 3.3039 0.76808 4.63281 0.695424 6.13281C0.622767 7.42656 0.634486 8.70859 0.634486 10C0.634486 11.2914 0.622767 12.5758 0.695424 13.8672C0.76808 15.3672 1.11027 16.6984 2.20714 17.7953C3.30636 18.8945 4.63527 19.2344 6.13527 19.307C7.42902 19.3797 8.71105 19.368 10.0025 19.368C11.2962 19.368 12.5782 19.3797 13.8696 19.307C15.3696 19.2344 16.7009 18.8922 17.7978 17.7953C18.897 16.6961 19.2368 15.3672 19.3095 13.8672C19.3845 12.5758 19.3704 11.2937 19.3704 10ZM10.0001 14.807C7.33995 14.807 5.19308 12.6602 5.19308 10C5.19308 7.33984 7.33995 5.19297 10.0001 5.19297C12.6603 5.19297 14.8071 7.33984 14.8071 10C14.8071 12.6602 12.6603 14.807 10.0001 14.807ZM15.004 6.11875C14.3829 6.11875 13.8814 5.61719 13.8814 4.99609C13.8814 4.375 14.3829 3.87344 15.004 3.87344C15.6251 3.87344 16.1267 4.375 16.1267 4.99609C16.1269 5.14357 16.0979 5.28964 16.0416 5.42593C15.9852 5.56222 15.9026 5.68606 15.7983 5.79034C15.694 5.89463 15.5701 5.97731 15.4339 6.03367C15.2976 6.09002 15.1515 6.11893 15.004 6.11875Z" fill="black" fill-opacity="0.45"/></svg></a>
            <a href=""><svg width="21" height="18" viewBox="0 0 21 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M20.9393 1.62188L17.7705 16.5656C17.5315 17.6203 16.908 17.8828 16.0221 17.3859L11.194 13.8281L8.86427 16.0687C8.60646 16.3266 8.39084 16.5422 7.89396 16.5422L8.24084 11.625L17.1893 3.53906C17.5783 3.19219 17.1049 3 16.5846 3.34688L5.52209 10.3125L0.759586 8.82188C-0.276351 8.49844 -0.295101 7.78594 0.975211 7.28906L19.6033 0.112501C20.4658 -0.210937 21.2205 0.304688 20.9393 1.62188Z" fill="black" fill-opacity="0.45"/></svg></a>
            <a class="text-decoration-none xs-hidden" href=""><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14 6V2.41406C14 2.14875 13.8947 1.89469 13.7072 1.70687L12.2928 0.292812C12.1053 0.105312 11.8509 0 11.5856 0H3C2.44781 0 2 0.447812 2 1V6C0.895313 6 0 6.89531 0 8V11.5C0 11.7762 0.22375 12 0.5 12H2V15C2 15.5522 2.44781 16 3 16H13C13.5522 16 14 15.5522 14 15V12H15.5C15.7762 12 16 11.7762 16 11.5V8C16 6.89531 15.1047 6 14 6ZM12 14H4V11H12V14ZM12 7H4V2H10V3.5C10 3.77625 10.2238 4 10.5 4H12V7ZM13.5 9.25C13.0859 9.25 12.75 8.91406 12.75 8.5C12.75 8.08562 13.0859 7.75 13.5 7.75C13.9141 7.75 14.25 8.08562 14.25 8.5C14.25 8.91406 13.9141 9.25 13.5 9.25Z" fill="black" fill-opacity="0.45"/></svg>
                {{ __('auth.Printable version', [], $locale) }}
            </a>
        </div>
    </div>
</div>
<div class="container inner-page faq register">
    <div class="programme flex flex-row flex-wrap">
        <div class="left bg-white" >
            <div class="flex flex-row ">
                <div class="tabs">

                  <ul class="tabs__caption flex flex-row">
                    <li class=" {{ (request()->is('*/register'))? 'active' : '' }}">{{ __('auth.register', [], $locale) }}</li>
                    <li class="{{ (request()->is('*/login'))? 'active' : '' }}">{{ __('auth.login', [], $locale) }}</li>
                  </ul>
                  
                  <div class="tabs__content {{ (request()->is('*/register'))? 'active' : '' }} form">
                        <form action="{{ url(app()->getLocale(),'get-sms') }}" id="demo-form" method="post">
                            
                            @csrf
                            
                            <input type="text" placeholder="{{ __('auth.Enter your login', [], $locale) }}" name="login">

                            <p>
                                <input type="radio" name="type" value="phone" checked> {{ __('auth.Get a message on your phone', [], $locale) }}
                            </p>
                            <p>
                                <input type="radio" name="type" value="tv"> {{ __('auth.Receive a message on TV', [], $locale) }}
                            </p>
                            <div class="captcha">
                              <span>{!!captcha_img()!!}</span>
                              <button type="button" class="btn-refresh" style="margin-bottom: 10px; color: #000; font-weight: 400; border: 1px solid #e5e5e5; display: flex; align-items: center">Обновить картинку</button>
                            </div>
                            <input  type="text" class="mt-2 @error('captcha') is-invalid @enderror" name="captcha1" value="">
                            <input  type="submit" class="site-btn text-uppercase" data-sitekey="6LfUBfoUAAAAADKLfQHPA5Cs5cBpv20b_nAt-lDV" data-callback='onSubmit' data-action='submit' value="{{ __('site.send', [], $locale) }}"></input>

                        </form>
                        @if ($errors->any())
                            <div class="alert alert-danger">
                                <ul>
                                    @foreach ($errors->all() as $error)
                                        <li class="danger" style="color: red">
                                            @if($locale == 'ru' and $error == "Noto'g'ri parol")
                                                Неправильный пароль
                                            @elseif($locale == 'en' and $error == "Noto'g'ri parol")
                                                Неправильный пароль
                                            @elseif($locale == 'en' and $error == "Noto'g'ri parol")
                                                Noto'g'ri parol
                                            @endif
                                        </li>
                                    @endforeach
                                </ul>
                            </div>
                        @endif
                  </div>
                  
                  <div class="tabs__content {{ (request()->is('*/login'))? 'active' : '' }} form">
                        <form method="POST" action="/{{ $locale }}/get-client">
                            @csrf
                            
                            <input type="text" placeholder="{{ __('auth.Enter your login', [], $locale) }}" name="name">

                            @error('name')
                                <span class="invalid-feedback" role="alert">
                                    <strong>
                                        @if($locale == 'ru' and $message == "Noto'g'ri parol")
                                            Неправильный пароль
                                        @elseif($locale == 'en' and $message == "Noto'g'ri parol")
                                            Неправильный пароль
                                        @elseif($locale == 'en' and $message == "Noto'g'ri parol")
                                            Noto'g'ri parol
                                        @endif
                                    </strong>
                                </span>
                            @enderror

                            <input type="password" placeholder="{{ __('auth.Enter your password', [], $locale) }}" name="password">
                            
                            <div class="captcha">
                              <span>{!!captcha_img()!!}</span>
                              <button type="button" class="btn-refresh" style="margin-bottom: 10px; color: #000; font-weight: 400; border: 1px solid #e5e5e5; display: flex; align-items: center">{{ __('auth.Refresh picture', [], $locale) }}</button>
                            </div>
                            
                            <input id="captcha" type="text" class="mt-2 @error('captcha') is-invalid @enderror" name="captcha" value="">
                            <input class="site-btn text-uppercase" type="submit" value="{{ __('auth.login', [], $locale) }}">

                        </form>
                        @if ($errors->any())
                            <div class="alert alert-danger">
                                <ul>
                                    @foreach ($errors->all() as $error)
                                        <li class="danger" style="color: red">
                                            @if($locale == 'ru' and $error == "Noto'g'ri parol")
                                                Неправильный пароль
                                            @elseif($locale == 'en' and $error == "Noto'g'ri parol")
                                                Неправильный пароль
                                            @elseif($locale == 'en' and $error == "Noto'g'ri parol")
                                                Noto'g'ri parol
                                            @endif
                                        </li>
                                    @endforeach
                                </ul>
                            </div>
                        @endif
                  </div>
                  
                </div>
            </div>
        </div>
        <div class="right">
            {!! $registration !!}
        </div>
    </div>
</div>
@endsection
@section('foot')
<script src="https://www.google.com/recaptcha/api.js"></script>

<script>
    function onSubmit(token) {
     document.getElementById("demo-form").submit();
   }
    (function($) {
        $(function() {
          
          $('ul.tabs__caption').on('click', 'li:not(.active)', function() {
            $(this)
              .addClass('active').siblings().removeClass('active')
              .closest('div.tabs').find('div.tabs__content').removeClass('active').eq($(this).index()).addClass('active');
              $.ajax({
			      type: 'get',
			      url: "{{route('refresh.captcha', \App::getLocale())}}",
			      success: function(data){
			        $('.captcha span').html(data);
			      }
			    });
          });
          
        });
    })(jQuery);
</script>
<script type="text/javascript">
  $('.btn-refresh').click(function(){
    $.ajax({
      type: 'get',
      url: "{{route('refresh.captcha', \App::getLocale())}}",
      success: function(data){
        $('.captcha span').html(data);
      }
    });
  });
</script>
@endsection