<?php
session_start(); // Mulai session

include 'connection.php'; // Koneksi ke database

$error = ''; // Variabel untuk menyimpan pesan error

if ($_SERVER['REQUEST_METHOD'] == 'POST') {
  $user = $_POST['username']; // Mengambil input user
  $password = $_POST['password']; // Mengambil input password

  // Mengambil data user dari database berdasarkan user
  $stmt = $conn->prepare("SELECT * FROM allocation_login WHERE user = ?");
  $stmt->bind_param("s", $user);
  $stmt->execute();
  $result = $stmt->get_result();

  if ($result->num_rows > 0) {
    $row = $result->fetch_assoc();
    var_dump($row['pass']);
    var_dump($password);
    // Verifikasi password
    if ($row['pass'] ==  $password) {
      // Jika password benar, set session
      $_SESSION['loggedin'] = true;
      $_SESSION['idlogin'] = $row['idlogin'];
      $_SESSION['user'] = $row['user'];
      $_SESSION['nama'] = $row['nama'];
      $_SESSION['jenis'] = $row['jenis'];
      // Redirect ke halaman index.php
      header("Location: index.php");
      exit();
    } else {
      // Password salah
      $error = "Password salah!";
    }
  } else {
    // NIK tidak ditemukan
    $error = "User tidak ditemukan!";
  }
}
?>

<!DOCTYPE html>
<html lang="en">

<?php
include 'head.php';
?>

<body>

  <main>
    <div class="container">

      <section class="section register min-vh-100 d-flex flex-column align-items-center justify-content-center py-4">
        <div class="container">
          <div class="row justify-content-center">
            <div class="col-lg-4 col-md-6 d-flex flex-column align-items-center justify-content-center">

              <div class="card mb-3">

                <div class="card-body">

                  <div class="mt-3 mb-3 d-flex flex-column justify-content-center align-items-center py-4">
                    <img src="assets/img/logo.png" alt="" class="logo-img">
                    <a href="index.php" class="logo d-flex flex-column align-items-center w-auto">
                      <span style="font-size:22px" class="d-none text-center d-lg-block mt-2">Allocation<br>Unit</span>
                    </a>
                  </div><!-- End Logo -->

                  <form class="row g-3 needs-validation" action="login.php" method="POST" novalidate>
                    <div class="col-12">
                      <label for="yourUsername" class="form-label">Username</label>
                      <input type="text" name="username" class="form-control" id="yourUsername" required>
                      <div class="invalid-feedback">Masukkan username anda!</div>
                    </div>
                    <div class="col-12">
                      <label for="yourPassword" class="form-label">Password</label>
                      <div class="input-group has-validation">
                        <input type="password" name="password" class="form-control" id="yourPassword" required>
                        <span class="input-group-text" id="togglePassword" style="cursor: pointer;">
                          <i class="uil uil-eye-slash"></i>
                        </span>
                        <div class="invalid-feedback">Masukkan password anda!</div>
                      </div>
                    </div>

                    <!-- Menampilkan pesan error jika ada -->
                    <?php if (!empty($error)): ?>
                      <div class="alert alert-danger" role="alert">
                        <?php echo $error; ?>
                      </div>
                    <?php endif; ?>
                    <div class="col-12">
                      <button class="btn btn-primary w-100" type="submit">Login</button>
                    </div>
                  </form>

                </div>
              </div>

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

      </section>

    </div>
  </main><!-- End #main -->



  <a href="#" class="back-to-top d-flex align-items-center justify-content-center"><i class="bi bi-arrow-up-short"></i></a>

  <!-- Vendor JS Files -->
  <script src="assets/vendor/apexcharts/apexcharts.min.js"></script>
  <script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
  <script src="assets/vendor/chart.js/chart.umd.js"></script>
  <script src="assets/vendor/echarts/echarts.min.js"></script>
  <script src="assets/vendor/quill/quill.js"></script>
  <script src="assets/vendor/simple-datatables/simple-datatables.js"></script>
  <script src="assets/vendor/tinymce/tinymce.min.js"></script>
  <script src="assets/vendor/php-email-form/validate.js"></script>

  <!-- Template Main JS File -->
  <script src="assets/js/main.js"></script>

  <script>
    const passwordInput = document.getElementById('yourPassword');
    const togglePassword = document.getElementById('togglePassword');

    togglePassword.addEventListener('click', function() {
      // Toggle type attribute between password and text
      const type = passwordInput.getAttribute('type') === 'password' ? 'text' : 'password';
      passwordInput.setAttribute('type', type);

      // Toggle icon between eye and eye-slash
      this.querySelector('i').classList.toggle('uil-eye');
      this.querySelector('i').classList.toggle('uil-eye-slash');
    });
  </script>

</body>

</html>