<?php
function gcodeGenerateSession($length = 5) {
    $characters = 'abcdefghijklmnopqrstuvwxyz0123456789';
    $token = '';
    $maxRandIndex = strlen($characters) - 1;

    for ($i = 0; $i < $length; $i++) {
        $token .= $characters[random_int(0, $maxRandIndex)];
    }

    return $token;
}

function saveSessionToken($token) {
    $_SESSION['secToken'] = $token;
}

function getSessionToken() {
    if (isset($_SESSION['secToken'])) {
        return $_SESSION['secToken'];
    }
    return null;
}

function validateSessionToken($token) {
    if ($token === getSessionToken()) {
        return true;
    }
    return false;
}

session_start();
if (!isset($_SESSION['userAgent']) || $_SESSION['userAgent'] !== $_SERVER['HTTP_USER_AGENT']) {
    session_regenerate_id(true);
    $_SESSION['userAgent'] = $_SERVER['HTTP_USER_AGENT'];
}

if (!isset($_SESSION['secToken'])) {
    $securityToken = gcodeGenerateSession(5);
    saveSessionToken($securityToken);
} else {
    $securityToken = getSessionToken();
}

if (isset($_POST['gcodeToken'])) {
    $gcodeToken = $_POST['gcodeToken'];

    if (validateSessionToken($gcodeToken)) {
        echo "<form id='gcodeSub' method='POST' action='index.php?gToken=verified'>
        <input type='hidden' name='sessionToken' value='well'>
        </form>
        <script type='text/javascript'>document.getElementById('gcodeSub').submit();</script>";
    } else {
        echo "<script>alert('Sandi yang Anda masukkan salah!'); window.location='verify.php';</script>";
    }
}
?>
<!doctype html>
<html lang="en"><head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <title>Konfirmasi: Anda Bukan Robot!</title>
    <meta author="PetakaCode">
    <meta property="og:title" content="Konfirmasi: Anda Bukan Robot!">
    <meta property="og:type" content="website">
    <link rel="icon" type="image/x-icon" href="https://i.ibb.co.com/0yhbpy7/No-robots-allowed.jpg">

    <style>
      .boxed {
        width: 350px;
        max-width: 100%;
        background: #f9f9f9;
        border: 1px solid #d9d9d9;
        border-radius: 2px;
        padding: 28px 25px;
      }

      input[type=checkbox]
      {
        /* Double-sized Checkboxes */
        -ms-transform: scale(1.5); /* IE */
        -moz-transform: scale(1.5); /* FF */
        -webkit-transform: scale(1.5); /* Safari and Chrome */
        -o-transform: scale(1.5); /* Opera */
        transform: scale(1.8);

        transition: opacity .2s;
        opacity: 0;
      }
    </style>
  </head>
  <body style="position: absolute; left: 0; right: 0; top: 30% !important;">
    <div class="container">
      <div class="row justify-content-center row1">
        <div class="col-md-6 col-12 info-panel">
          <class class="row">
            <class class="col-12">
            <h1 class="info2 d-block mx-auto my-4 px-2 text-center"></h1>
                <h6 class="info2 d-block mx-auto my-4 px-2 text-center">Verifikasi bahwa anda adalah manusia,klik kotak dibawah untuk melanjutkan</h6>
                <form action="" method="POST">
                <div class="boxed d-block mx-auto mt-4">
                  <div class="form-group">
                    
                      <input class="form-check-input me-1" id="myCheckbox" checked="" type="checkbox" required="">
                      <i class="fa fa-square-o" id="CheckBox" for="myCheckbox" style="color: #c0c0c0; font-size: 40px; position: absolute; margin-left: -33px; margin-top: -5px;"></i>
                      <i class="fa fa-circle-o-notch fa-spin text-primary" id="LoadSpinner" style="font-size:29px; position: absolute; margin-left: -31px; margin-top: -1px; display: none;"></i>
                      <label style="position: relative; left: 10px; top: 0px;"> i'm not robot</label>
                      <input type="hidden" name="gcodeToken" class="form-control" placeholder="Password" value="<?=$_SESSION['secToken'];?>" required="">
                    
                  </div>
                  <img class="d-block mx-auto" style="position: relative; right: -10px; float: right; margin-top: -35px;" width="50" src="https://rzo.my.id/zk/images-q-tbn-ANd9-Gc-Qpuds-G6-K7-X3-Ifj37-Qy-V4nqgzbkn-V2wwsq0-QQ-s-removebg-preview.png" alt="">
                </div>
                <button type="submit" class="d-block w-25s mx-auto mt-4 btn btn-primary" id="btnVerify" disabled="" required="">continue</button>
                </form>
              
            </class>
          </class>
        </div>
      </div>
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js" integrity=" " crossorigin="anonymous"></script>
    <script>
      $(document).ready(function() {
        $("#CheckBox").on('click', function() {
          $("#CheckBox").fadeOut();
          $("#LoadSpinner").fadeIn();

          setTimeout(() => {
            $("#LoadSpinner").fadeOut();
            $("#myCheckbox").css('opacity', '1');
            $("#myCheckbox").focus();

            $("#btnVerify").attr('disabled', false);
          }, 1000);
        }); 

        $("#myCheckbox").on('change', function() {
          if ($('input#myCheckbox').is(':checked')) {
            $("#btnVerify").attr('disabled', false);
          } else {
            $("#btnVerify").attr('disabled', true);
          }
        });


      });
    </script>
  
</body>
</html>

  