@extends('layouts.app')
@section('title') {{'Protected Page'}} @endsection

@section('content')

<main id="mainWrap" >
    <div class="mainWrapIntro abouthelpScreen">
    <a href="{{ env('APP_URL')}}" class="logoBrind"><img src="{{asset('img/idenikeyLogo.png')}}" class="img-flud" alt=""></a>

<div class="wedLikehelp">
    Enter Password
</div>

<form method="post" class="passwordForm">
    @csrf
    <input type="password" name="password" id="password_input" value="">
    <input type="hidden" name="key_id" id="key_id" value="">
    <div class="error none">please enter password, fields cant empty</div>
    <div>
      <a href="javaScript:" class="btn-lg btn-primary protected_submit">SUBMIT</a>
    </div>
</form>

</div>
<div class="patentPendingText">Patent Pending</div>
</main>

<style>
.error{color:red;}
.none{display:none;}
</style>

<script>
$(document).ready(function(){
    $(".protected_submit").click(function(){
      var pwd_input=$("#password_input").val();
      if(pwd_input==""){
        $("#password_input").css('border','1px red solid');
        $(".error").css('display','block');
      }
      else{
        var key_id=$("#key_id").val();
        var fd = new FormData();
          fd.append('type','check_password');
          fd.append('password', pwd_input);
        //console.log(feedback);
        $.ajaxSetup({
             headers:{
                 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
             }
        });
        var url='{{ env('APP_URL') }}';
        $.ajax({
            type: "POST",
            dataType: "json",
            url: "protectedFront", //action
            data: fd,
            processData: false,
            contentType: false,
           success: function(response){
                if(response.status===0){
                  $("#password_input").val('');
                    alert(response.msg);
                }
                else{
                    window.location.href = url+'/frontKey';
                 }
            }
        });
      }

  });
});
</script>
@endsection