<?php
require 'db_config.php';

$sql = "SELECT a.id, a.user_id, a.checkin_time, u.participant_type, u.fullname 
        FROM attendance a 
        JOIN users u ON a.user_id = u.id";
$result = $conn->query($sql);

// Filtering logic
$date_filter = '';
$type_filter = '';

if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    $date_filter = $_POST['date_filter'];
    $type_filter = $_POST['type_filter'];
}

$query = "SELECT * FROM attendance WHERE 1=1";

if (!empty($date_filter)) {
    $query .= " AND DATE(checkin_time) = '$date_filter'";
}

if (!empty($type_filter)) {
    $query .= " AND participant_type = '$type_filter'";
}

$result = $conn->query($query);

?>


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Attendance Management</title>
    <link rel="stylesheet" href="../Css/styleUser.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;700&display=swap" rel="stylesheet">
    <!-- Boxicons CDN Link -->
    <link href='https://unpkg.com/boxicons@2.0.7/css/boxicons.min.css' rel='stylesheet'>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6Hty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
    <style>
        body {
            font-family: Arial, sans-serif;
        }
        .form-horizontal {
            display: flex;
            align-items: center;
            gap: 10px;
            margin-bottom: 20px;
        }
        
        .form-horizontal label {
            margin-right: 5px;
        }

        .form-horizontal input,
        .form-horizontal select {
            margin-right: 15px;
        }
        form button {
            padding: 8px 12px;
            background-color: #007BFF;
            color: #fff;
            border: none;
            border-radius: 4px;
            cursor: pointer;
        }
        table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 20px;
        }
        th, td {
            padding: 12px;
            border: 1px solid #ccc;
            text-align: left;
        }
        th {
            background-color: #007BFF;
            color: white;
        }
    </style>
</head>
<body>
    <div class="sidebar">
        <div class="logo-details">
            <i class='bx bx-desktop'></i>
            <span class="logo_name">Mips</span>
        </div>
        <ul class="nav-links">
            <li>
                <a href="dashboard.php">
                    <i class='bx bx-grid-alt'></i>
                    <span class="links_name">Dashboard</span>
                </a>
            </li>
            <li>
                <a href="index.php">
                    <i class='bx bx-box'></i>
                    <span class="links_name">Register</span>
                </a>
            </li>
            <li>
                <a href="users.php">
                    <i class='bx bx-list-ul'></i>
                    <span class="links_name">Participants</span>
                </a>
            </li>
            <li>
                <a href="attendance.php" class="active">
                    <i class='bx bxs-user-detail'></i>
                    <span class="links_name">Attendance</span>
                </a>
            </li>
            <li>
                <a href="sub_user.php">
                    <i class="fas fa-user"></i>
                    <span class="links_name">Create User</span>
                </a>
            </li>
            <li>
                <a href="Disubuser.php">
                    <i class="fas fa-user-check"></i>
                    <span class="links_name">Sub User</span>
                </a>
            </li>
                       <li class="log_out">
                <a href="logout.php">
                    <i class='bx bx-log-out'></i>
                    <span class="links_name">Log out</span>
                </a>
            </li>
        </ul>
    </div>
    <section class="home-section">
        <nav>
            <div class="sidebar-button">
                <i class='bx bx-menu sidebarBtn'></i>
                <span class="dashboard">Meals</span>
            </div>
            <div class="search-box">
                <input input type="text" id="search-input" class="form-control form-control-sm mx-2" placeholder="Search...">
                <i class='bx bx-search'></i>
            </div>
        </nav>
        <div class="home-content">
            <div class="container">
                <br><br>
                <div class="form-container1">
                    <h2 style="text-align: center;">Attendance Management</h2>

                    <form method="POST" action="" class="form-horizontal">
        <label for="date_filter">Date:</label>
        <input type="date" id="date_filter" name="date_filter" value="<?php echo $date_filter; ?>">

        <label for="type_filter">Participant Type:</label>
        <select id="type_filter" name="type_filter">
            <option value="">--Select Type--</option>
            <option value="Sponsor" <?php if ($type_filter == 'Sponsor') echo 'selected'; ?>>Sponsor</option>
            <option value="Deligates" <?php if ($type_filter == 'Deligates') echo 'selected'; ?>>Deligates</option>
            <option value="Staff" <?php if ($type_filter == 'Staff') echo 'selected'; ?>>Staff</option>
            <option value="Speaker" <?php if ($type_filter == 'Speaker') echo 'selected'; ?>>Speaker</option>
            <option value="Service Provider" <?php if ($type_filter == 'Service Provider') echo 'selected'; ?>>Service Provider</option>
            <option value="Media" <?php if ($type_filter == 'Media') echo 'selected'; ?>>Media</option>
        </select>
        
        <button type="submit">Filter</button>
    </form>

    <form action="export_pdfparti.php" method="post" style="display: inline;">
        <button type="submit" style="background-color: #8B0000; color: white; border: none; padding: 10px 20px; border-radius: 4px; cursor: pointer;">
     PDF
</button>

    </form>

    <form action="export_excel.php" method="post" style="display: inline;">
        <button type="submit" style="background-color: #217346; color: white; border: none; padding: 10px 20px; border-radius: 4px; cursor: pointer;">
    Excel
</button>

    </form>
                </div>
               

<table border="1">
        <thead>
            <tr>
                <th>ID</th>
                <th>User ID</th>
                <th>Check-in Time</th>
                <th>Participant Type</th>
                <th>Full Name</th>
                
            </tr>
        </thead>
        <tbody>
            <?php
            if ($result->num_rows > 0) {
                while ($row = $result->fetch_assoc()) {
                    echo "<tr>";
                    echo "<td>" . $row['id'] . "</td>";
                    echo "<td>" . $row['user_id'] . "</td>";
                    echo "<td>" . $row['checkin_time'] . "</td>";
                    echo "<td>" . $row['participant_type'] . "</td>";
                    echo "<td>" . $row['fullname'] . "</td>";
                    
                    echo "</tr>";
                }
            } else {
                echo "<tr><td colspan='6'>No records found.</td></tr>";
            }
            ?>
        </tbody>
     </table>
            </div>
        </div>
        <div id="qr-reader" style="width: 300px; margin: auto;"></div>

    </section>

    <script>
      const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);

     if (isMobile) {
    // Load QR scanner library and initialize camera scanning
    const script = document.createElement('script');
    script.src = 'https://unpkg.com/html5-qrcode';
    script.onload = () => {
      const scanner = new Html5Qrcode("qr-reader");
      scanner.start(
        { facingMode: "environment" },
        {
          fps: 10,
          qrbox: { width: 250, height: 250 }
        },
        qrCodeMessage => {
          // Send scan result PHP processor
          fetch("attendance_scanner.php", {
            method: "POST",
            headers: { "Content-Type": "application/x-www-form-urlencoded" },
            body: "qr_code=" + encodeURIComponent(qrCodeMessage)
          }).then(res => res.text()).then(response => {
            // handle feedback UI here
            console.log(response);
          });
        },
        errorMessage => {
          // optional: handle scan errors
        }
      );
    };
    document.body.appendChild(script);
  } else {
    // Desktop — do nothing, use manual input scanning
  }
</script>


</body>
</html>

<?php
$conn->close();
?>
