<?php
session_start();

if (!isset($_SESSION['user']) || $_SESSION['level'] != 'A') {
    header("Location: ../index.php");
    exit;
}

require '../config.php'; 

ini_set('display_errors', 1);
error_reporting(E_ALL);

if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    $password_lama = $_POST['password_lama'];
    $password_baru = $_POST['password_baru'];
    $konfirmasi_password = $_POST['konfirmasi_password'];

    if ($password_baru != $konfirmasi_password) {
        $_SESSION['error'] = "Password baru dan konfirmasi password tidak cocok!";
        header("Location: gantipassword.php");
        exit;
    }

    $email = $_SESSION['user']; 

    $query = "SELECT cpassword, cemail, cjenis, dtglExpired, lresign FROM tbuserwebsite WHERE cemail = ?";
    $stmt = $conn->prepare($query);
    $stmt->bind_param("s", $email);
    $stmt->execute();
    $stmt->bind_result($password_terdaftar, $cemail, $cjenis, $dtglExpired, $lresign);
    $stmt->fetch();
    $stmt->close();

    if ($password_lama === $password_terdaftar) {
        $update_query = "UPDATE tbuserwebsite SET cpassword = ? WHERE cemail = ?";
        $update_stmt = $conn->prepare($update_query);
        $update_stmt->bind_param("ss", $password_baru, $email);
        $update_stmt->execute();

        if ($update_stmt->affected_rows > 0) {
            $_SESSION['success'] = "Password berhasil diganti!";
            header("Location: gantipassword.php");
            exit;
        } else {
            $_SESSION['error'] = "Terjadi kesalahan saat mengganti password.";
            header("Location: gantipassword.php");
            exit;
        }
    } else {
        $_SESSION['error'] = "Password lama tidak sesuai.";
        header("Location: gantipassword.php");
        exit;
    }
}
?>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <title>Ganti Password</title>
    <meta content="width=device-width, initial-scale=1.0, shrink-to-fit=no" name="viewport" />
    <link rel="icon" href="../assets/img/sekolah/favicon56.ico" type="image/x-icon" />
    <script src="../assets/js/plugin/webfont/webfont.min.js"></script>
    <script>
        WebFont.load({
            google: { families: ["Public Sans:300,400,500,600,700"] },
            custom: {
                families: [
                    "Font Awesome 5 Solid",
                    "Font Awesome 5 Regular",
                    "Font Awesome 5 Brands",
                    "simple-line-icons",
                ],
                urls: ["../assets/css/fonts.min.css"],
            },
            active: function () {
                sessionStorage.fonts = true;
            },
        });
    </script>
    <link rel="stylesheet" href="../assets/css/bootstrap.min.css" />
    <link rel="stylesheet" href="../assets/css/plugins.min.css" />
    <link rel="stylesheet" href="../assets/css/kaiadmin.min.css" />
    <link rel="stylesheet" href="../assets/css/demo.css" />
