<?php
include('session_validator.php');
?>
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
       <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/toastr/toastr.min.css" media="screen">
    <link rel="stylesheet" href="css/icheck/skins/line/blue.css">
    <link rel="stylesheet" href="css/icheck/skins/line/red.css">
    <link rel="stylesheet" href="css/icheck/skins/line/green.css">
    <link rel="stylesheet" href="css/main.css" media="screen">
    <script src="js/modernizr/modernizr.min.js"></script>
  


  
   <link rel="stylesheet" href="styles.css">
    <!-- DataTables CSS -->
    <link rel="stylesheet" href="https://cdn.datatables.net/1.11.5/css/jquery.dataTables.min.css">
  <!-- jQuery -->
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <!-- DataTables JavaScript -->
    <script src="https://cdn.datatables.net/1.11.5/js/jquery.dataTables.min.js"></script>
 
          <style>
        .errorWrap {
    padding: 10px;
    margin: 0 0 20px 0;
    background: #fff;
    border-left: 4px solid #dd3d36;
    -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
    box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
}
.succWrap{
    padding: 10px;
    margin: 0 0 20px 0;
    background: #fff;
    border-left: 4px solid #5cb85c;
    -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
    box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
}
        </style>
        <style>
    .custom-pagination {
        text-align: right;
        margin-bottom: 10px; /* Adjust margin as needed */
    }
</style>
    </head>
    <body class="top-navbar-fixed">
        <div class="main-wrapper">

            <!-- ========== TOP NAVBAR ========== -->
   <?php include('includes/topbar.php');?> 
            <!-- ========== WRAPPER FOR BOTH SIDEBARS & MAIN CONTENT ========== -->
            <div class="content-wrapper">
                <div class="content-container">
<?php include('includes/leftbar.php');?>  
                <div class="main-page">
                    <div class="container-fluid"><div class="row page-title-div">
                                <div class="col-md-6">
                                    <h2 class="title">Manage Students</h2>
                                
                                </div>
                                
                                <!-- /.col-md-6 text-right -->
                            </div>
                            <!-- /.row -->
                            <div class="row breadcrumb-div">
                                <div class="col-md-6">
                                    <ul class="breadcrumb">
                                        <li><a href="dashboard.php"><i class="fa fa-home"></i> Home</a></li>
                                        <li> Students</li>
                                        <li class="active">Manage Students</li>
                                    </ul>
                                </div>
                             
                            </div>
                            <!-- /.row -->
                        </div>
                        <!-- /.container-fluid -->

                        <section class="section">
                            <div class="container-fluid">

                             

                                <div class="row">
                                    <div class="col-md-12">

                                        <div class="panel">
                                            <div class="panel-heading">
                                                <div class="panel-title">
                                                    <h5>View Students Info</h5>
                                                </div>
                                            </div>

                                        </div>
                 
                                            <div class="panel-body p-20">
<div class="custom-pagination">
    <!--<button onclick="previousPage()">Previous</button>-->
    <span id="pageNumber">Page 1</span>
    <button onclick="nextPage()">Next</button>
</div> </right>
    <table id="example" class="display table table-striped table-bordered" cellspacing="0" width="100%">
       <!-- Add an additional column header for the image -->
<thead>
    <tr>
        <th>S.N.</th>
        <th>IEMIS</th>
        <th>Name</th>
        <th>Date of Birth</th>
        <th>Phone</th>
        <th>Parent Name</th>
        <th>Parent Phone</th>
        <th>Class</th>
        <th>Image</th> <!-- Add this header for the image -->
        <th>Edit</th>
    </tr>
</thead>

<?php
// Include database connection code
include("includes/db.php");

// Fetch students from the database
$query = "SELECT * FROM students 
          INNER JOIN classes ON students.class = classes.Class_id";
$result = $conn->query($query);

if ($result->num_rows > 0) {
    // Output data of each row
    while ($row = $result->fetch_assoc()) {
        echo "<tr>";
        echo "<td>" . $row["student_id"] . "</td>";
        echo "<td>" . $row["regd_id"] . "</td>";
        echo "<td>" . $row["name"] . "</td>";
        echo "<td>" . $row["dob"] . "</td>";
        echo "<td>" . $row["phone"] . "</td>";
        echo "<td>" . $row["parent_name"] . "</td>";
        echo "<td>" . $row["parent_phone"] . "</td>";
        echo "<td>" . $row["class_name"] . "-" . $row["section"] . "</td>";

      // Displaying the student's image or default icon
    $imageFilename = $row["photo"];
    $imagePath = "uploads/" . $imageFilename;

    if ($imageFilename !== null && file_exists($imagePath) && is_readable($imagePath)) {
        // If image is not NULL and exists, display it
        echo "<td><img src='$imagePath' alt='Student Photo' width='50' height='50'></td>";
    } else {
        // If image doesn't exist, display default "user-blank" image
        $defaultImagePath = "uploads/user-blank.png"; // Adjust the filename if needed
        echo "<td><img src='$defaultImagePath' alt='Default Photo' width='50' height='50'></td>";
    }



        echo "<td><button type='button' class='btn btn-success'><a style='color:white' href='edit_student.php?student_id=" . $row["student_id"] . "'>Edit </a></button></td>";
        echo "</tr>";
    }
} else {
    echo "<tr><td colspan='12'>No students found</td></tr>";
}

// Close the database connection
$conn->close();
?>

                                  </table>

                                         
                                                <!-- /.col-md-12 -->
                                            </div>
                                        </div>
                                    </div>
                                    <!-- /.col-md-6 -->

                                                               
                                                </div>
                                                <!-- /.col-md-12 -->
                                            </div>
                                        </div>
                                        <!-- /.panel -->
                                    </div>
                                    <!-- /.col-md-6 -->

                                </div>
                                <!-- /.row -->

                            </div>
                            <!-- /.container-fluid -->
                        </section>
                        <!-- /.section -->

                    </div>
                    <!-- /.main-page -->

                    

                </div>
                <!-- /.content-container -->
            </div>
            <!-- /.content-wrapper -->

        </div>
        <!-- /.main-wrapper -->

        <!-- ========== COMMON JS FILES ========== -->
        <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>

        <!-- ========== PAGE JS FILES ========== -->
        <script src="js/prism/prism.js"></script>
        <script src="js/DataTables/datatables.min.js"></script>

        <!-- ========== THEME JS ========== -->
        <script src="js/main.js"></script>

<script>
    // Initialize DataTable with pagination controls
    $(document).ready(function () {
        var table = $('#example').DataTable({
    
            "lengthMenu": [25, 50, 100, 200, 500] // Customize row options
        });

        // Update page number
        updatePageNumber();

        // Function to go to the next page
        window.nextPage = function () {
            table.page('next').draw('page');
            updatePageNumber();
        };

        // Function to go to the previous page
        window.previousPage = function () {
            table.page('previous').draw('page');
            updatePageNumber();
        };

        // Function to update the displayed page number
        function updatePageNumber() {
            var pageInfo = table.page.info();
            $('#pageNumber').text("Page " + (pageInfo.page + 1));
        }
    });
</script>

    </body>
</html>


