<!DOCTYPE html>
<html>
<head>
    <?= $this->include('admin/inc/title') ?>
    <link rel="stylesheet"
          href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css">
</head>
<body>
 <?= $this->include('admin/inc/header') ?>
<div class="container mt-5">
    <div class="card">
        <div class="card-header bg-info text-white text-center">
            <h5>Today's Attendance</h5>
        </div>

        <div class="card-body text-center">

            <!-- Alerts -->
            <?php if (session()->getFlashdata('success')) { ?>
                <div class="alert alert-success">
                    <?= session()->getFlashdata('success') ?>
                </div>
            <?php } ?>

            <?php if (session()->getFlashdata('error')) { ?>
                <div class="alert alert-danger">
                    <?= session()->getFlashdata('error') ?>
                </div>
            <?php } ?>

            <?php if (!$attendance) { ?>

                <!-- 🔹 PUNCH IN -->
                <form method="post"
                      action="<?= base_url('attendance/punch-in') ?>"
                      onsubmit="return getLocation(this);">

                    <input type="hidden" name="latitude" id="latitude">
                    <input type="hidden" name="longitude" id="longitude">

                    <button class="btn btn-success btn-lg">
                        Punch In
                    </button>
                </form>

            <?php }
			elseif ($attendance && empty($attendance['punch_out_time'])) { ?>

                <p><strong>Punch In:</strong> <?= $attendance['punch_in_time'] ?></p>
                <p><strong>Work Mode:</strong> <?= $attendance['work_mode'] ?></p>

                <!-- 🔹 PUNCH OUT -->
                <form method="post" action="<?= base_url('attendance/punch-out') ?>">
                    <button class="btn btn-danger btn-lg">
                        Punch Out
                    </button>
                </form>

            <?php } else { ?>

                <p class="text-success"><strong>Attendance Completed</strong></p>
                <p>Punch In: <?= $attendance['punch_in_time'] ?></p>
                <p>Punch Out: <?= $attendance['punch_out_time'] ?></p>
                <p>Mode: <?= $attendance['work_mode'] ?></p>

            <?php } ?>
			
			<div class="row mt-5">
		<div class="col-md-4"></div>
		<div class="col-md-4"><a href="<?= base_url('home')?>"><button class="btn btn-danger btn-md">Return to Home</button></a></div>
		<div class="col-md-4"></div>
        </div>

        </div>
    </div>
</div>
 <?= $this->include('admin/inc/footer') ?>
<script>
function getLocation(form) {
    if (!navigator.geolocation) {
        alert("Location not supported");
        return false;
    }

    navigator.geolocation.getCurrentPosition(
        function (position) {
            document.getElementById('latitude').value = position.coords.latitude;
            document.getElementById('longitude').value = position.coords.longitude;
            form.submit();
        },
        function () {
            alert("Please enable location access to punch in");
        }
    );

    return false;
}

setTimeout(() => {
    document.querySelectorAll('.alert').forEach(el => el.style.display = 'none');
}, 5000);
</script>

</body>
</html>