</head>
<body>
    <div class="wrapper">
        <?php $menu = "gantipassword"; require 'menu.php'; ?>
        <div class="main-panel">
            <?php require 'header.php'; ?>

            <div class="container">
                <div class="page-inner">
                    <div class="d-flex align-items-left align-items-md-center flex-column flex-md-row pt-2 pb-4">
                        <div class="page-header">
                            <h3 class="fw-bold mb-3">Ganti Password</h3>
                            <ul class="breadcrumbs mb-3">
                                <li class="nav-home">
                                    <a href="<?= url("/satpam"); ?>">
                                        <i class="icon-home"></i>
                                    </a>
                                </li>
                                <li class="separator">
                                    <i class="icon-arrow-right"></i>
                                </li>
                            </ul>
                        </div>
                    </div>

                    <!-- Form Ganti Password -->
                    <div class="card">
                        <div class="card-body">
                            <?php if (isset($_SESSION['error'])): ?>
                                <div class="alert alert-danger">
                                    <?= $_SESSION['error']; ?>
                                </div>
                                <?php unset($_SESSION['error']); ?>
                            <?php elseif (isset($_SESSION['success'])): ?>
                                <div class="alert alert-success">
                                    <?= $_SESSION['success']; ?>
                                </div>
                                <?php unset($_SESSION['success']); ?>
                            <?php endif; ?>
                            <form action="gantipassword.php" method="POST">
                                <div class="form-group">
                                    <label for="password_lama">Password Lama</label>
                                    <div class="input-group">
                                        <input type="password" class="form-control" id="password_lama" name="password_lama" placeholder="Masukkan password lama" required>
                                        <div class="input-group-append">
                                            <button type="button" class="btn btn-outline-secondary" id="togglePasswordLama"><i class="fa fa-eye"></i></button>
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label for="password_baru">Password Baru</label>
                                    <div class="input-group">
                                        <input type="password" class="form-control" id="password_baru" name="password_baru" placeholder="Masukkan password baru" required>
                                        <div class="input-group-append">
                                            <button type="button" class="btn btn-outline-secondary" id="togglePasswordBaru"><i class="fa fa-eye"></i></button>
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label for="konfirmasi_password">Konfirmasi Password Baru</label>
                                    <div class="input-group">
                                        <input type="password" class="form-control" id="konfirmasi_password" name="konfirmasi_password" placeholder="Konfirmasi password baru" required>
                                        <div class="input-group-append">
                                            <button type="button" class="btn btn-outline-secondary" id="toggleKonfirmasiPassword"><i class="fa fa-eye"></i></button>
                                        </div>
                                    </div>
                                </div>
                                <button type="submit" class="btn btn-primary">Ganti Password</button>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script src="../assets/js/core/jquery-3.7.1.min.js"></script>
    <script src="../assets/js/core/popper.min.js"></script>
    <script src="../assets/js/core/bootstrap.min.js"></script>
    <script src="../assets/js/plugin/jquery-scrollbar/jquery.scrollbar.min.js"></script>
    <script src="../assets/js/plugin/chart.js/chart.min.js"></script>
    <script src="../assets/js/plugin/jquery.sparkline/jquery.sparkline.min.js"></script>
    <script src="../assets/js/plugin/chart-circle/circles.min.js"></script>
    <script src="../assets/js/plugin/datatables/datatables.min.js"></script>
    <script src="../assets/js/plugin/bootstrap-notify/bootstrap-notify.min.js"></script>
    <script src="../assets/js/plugin/jsvectormap/jsvectormap.min.js"></script>
    <script src="../assets/js/plugin/jsvectormap/world.js"></script>
    <script src="../assets/js/plugin/sweetalert/sweetalert.min.js"></script>
    <script src="../assets/js/main.min.js"></script>

    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" rel="stylesheet">

    <script>
        // Toggle password visibility for old password
        document.getElementById('togglePasswordLama').addEventListener('click', function () {
            const passwordField = document.getElementById('password_lama');
            const type = passwordField.type === 'password' ? 'text' : 'password';
            passwordField.type = type;
            this.querySelector('i').classList.toggle('fa-eye-slash');
        });

        // Toggle password visibility for new password
        document.getElementById('togglePasswordBaru').addEventListener('click', function () {
            const passwordField = document.getElementById('password_baru');
            const type = passwordField.type === 'password' ? 'text' : 'password';
            passwordField.type = type;
            this.querySelector('i').classList.toggle('fa-eye-slash');
        });

        // Toggle password visibility for confirm password
        document.getElementById('toggleKonfirmasiPassword').addEventListener('click', function () {
            const passwordField = document.getElementById('konfirmasi_password');
            const type = passwordField.type === 'password' ? 'text' : 'password';
            passwordField.type = type;
            this.querySelector('i').classList.toggle('fa-eye-slash');
        });
    </script>
</body>
</html>
