<?php
// attendance.php

// Include session validation and database connection
include('session_validator.php');
include('includes/db_pdo.php'); // Include database connection file
?>

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

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>SRMS Admin Manage Subjects</title>
    <link rel="stylesheet" href="css/bootstrap.min.css" media="screen">
    <link rel="stylesheet" href="css/font-awesome.min.css" media="screen">
    <link rel="stylesheet" href="css/animate-css/animate.min.css" media="screen">
    <link rel="stylesheet" href="css/lobipanel/lobipanel.min.css" media="screen">
    <link rel="stylesheet" href="css/prism/prism.css" media="screen">
    <link rel="stylesheet" href="css/select2/select2.min.css">
    <link rel="stylesheet" href="css/main.css" media="screen">
    <script src="js/modernizr/modernizr.min.js"></script>
    <script src="js/jquery/jquery-2.2.4.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
</head>

<body class="top-navbar-fixed">
    <div class="main-wrapper">
        <?php include('includes/topbar.php'); ?>
        <div class="content-wrapper">
            <?php include('includes/leftbar.php'); ?>
            <div class="main-page">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="panel">
                                <div class="panel-heading">
                                    <div class="panel-title">
                                        <h5>Enter Attendance</h5>
                                    </div>
                                </div>
                                <div class="panel-body">
                                    <form id="attendanceForm">
                                        <div class="row">
                                            <div class="form-group col-md-3">
                                                <label for="exam_type">Exam Type</label>
                                                <select id="exam_type" name="exam_type" class="form-control" required>
                                                    <option value="">Select Exam Type</option>
                                                    <?php
                                                    // Fetch exam types from the database
                                                    $stmt = $conn->query("SELECT id, exam_type FROM examination_type");
                                                    while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
                                                        echo '<option value="' . $row['id'] . '">' . $row['exam_type'] . '</option>';
                                                    }
                                                    ?>
                                                </select>
                                            </div>

                                            <div class="form-group col-md-3">
                                                <label for="class_id">Select Class:</label>
                                                <select id="class_id" name="class_id" class="form-control" required>
                                                    <option value="">Select Class</option>
                                                    <?php
                                                    // Fetch classes from the database
                                                    $stmt = $conn->query("SELECT class_id, class_name, section FROM classes WHERE status = 'on'");
                                                    while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
                                                        echo "<option value='" . $row['class_id'] . "'>" . $row['class_name'] . " - " . $row['section'] . "</option>";
                                                    }
                                                    ?>
                                                </select>
                                            </div>
                                        </div>
                                        <div id="attendance-days-list"></div>

                                        <div class="form-group">
                                            <button class="btn btn-info" type="submit">Submit Attendance</button>
                                        </div>
                                    </form>

                                    <div id="loader" style="display:none;">Loading...</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- /.col-md-12 -->
                </div>
            </div>
        </div>
    </div>

    <script src="js/jquery/jquery-2.2.4.min.js"></script>
    <script>
        $(document).ready(function () {
            // Triggered when class is selected
            $('#class_id').change(function () {
                var classId = $(this).val();
                var examType = $('#exam_type').val();  // Get selected exam type

                if (classId && examType) {
                    $.ajax({
                        type: 'POST',
                        url: 'get_stn_atted.php', // Get attendance days
                        data: { classId: classId, exam_type: examType },
                        success: function (response) {
                            $('#attendance-days-list').html(response);
                        },
                        error: function (xhr, status, error) {
                            console.error("AJAX error:", status, error);
                        }
                    });
                }
            });

            // Submit attendance form with AJAX
            $('#attendanceForm').submit(function (e) {
                e.preventDefault(); // Prevent default form submission
                $('#loader').show(); // Show loader during request

                $.ajax({
                    type: 'POST',
                    url: 'process_attendance.php',
                    data: $(this).serialize(),
                    success: function (response) {
                        try {
                            var result = JSON.parse(response); // Parse the JSON response
                            if (result.status === 'success') {
                                Swal.fire({
                                    icon: 'success',
                                    title: 'Success',
                                    text: result.message
                                }).then(() => {
                                    window.location.reload(); // Optionally reload page
                                });
                            } else {
                                Swal.fire({
                                    icon: 'error',
                                    title: 'Error',
                                    text: result.message
                                });
                            }
                        } catch (e) {
                            console.error("Invalid JSON response:", response);
                            Swal.fire({
                                icon: 'error',
                                title: 'Error',
                                text: 'An unexpected error occurred. Please try again.'
                            });
                        }
                    },
                    error: function (xhr, status, error) {
                        console.error("AJAX Error:", status, error);
                        Swal.fire({
                            icon: 'error',
                            title: 'Error',
                            text: 'An error occurred while saving attendance. Please try again.'
                        });
                    }
                });
            });
        });

    </script>
<script src="js/jquery/jquery-2.2.4.min.js"></script>
        <script src="js/bootstrap/bootstrap.min.js"></script>
        <script src="js/pace/pace.min.js"></script>
        <script src="js/lobipanel/lobipanel.min.js"></script>
        <script src="js/iscroll/iscroll.js"></script>
        <script src="js/prism/prism.js"></script>
        <script src="js/main.js"></script>
        <script src="js/modernizr/modernizr.min.js"></script>

</body>
</html>
