<?php
session_start();
include 'config/koneksi.php';

/* =====================================================
   PROSES LOGIN
===================================================== */

if (isset($_POST['login'])) {

    $username = mysqli_real_escape_string(
        $conn,
        $_POST['username']
    );

    $password = mysqli_real_escape_string(
        $conn,
        $_POST['password']
    );

    $query = mysqli_query(
        $conn,
        "SELECT * FROM admin
         WHERE username='$username'
         AND password='$password'"
    );

    $cek = mysqli_num_rows($query);

    if ($cek > 0) {

        $data = mysqli_fetch_assoc($query);

        $_SESSION['id_admin'] = $data['id_admin'];
        $_SESSION['nama'] = $data['nama_lengkap'];

        header("Location: admin/dashboard.php");
        exit;

    } else {

        $error = "Username atau password yang Anda masukkan salah.";
    }
}
?>

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

<head>

    <meta charset="UTF-8">

    <meta name="viewport"
          content="width=device-width, initial-scale=1.0">

    <title>
        Login Admin | Portal Desa Digital Desa Oelomin
    </title>

    <!-- CSS LOGIN -->
    <link rel="stylesheet"
          href="assets/css/login.css">

    <!-- GOOGLE FONT -->
    <link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Playfair+Display:wght@600;700;800&display=swap"
          rel="stylesheet">

</head>

<body>


<!-- =====================================================
     HALAMAN LOGIN
===================================================== -->

<div class="login-page">


    <!-- =================================================
         IDENTITAS PORTAL
    ================================================== -->

    <div class="portal-header">

        <img src="assets/img/logo-desa.png"
             alt="Logo Desa Oelomin"
             class="portal-logo">

        <div class="portal-text">

            <h1>Desa Oelomin</h1>

            <span>
                Portal Desa Digital
            </span>

        </div>

    </div>


    <!-- GARIS DEKORASI -->

    <div class="portal-line"></div>


    <!-- =================================================
         CARD LOGIN
    ================================================== -->

    <div class="login-box">


        <!-- HEADER CARD -->

        <div class="login-header">

            <span class="login-label">
                ADMINISTRATOR
            </span>

            <h2>
                Login Admin
            </h2>

            <p>
                Silakan masuk untuk mengelola
                Portal Desa Digital Desa Oelomin.
            </p>

        </div>


        <!-- PESAN ERROR -->

        <?php if (isset($error)) { ?>

            <div class="login-error">

                <?= htmlspecialchars($error); ?>

            </div>

        <?php } ?>


        <!-- =================================================
             FORM LOGIN
        ================================================== -->

        <form method="POST"
              class="login-form">


            <!-- USERNAME -->

            <div class="form-group">

                <label for="username">
                    Username
                </label>

                <input
                    type="text"
                    id="username"
                    name="username"
                    placeholder="Masukkan username"
                    autocomplete="username"
                    required>

            </div>


            <!-- PASSWORD -->

            <div class="form-group">

                <label for="password">
                    Password
                </label>

                <div class="password-wrapper">

                    <input
                        type="password"
                        id="password"
                        name="password"
                        placeholder="Masukkan password"
                        autocomplete="current-password"
                        required>

                    <button
                        type="button"
                        class="toggle-password"
                        id="togglePassword">

                        Tampilkan

                    </button>

                </div>

            </div>


            <!-- TOMBOL LOGIN -->

            <button
                type="submit"
                name="login"
                class="login-button">

                Login

            </button>

        </form>


        <!-- =================================================
             KEMBALI KE BERANDA
        ================================================== -->

        <a href="index.php"
           class="back-home">

            ← Kembali ke Beranda

        </a>


        <!-- =================================================
             FOOTER CARD
        ================================================== -->

        <div class="login-footer">

            <span>
                Sistem Administrator
            </span>

            <span>
                © <?= date('Y'); ?> Desa Oelomin
            </span>

        </div>

    </div>


</div>


<!-- =====================================================
     JAVASCRIPT PASSWORD
===================================================== -->

<script>

const togglePassword =
    document.getElementById('togglePassword');

const password =
    document.getElementById('password');


togglePassword.addEventListener('click', function () {

    if (password.type === 'password') {

        password.type = 'text';

        this.textContent = 'Sembunyikan';

    } else {

        password.type = 'password';

        this.textContent = 'Tampilkan';

    }

});

</script>


</body>
</html>