<?php $this->load->view('template/header'); ?>

<div class="container">
    <div class="card my-5 text-dark bg-light mb-3">
        <div class="card-header">Login</div>
        <div class="card-body">
            <div class="row justify-content-center my-4">
                <div class="col-md-4">
                    <h4 class="text-center mb-3">Lupa Password</h4>
                    <?= $this->session->flashdata('pesan'); ?>
                    <?= $this->session->flashdata('pesan2'); ?>
                    <?= $this->session->flashdata('error'); ?>
                    <form action="<?= base_url('auth/aksigantipassword') ?>" method="post">
                        <div class="mb-3">
                            <input type="password" class="form-control" id="password1" name="password1" placeholder="password" required>
                            <small id="passwordHelp" class="form-text text-muted">Password harus minimal 8 karakter dan harus mengandung angka.</small>
                        </div>
                        <div class="mb-3">
                            <input type="password" class="form-control" id="password2" name="password2" placeholder="Ulangi password" required>
                            <small id="passwordMatchHelp" class="form-text text-danger d-none">Password tidak cocok.</small>
                        </div>
                        <div class="d-grid">
                            <button type="submit" class="btn btn-success bg-custom">Reset Password</button>
                            <p></p><a href="">Login</a>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<?php $this->load->view('template/js'); ?>
<script>
    // JavaScript for validating password length and presence of numbers
    document.getElementById("passwordResetForm").addEventListener("submit", function(event) {
        var password1 = document.getElementById("password1").value;
        var password2 = document.getElementById("password2").value;
        
        if (password1.length < 8 || !/\d/.test(password1)) {
            event.preventDefault();
            alert("Password harus minimal 8 karakter dan harus mengandung angka.");
            return false;
        }
        
        if (password1 !== password2) {
            event.preventDefault();
            document.getElementById("passwordMatchHelp").classList.remove("d-none");
            return false;
        }
        
        return true;
    });
</script>
<?php $this->load->view('template/footer'); ?>