@extends('layouts.main')

@section('content')
<div class="container">
    <div class="row mt-8 justify-content-center">
        <div class="col-xl-5 col-12">
            <div class="text-center p-b-50">
                <a href="{{ secure_url('/') }}"><img class="img-responsive" width="50%" src="{{secure_asset('assets/images/HireMee.png')}}"></a>
            </div>
            <div class="card borderless-card">
                {!! Form::open(array('url' => secure_url('pagecms/login'), 'method'=>'POST','class'=>'form-horizontal','name'=>'pagecms-login','id'=>'pagecms-login-form')) !!}
                <div class="card-block z-depth-5">
                    <div class="row p-15">
                        <div class="col-xl-12">
                            <h4 class="f-20 g-l-b">Page-cms Login</h4>                            
                        </div>
                    </div>
                     @if($message = Session::get('success'))
                         <div class="alert alert-success background-success">
                          <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                          <i class="icofont icofont-close-line-circled text-white"></i>
                          </button>
                          <strong>Success!</strong>  {{ $message }}
                        </div>
                        @elseif($message = Session::get('error'))
                        <div class="alert alert-danger background-danger">
                            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                            <i class="icofont icofont-close-line-circled text-white"></i>
                            </button>
                            <strong>Error!</strong> {{ $message }}</code>
                          </div>
                     @endif
                    <div class="row p-15">
                        <div class="col-xl-612 col-md-12 col-sm-12 col-12">
                            <div class="row">
                                <div class="col-sm-12 form-group col-lg-12">
                                    <div class="input-group input-group-primary2">
                                        <span class="input-group-addon" id="basic-addon1"><i class="hiremee-userdefault"></i> <sup class="mandatory">*</sup></span>
                                        {!! Form::text('email','',array('class'=>'form-control js-tooltip-validate','id'=>'js-pagecms-login-username','placeholder'=>'Username')) !!}
                                    </div>
                                    <span id="js-pagecms-login-username-error"></span>
                                </div>
                                <div class="col-sm-12 form-group col-lg-12">
                                    <div class="input-group input-group-primary2">
                                        <span class="input-group-addon" id="basic-addon1"><i class="hiremee-closed-lock"></i> <sup class="mandatory">*</sup></span>
                                       {!! Form::password('password',array('class'=>'form-control js-tooltip-validate','id'=>'js-pagecms-login-password','placeholder'=>'Password')) !!}
                                    </div>
                                    <span id="js-pagecms-login-password-error"></span>
                                </div>
                                <div class="col-sm-12 form-group col-lg-12">
                                    <div class="input-group input-group-primary2">
                                        <span class="input-group-addon" id="basic-addon1"><span class="f-12">CAPTCHA</span> <sup class="mandatory-captcha">*</sup></span>
                                       <img class='re-captcha' /><input  maxlength='3' class='b-l-fff form-control captcha-size1' type='text' name='v_captcha' id="js-corp-login-v_captcha">
                                        <input type="hidden" value="{{ url('captcha') }}" class="check-captcha" />
                                        <span class="input-group-addon captcha-refresh" id="basic-addon1"><span class="hiremee-refresh"></span></span>
                                    </div>
                                    <span id="js-corp-login-v_captcha-error"></span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row p-15 p-b-30 justify-content-center">
                        <div class="col-xl-5 col-md-6 col-sm-8 col-12">
                            <button type="submit" class="btn btn-primary btn-block waves-effect" id="pagecms-login-submit" data-form-type="traditional">Login</button>
                        </div>
                    </div>
                </div>
            </div>
            {!! Form::close() !!}

 

        </div>
    </div>
</div>

@endsection
@section('footer')
<script type="text/javascript">
$('#pagecms-login-form').validate({
  errorElement: 'span',
  errorPlacement: function (error,element){
    $('.tooltip').tooltip('hide');
    $("body").find('#'+error[0].id+'-custom').remove();
    $('#'+error[0].id).append('<span data-position="left" data-delay="0" class="js-tootletip icofont icofont-exclamation-circle text-danger tooltip-validate" id="'+error[0].id+'-custom" data-toggle="tooltip" data-original-title="'+error[0].innerText+'" data-trigger="hover"></span>');
    $('#'+error[0].id+'-custom').tooltip();
  },
  success: function (element){
    $("body").find('#'+element[0].id+'-custom').remove();
    $('#'+element[0].id+'-custom').tooltip('hide');
  },
  onfocusout: false,
  rules: {
    email:{
      required:true
    },
    password:{
      required:true
    },
    v_captcha:{
      required:true,
      remote: {
        url: $('.check-captcha').val(),
        type: "get",
      }
    }
  },
  messages: {
    email:{
      required:'Please Enter Username'
    },
    password:{
      required:'Please Enter Password'
    },
    v_captcha:{
      required:'Please Enter Captcha',
      remote:'Captcha Mis-match'
    }
  },
  submitHandler: function(form){
    $('#pagecms-login-submit').text('Authenticating...').prop('disabled',true);
    $('a').prop('disabled',true);
    var transition_type = $('#pagecms-login-submit').attr('data-form-type');
    if (transition_type == 'traditional' || transition_type == 'validated') {
      return true;
    } else if (transition_type == 'remote') {
      var username = $('#js-pagecms-login-username').val();
      var password = $('#js-pagecms-login-password').val();
      $.ajax({
        url: "{{secure_urL('pagecms/remote/login')}}",
        type: "post",
        data: {"username": username,"password": password},
        success: function (response) {
          if (response.status == 200) {
            $('#pagecms-login-submit').attr('data-form-type','validated');
            $(form).submit();
          } else if (response.status == 400) {
            $('#js-pagecms-error-message').text(response.message);
            $('#js-pagecms-login-error').show();
            setTimeout(function(){
              $(document).find('.backend-error-box').fadeOut(); 
            },3000);
            $('#pagecms-login-submit').text('Login').prop('disabled',false);
            $('#js-pagecms-login-username').val('');
            $('#js-pagecms-login-password').val('');
          }
        },
        error: function (response) {
          $('#pagecms-login-submit').text('Login').prop('disabled',false);
          swal({
            html: true, 
            title: '<span class="sweet-danger-text">Something Went Wrong</span>', 
            text: "Your action  has been suspended, Sorry for the inconvenience. Please try again later",
            type: "error",
            showCancelButton: false,
            confirmButtonText: "OK",
            closeOnConfirm: false
          });
        }
      });
    } 

  },
});
    
</script>
@endsection