1#@!#!123s

: / home / schoolcampuserp / hrschool.in /
Filename : index.php
back
<?php 
    include('admin/database/dbconfig.php');
    
    $sql1 = "SELECT * FROM banner WHERE status=1";
    $query_sql1 = mysqli_query($conn, $sql1);
    
    $sql2 = "SELECT * FROM director_message WHERE id=1"; // Assuming there's only one row
    $result = mysqli_query($conn, $sql2);
    $director = mysqli_fetch_assoc($result);
    
    $sql3 = "SELECT * FROM announcements Order BY created_at DESC LIMIT 10";
    $announcements = mysqli_query($conn, $sql3);
  session_start();
  
?>

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

<?php include('head.php') ?>

<body>

    <?php include('header.php') ?>
    
    <!-- Carousel Start -->
    <div class="header-carousel owl-carousel">
        
      <?php  if (mysqli_num_rows($query_sql1) > 0) { 
                 while ($row = mysqli_fetch_assoc($query_sql1)) {
      ?>
        <div class="header-carousel-item">
            <img src="<?php echo 'admin/files/images/' . $row['image_path']; ?>" class="img-fluid w-100" alt="Image">
             <!--<div class="carousel-caption">-->
             <!--       <div class="carousel-caption-content p-3" style="max-width: 900px;">-->
             <!--           <h4 class="text-secondary text-uppercase sub-title fw-bold mb-4 wow fadeInUp" data-wow-delay="0.1s" style="letter-spacing: 3px;">Let's Grow</h4>-->
             <!--           <h1 class="display-1 text-capitalize text-white mb-4 wow fadeInUp" data-wow-delay="0.3s">Once A Dancer, Is Always A Dance</h1>-->
             <!--           <p class="fs-5 wow fadeInUp" data-wow-delay="0.5s">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, -->
             <!--           </p>-->
             <!--           <div class="pt-2">-->
             <!--               <a class="btn btn-primary rounded-pill text-white py-3 px-5 m-2 wow fadeInLeft slide-btn" data-wow-delay="0.1s" href="#">Join Now</a>-->
             <!--               <a class="btn btn-secondary rounded-pill text-white py-3 px-5 m-2 wow fadeInRight slide-btn" data-wow-delay="0.3s" href="#">Read More</a>-->
             <!--           </div>-->
             <!--       </div>-->
             <!--   </div> -->
             
        </div>
        <?php } 
        }?>
    </div>
    <!-- Enquiry Form Outside Carousel -->
<div class="fixed-form">
    <h2 class="text-secondary text-center me-sm-5">Enquiry Form</h2>
    <?php
        if (isset($_SESSION['status']) && $_SESSION['status'] != "") {
            ?>
            <div class="alert alert-<?php echo ($_SESSION['status_code'] == "success") ? "success" : "danger"; ?> alert-dismissible fade show" role="alert" style="z-index:1000;">
                <?php echo $_SESSION['status']; ?>
                <!--<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>-->
            </div>
            <?php
            unset($_SESSION['status']);
            unset($_SESSION['status_code']);
        }
    ?>
    <form action="backend.php" method="post">
        <div class="mb-3">
            <label for="name" class="form-label">Full Name</label>
            <input type="text" class="form-control" id="name"  name="name" placeholder="Enter your name" required>
        </div>
        <div class="mb-3">
            <label for="email" class="form-label">Email Address</label>
            <input type="email" class="form-control" id="email"  name="email" placeholder="Enter your email" >
        </div>
        <div class="mb-3">
            <label for="mobile" class="form-label">Mobile Number</label>
            <input type="tel" class="form-control" id="phone" name="phone" placeholder="Enter your mobile number" required>
        </div>
        <button type="submit" name="enquiry_btn_save" class="btn btn-info w-100">Submit</button>
    </form>
</div>
    <!-- Carousel End -->

    <!-- Banner Start -->
    <?php include('banner.php') ?>
    <!-- Banner End -->

    <!-- Director Message Start -->
    <div class="container-fluid py-lg-5">
        <div class="container-fluid px-lg-5">
            <div class="row g-4 align-items-center">
                <!-- Left Side: Director's Message -->
                <div class="col-lg-8 wow fadeInLeft" data-wow-delay="0.3s">
                    <div class="director-message bg-light p-4">
                        <h4 class="text-secondary sub-title fw-bold">Message from</h4>
                        <h1 class="display-5 mb-4"><strong class="text-primary">Our Director</strong></h1>
                        <div class="row align-items-center">
                            <!-- Director Photo -->
                            <div class="col-md-6 text-center mb-3 mb-md-0 mt-0">
                                <img src="admin/<?php echo $director['director_img']  ?>" alt="Director Photo" class="img-fluid shadow-sm shadow-right" style="width: 400px; height: 380px;">
                            </div>
                            <!-- Director Message -->
                            <div class="col-md-6">
                                <p class="">
                                    <?php echo substr($director['director_message'], 0, 1000);  ?>
                                    <a href="director_message.php">Read More</a>
                                </p>
                                <p class="fw-bold text-secondary mt-3">- <?php echo $director['director_name']  ?></p>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- Right Side: Notice Board -->
                <div class="col-lg-4 mb-5 wow fadeInRight" data-wow-delay="0.1s">
                    <div class="notice-board text-primary rounded shadow-sm p-3">
                        <h4 class="text-danger fw-bold text-center border-bottom-0 pb-2 mb-3">Announcements</h4>
                        <div class="notice-content" style="height: 470px; overflow: hidden; position: relative;">
                             <marquee direction="up" scrollamount="3" onmouseover="this.stop();" onmouseout="this.start();" style="height: 100%;"> 
                            <ul class="list-unstyled ">
                                <?php if(mysqli_num_rows($announcements) > 0) {
                                        while ($announcement = mysqli_fetch_assoc($announcements)) {
                                            $created_at = new DateTime($announcement['created_at']); // Assuming 'created_at' is in the format 'YYYY-MM-DD HH:MM:SS'
                                            $today = new DateTime();
                                            $interval = $today->diff($created_at);
                                            $is_new = $interval->days <= 1; 
                                ?>
                                     
                                <li class="mb-3 text-center bg-primary rounded">
                                    <a href="admin/<?php echo $announcement['file_path']; ?>" target="_blank" class="text-white text-decoration-none">
                                      <p class="mb-0 text-warning fw-bold"><i class="fas fa-bell"></i> Update on <?php echo (new DateTime($announcement['created_at']))->format('d-M-Y'); ?><?php if ($is_new): ?>
                                            <span class="badge bg-info text-white">New</span>
                                        <?php endif; ?></p>
                                        <p> <?php echo $announcement['title'];  ?> </p>
                                        
                                    </a>
                                </li>
                                <hr class="text-secondary fw-600">

                                <?php }} ?>
                            </ul>
                             </marquee>
                        </div>
                        <a href="announcements.php" class="btn btn-sm btn-warning rounded-pill mt-3">View All Notices</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Director Message -->



    <!-- Counter Facts Start -->
    <div class="container-fluid counter-facts py-5">
        <div class="container-fluid px-5">
            <div class="row">
                <div class="col-12 col-sm-6 col-md-6 col-xl-3 wow fadeInUp" data-wow-delay="0.1s">
                    <div class="counter">
                        <div class="counter-icon w-100 d-flex align-items-center justify-content-center">
                            <h3>Year of Excellence</h3>
                        </div>
                        <div class="counter-content d-flex align-items-center justify-content-center mt-4">
                            <span class="counter-value" data-toggle="counter-up">25</span>
                            <h4 class="text-primary mb-0" style="font-weight: 600; font-size: 25px;">%</h4>
                        </div>
                    </div>
                </div>
                <div class="col-12 col-sm-6 col-md-6 col-xl-3 wow fadeInUp" data-wow-delay="0.3s">
                    <div class="counter">
                        <div class="counter-icon w-100 d-flex align-items-center justify-content-center">
                            <h3>Certified Teacher</h3>
                        </div>
                        <div class="counter-content d-flex align-items-center justify-content-center mt-4">
                            <span class="counter-value" data-toggle="counter-up">45</span>
                            <h4 class="text-primary mb-0" style="font-weight: 600; font-size: 25px;">+</h4>
                        </div>
                    </div>
                </div>
                <div class="col-12 col-sm-6 col-md-6 col-xl-3 wow fadeInUp" data-wow-delay="0.5s">
                    <div class="counter">
                        <div class="counter-icon w-100 d-flex align-items-center justify-content-center">
                            <h3>Athletic Participation</h3>
                        </div>
                        <div class="counter-content d-flex align-items-center justify-content-center mt-4">
                            <span class="counter-value" data-toggle="counter-up">84</span>
                            <h4 class="text-primary mb-0" style="font-weight: 600; font-size: 25px;">+</h4>
                        </div>
                    </div>
                </div>
                <div class="col-12 col-sm-6 col-md-6 col-xl-3 wow fadeInUp" data-wow-delay="0.7s">
                    <div class="counter">
                        <div class="counter-icon w-100 d-flex align-items-center justify-content-center">
                            <h3>Satistied parents</h3>
                        </div>
                        <div class="counter-content d-flex align-items-center justify-content-center mt-4">
                            <span class="counter-value" data-toggle="counter-up">100</span>
                            <h4 class="text-primary mb-0" style="font-weight: 600; font-size: 25px;">%</h4>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Counter Facts End -->
    <!-- About Start -->
    <?php
        $sql12 = "SELECT * FROM about_school WHERE id=1";
        $res_sql12 = mysqli_query($conn, $sql12);
        $about = mysqli_fetch_assoc($res_sql12);
    
    ?>
    <div class="container-fluid py-lg-5">
        <div class="container-fluid px-lg-5" >
            <div class="row g-4 align-items-center">

                <div class="col-lg-7 wow fadeInRight p-2" data-wow-delay="0.3s">
                    <h4 class="sub-title fw-bold ">About School</h4>

                    <p class="text-dark text-justify"><?php echo substr($about['about'],0,1700) . "..."; ?>
                        <p class="mb-4">
                            <?php  $key_features = explode(',', $about['key_features']);
                                    $key_features = array_filter(array_map('trim', $key_features));
                                    if (empty($key_features)) {      
                            ?>
                            <ul class="text-dark">
                                <?php
                                
                                foreach ($key_features as $feature) {
                                    echo '<li><i class="ri-check-fill"></i> ' . trim($feature) . '</li>';
                                }
                                ?>

                             </ul>
                            <?php } ?>
                    </p>
                    <a class="btn btn-primary rounded-pill text-white py-3 px-5" href="about.php">Read More</a>
                </div>
                <div class="col-lg-5 wow fadeInLeft" data-wow-delay="0.1s">
                    <div class="row mb-2">
                        <div class="col-md-12">
                            <img src="admin/<?php echo $about['image1']; ?>" class="img-fluid w-100 border" style="height:250px; object-fit:cover" alt="Image">
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-6 col-md-6">
                                <img src="admin/<?php echo $about['image2']; ?>" class="img-fluid w-100 border" style="height:210px; object-fit:cover" alt="Image">
                            
                        </div>
                        <div class="col-lg-6 col-md-6">
                                <img src="admin/<?php echo $about['image3']; ?>" class="img-fluid w-100 border" style="height:210px; object-fit:cover" alt="Image">
                           
                        </div>
                    </div>
                    
                </div>
            </div>
        </div>
    </div>
    <!-- About End -->
    <!-- Facilities Start -->
    <div class="container-fluid testimonial facilities-section pb-5">
        <div class="container-fluid px-lg-5 pb-5 rounded">
            <div class="pb-2 text-center">
                <h4 class="sub-title fw-bold wow fadeInUp text-secondary" data-wow-delay="0.1s">OUR FACILITIES</h4>
                <h1 class=" mb-0 wow fadeInUp text-primary" data-wow-delay="0.3s">What we Provides</h1>
            </div>
         <div class="owl-carousel testimonial-carousel  pt-0 wow fadeInUp" data-wow-delay="0.2s">
    <?php
        $sql10 = "SELECT * FROM facilities WHERE status='Available'";
        $res_sql10 = mysqli_query($conn, $sql10);
        if (mysqli_num_rows($res_sql10) > 0) {
            while ($facility = mysqli_fetch_assoc($res_sql10)) {
    ?>
                <div class="testimonial-item border text-center rounded bg-white fixed-height">
                    <div class="position-absolute"
                        style="width: 320px; height: 200px; top: 25px; left: 50%; transform: translateX(-50%); overflow: hidden;">
                        <img class="img-fluid w-100 h-100" 
                            src="admin/files/facilities/<?php echo $facility['image_path'];?>" 
                            alt="img"
                            style="object-fit: cover;">
                    </div>

                    <div class="position-relative" style="margin-top: 250px;">
                        <h5 class="mb-0"><?php echo $facility['name']; ?></h5>
                    </div>
                    <div class="testimonial-content p-4 text-dark">
                        <p class="fs-5 mb-0">
                            <?php 
                                $desc = $facility['description']; 
                                $short_desc = substr($desc, 0, 160);
                            ?>
                            <span class="shortDesc"><?php echo htmlspecialchars($short_desc); ?>...</span>
                            <span class="fullDesc" style="display: none;"><?php echo htmlspecialchars($desc); ?></span>
                            <button class="readMore fw-bold text-secondary" style="all: unset; cursor: pointer;">Read More</button>
                        </p>
                    </div>
                </div>
    <?php
            }
        }
    ?>
</div>


        </div>
    </div> 

    <!-- Facilities End -->

    <!-- Toppers Section Start -->
    <?php
          
    $currentYear = date('Y');
    $nextYear = $currentYear + 1;
    $currentSession = "$currentYear-" . substr($nextYear, -2);
    $session = intval($currentSession);
    $sqlX = "SELECT * FROM toppers WHERE session = $session AND class = 'X' ORDER BY percentage DESC";
    $toppersX = mysqli_query($conn, $sqlX);
    
    $sqlXII = "SELECT * FROM toppers WHERE session = $session AND class = 'XII' ORDER BY percentage DESC";
    $toppersXII = mysqli_query($conn, $sqlXII);

  
    ?>
    <div class="container-fluid team pb-5">
        <div class="container-fluid px-lg-5 pb-5">
            <!-- Section Header -->
            <div class="pb-4 text-center">
                <h4 class="text-secondary sub-title fw-bold wow fadeInUp mt-5" data-wow-delay="0.1s">Toppers <?php echo $session; ?></h4>
                <h1 class="display-4 mb-4 wow fadeInUp text-primary " data-wow-delay="0.3s">CBSE Class X & XII Result</h1>
            </div>
            <!-- Toppers Grid -->
            <div class="row g-3 justify-content-center owl-carousel topper-carousel" style="height:300px;">
                <!-- Toppers -->
                <?php if(mysqli_num_rows($toppersX)>0){
                        while($topper = mysqli_fetch_assoc($toppersX)){ 
                ?>
                          
                <div class="col-lg-2 col-md-3 col-6 wow fadeInUp mt-3 mb-3" data-wow-delay="0.1s" style="height:270px; width:160px;">
                    <div class="card border-0 shadow-sm h-100 hover-effect">
                        <div class="card-img-top position-relative">
                            <img src="admin/<?php echo $topper['photo_path']; ?>" alt="Toppers Photo" class="img-fluid w-100" style="object-fit: cover; height:170px;">
                        </div>
                        <div class="card-body text-center">
                            <h6 class="fw-bold mb-1 text-primary"><?php echo $topper['name']; ?></h6>
                            <p class="mb-1 text-muted small">Class: <?php echo $topper['class']; ?></p>
                            <p class="text-danger fw-bold mb-0"><?php echo $topper['percentage']; ?>%</p>
                        </div>
                    </div>
                </div>  
                
                <?php } } ?>
            </div>

            <div class="row g-4 justify-content-center mt-3 owl-carousel topper-carousel" style="height:300px;">
                <!-- Toppers -->
                <?php if(mysqli_num_rows($toppersXII)>0){
                        while($topper = mysqli_fetch_assoc($toppersXII)){ 
                ?>
                      
                <div class="col-lg-2 col-md-3 col-sm-6 wow fadeInUp mt-3 mb-3" data-wow-delay="0.1s" style="height:270px; width:160px">
                    <div class="card border-0 shadow-sm h-100 hover-effect">
                        <div class="card-img-top position-relative">
                            <img src="admin/<?php echo $topper['photo_path']; ?>" alt="Toppers Photo" class="img-fluid w-100" style="object-fit: cover; height:170px;">
                        </div>
                        <div class="card-body text-center">
                            <h6 class="fw-bold mb-1 text-primary"><?php echo $topper['name']; ?></h6>
                            <p class="mb-1 text-muted small">Class: <?php echo $topper['class']; ?></p>
                            <p class="text-danger fw-bold mb-0"><?php echo $topper['percentage']; ?>%</p>
                        </div>
                    </div>
                </div>  
                      
                <?php   } } ?>
                
            </div>
            
        </div>
    </div>
    <!-- Toppers Section End -->


    <!-- Birthday Section Start -->
    <?php
    
    $image_base_url = "https://kushal.amarshaktimemorialschool.in/";
    // Get today's date and extract day and month
    $today = date('Y-m-d');
    $current_day = date('d');
    $current_month = date('m');
      if (isset($conn1) && $conn1) {
    // Check if $conn1 is a valid connection and run the query
    $sql5 = "
        SELECT 
            s.id, 
            s.firstname, 
            s.image, 
            s.dob, 
            ss.class_id, 
            ss.section_id, 
            c.class AS class_name, 
            sec.section AS section_name,
            sch.session_id,
            DATEDIFF(
                DATE(CONCAT(YEAR(CURDATE()), '-', MONTH(s.dob), '-', DAY(s.dob))),
                CURDATE()
            ) AS days_until_birthday
        FROM students s
        INNER JOIN student_session ss ON s.id = ss.student_id
        INNER JOIN classes c ON ss.class_id = c.id
        INNER JOIN sections sec ON ss.section_id = sec.id
        INNER JOIN sch_settings sch ON ss.session_id = sch.session_id
        WHERE 
            DATEDIFF(
                DATE(CONCAT(YEAR(CURDATE()), '-', MONTH(s.dob), '-', DAY(s.dob))),
                CURDATE()
            ) BETWEEN 0 AND 7
        ORDER BY days_until_birthday ASC
        LIMIT 4
    ";
    $students = mysqli_query($conn1, $sql5);

    // Check for errors in query execution
    if (!$students) {
        echo "Error executing query on conn1: " . mysqli_error($conn1);
    }
    } else {
        
        $sql5 = "
            SELECT 
                id, 
                name as firstname,
                image_path, 
                dob, 
                role,
                'N/A' AS class_name, 
                'N/A' AS section_name,
                'N/A' AS session_id,
                DATEDIFF(
                    DATE(CONCAT(YEAR(CURDATE()), '-', MONTH(dob), '-', DAY(dob))),
                    CURDATE()
                ) AS days_until_birthday
            FROM users
            WHERE 
                DATEDIFF(
                    DATE(CONCAT(YEAR(CURDATE()), '-', MONTH(dob), '-', DAY(dob))),
                    CURDATE()
                ) BETWEEN 0 AND 7
            ORDER BY days_until_birthday ASC
            LIMIT 4
        ";
    
    $students = mysqli_query($conn, $sql5);
    }
    ?>
    <div class="container-fluid birthday-section pb-5">
        <div class="container-fluid px-lg-5 pb-5">
            <!-- Section Header -->
            <div class="section-header text-center mb-5">
                <h4 class="section-subtitle text-secondary fw-bold wow fadeInUp" data-wow-delay="0.1s">
                    <i class="ph-cake-fill me-2"></i>Birthday Celebrations
                </h4>
                <h1 class="section-title display-4 mb-4 wow fadeInUp text-primary" data-wow-delay="0.3s">
                    Today's & Upcoming Birthdays
                </h1>
                <p class="section-description text-muted mx-auto wow fadeInUp" data-wow-delay="0.5s">
                    Celebrating the special moments of our incredible team and students
                </p>
            </div>

            <!-- Birthday Cards Row -->
            <div class="row g-4 justify-content-center">
                <!-- Birthday Card -->
                <?php if(mysqli_num_rows($students)>0) {
                        while($student = mysqli_fetch_assoc($students)){ ?>
                            
                     
                <div class="col-lg-3 col-md-6 col-sm-12 wow fadeInUp" data-wow-delay="0.1s">
                    <div class="birthday-card">
                        <div class="birthday-card-content">
                            <?php if($student['days_until_birthday'] == 0){ ?>
                            <div class="birthday-badge">Today!</div>
                            <h3 class="celebrant-name"><?php echo $student['firstname']; ?></h3>
                            <?php if (isset($conn1) && $conn1) { ?>
                            <p class="celebrant-details"><?php echo $student['class_name']; ?> (<?php echo $student['section_name']; ?>)</p>
                             <?php } else { ?>
                             <p class="celebrant-details"><?php echo $student['role']; ?></p>
                              <?php } ?>
                            <button class="btn btn-wish">Send Wishes</button>
                            
                            
                            <?php } else { ?>
                            
                            <div class="birthday-badge birthday-badge-upcoming">In <?php echo $student['days_until_birthday']; ?> Days</div>
                            <h3 class="celebrant-name"><?php echo $student['firstname']; ?></h3>
                            <?php if (isset($conn1) && $conn1) { ?>
                            <p class="celebrant-details"><?php echo $student['class_name']; ?> (<?php echo $student['section_name']; ?>)</p>
                             <?php } else { ?>
                             <p class="celebrant-details"><?php echo $student['role']; ?></p>
                              <?php } ?>
                            <?php } ?>
                        </div>
                        <?php if (isset($conn1) && $conn1) { ?>
                            <img src="<?php echo $image_base_url . $student['image']; ?>" alt="Birthday Image" class="img-fluid birthday-card-bg">
                        <?php } else { ?>
                            <img src="admin/<?php echo $student['image_path']; ?>" alt="Birthday Image" class="img-fluid birthday-card-bg">
                        <?php } ?>

                    </div>
                </div>
                <?php    }
                } ?>

               
            </div>
            
             <div class="text-center mt-5">
               
                    <i class="ph-cake-fill me-2"></i><a class="btn btn-primary rounded-pill text-white py-3 px-5" href="birthday.php">View All</a>
                
                
            </div>

        </div>
        
    </div>
    <!-- Birthday Section End -->


    


    <!-- Events Start -->
    <div class="container-fluid events py-lg-5">
        <div class="container-fluid px-lg-5 py-lg-5">
            <div class="pb-5">
                <div class="row g-4 align-items-end">
                    <div class="col-xl-8">
                        <h4 class="text-secondary sub-title fw-bold wow fadeInUp" data-wow-delay="0.1s">Events</h4>
                        <h1 class="display-2 mb-0 wow fadeInUp text-primary" data-wow-delay="0.3s">Upcoming Events</h1>
                    </div>
                    <div class="col-xl-4 text-xl-end pb-3 wow fadeInUp" data-wow-delay="0.3s">
                        <a class="btn btn-primary rounded-pill text-white py-3 px-5" href="event.php">View All Events</a>
                    </div>
                </div>
            </div>
            <div class="row g-4 justify-content-center">
                <?php
                    $sql11 = "SELECT * FROM events ORDER BY event_date DESC LIMIT 4";
                    $res_sql11 = mysqli_query($conn, $sql11);
                    if(mysqli_num_rows($res_sql11)>0){
                        while($event = mysqli_fetch_assoc($res_sql11)){
                ?>
                
                
                <div class="col-md-6 col-lg-4 col-xl-3 wow fadeInUp" data-wow-delay="0.1s">
                    <div class="event-item rounded">
                        <div class="position-relative">
                            <img src="admin/files/events/<?php echo $event['image']; ?>" class="img-fluid rounded-top w-100" style="height: 150px; object-fit: cover;" alt="Image">
                            <div class="bg-primary text-white fw-bold rounded d-inline-block position-absolute p-2"
                                style="top: 0; right: 0;"><?php echo date("M d", strtotime($event['event_date'])); ?></div>
                            <div class="d-flex justify-content-between border-start border-end bg-white px-2 py-2 w-100 position-absolute"
                                style="bottom: 0; left: 0; opacity: 0.8;">
                                <a href="#" class="text-dark"><i class="fas fa-clock text-primary"></i> <?php echo $event['start_time']; ?>
                                   -<?php echo $event['end_time']; ?></a>
                                <a href="#" class="text-dark"><span class="fas fa-map-marker-alt text-primary"></span>
                                    <?php echo $event['location']; ?></a>
                            </div>
                        </div>
                        <div class="border border-top-0 rounded-bottom p-4">
                            <a href="#" class="h4 mb-3 d-block"><?php echo $event['name']; ?></a>
                            <p class="mb-3"><?php echo $event['description']; ?></p>
                            <a class="btn btn-primary rounded-pill text-white py-2 px-4" href="#">Watch Now</a>
                        </div>
                    </div>
                </div>
                
                <?php
                        }
                    }
                
                ?>
    
            </div>
        </div>
    </div>
    <!-- Events End -->



    <!-- Blogs Start -->
    <!--<div class="container-fluid blog pb-5">-->
    <!--    <div class="container pb-5">-->
    <!--        <div class="pb-5">-->
    <!--            <h4 class="text-secondary sub-title fw-bold wow fadeInUp" data-wow-delay="0.1s">Blog & News</h4>-->
    <!--            <h1 class="display-2 mb-0 wow fadeInUp" data-wow-delay="0.3s">Our Latest News & Articles</h1>-->
    <!--        </div>-->
    <!--        <div class="blog-carousel owl-carousel pt-5 wow fadeInUp" data-wow-delay="0.1s">-->
    <!--            <div class="blog-item bg-white rounded wow fadeInUp" data-wow-delay="0.1s">-->
    <!--                <div class="blog-img rounded-top">-->
    <!--                    <img src="img/class-1.jpg" class="img-fluid rounded-top w-100" alt="Image">-->
    <!--                </div>-->
    <!--                <div class="bg-light rounded-bottom p-4">-->
    <!--                    <div class="d-flex justify-content-between mb-4">-->
    <!--                        <a href="#" class="text-muted"><i class="fa fa-calendar-alt text-primary"></i> 28 August-->
    <!--                            2021</a>-->
    <!--                        <a href="#" class="text-muted"><span class="fa fa-comments text-primary"></span> 3-->
    <!--                            Comments</a>-->
    <!--                    </div>-->
    <!--                    <a href="#" class="h4 mb-3 d-block">Classical Dance class</a>-->
    <!--                    <p class="mb-3">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Magni vero excepturi-->
    <!--                        blanditiis quidem</p>-->
    <!--                    <a class="btn btn-primary rounded-pill text-white py-2 px-4" href="#">Read More</a>-->
    <!--                </div>-->
    <!--            </div>-->
    <!--            <div class="blog-item bg-white rounded wow fadeInUp" data-wow-delay="0.3s">-->
    <!--                <div class="blog-img rounded-top">-->
    <!--                    <img src="img/class-2.jpg" class="img-fluid rounded-top w-100" alt="Image">-->
    <!--                </div>-->
    <!--                <div class="bg-light rounded-bottom p-4">-->
    <!--                    <div class="d-flex justify-content-between mb-4">-->
    <!--                        <a href="#" class="text-muted"><i class="fa fa-calendar-alt text-primary"></i> 28 August-->
    <!--                            2021</a>-->
    <!--                        <a href="#" class="text-muted"><span class="fa fa-comments text-primary"></span> 3-->
    <!--                            Comments</a>-->
    <!--                    </div>-->
    <!--                    <a href="#" class="h4 mb-3 d-block">Classical Dance class</a>-->
    <!--                    <p class="mb-3">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Magni vero excepturi-->
    <!--                        blanditiis quidem</p>-->
    <!--                    <a class="btn btn-primary rounded-pill text-white py-2 px-4" href="#">Read More</a>-->
    <!--                </div>-->
    <!--            </div>-->
    <!--            <div class="blog-item bg-white rounded wow fadeInUp" data-wow-delay="0.5s">-->
    <!--                <div class="blog-img rounded-top">-->
    <!--                    <img src="img/class-3.jpg" class="img-fluid rounded-top w-100" alt="Image">-->
    <!--                </div>-->
    <!--                <div class="bg-light rounded-bottom p-4">-->
    <!--                    <div class="d-flex justify-content-between mb-4">-->
    <!--                        <a href="#" class="text-muted"><i class="fa fa-calendar-alt text-primary"></i> 28 August-->
    <!--                            2021</a>-->
    <!--                        <a href="#" class="text-muted"><span class="fa fa-comments text-primary"></span> 3-->
    <!--                            Comments</a>-->
    <!--                    </div>-->
    <!--                    <a href="#" class="h4 mb-3 d-block">Classical Dance class</a>-->
    <!--                    <p class="mb-3">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Magni vero excepturi-->
    <!--                        blanditiis quidem</p>-->
    <!--                    <a class="btn btn-primary rounded-pill text-white py-2 px-4" href="#">Read More</a>-->
    <!--                </div>-->
    <!--            </div>-->
    <!--            <div class="blog-item bg-white rounded wow fadeInUp" data-wow-delay="0.7s">-->
    <!--                <div class="blog-img rounded-top">-->
    <!--                    <img src="img/class-1.jpg" class="img-fluid rounded-top w-100" alt="Image">-->
    <!--                </div>-->
    <!--                <div class="bg-light rounded-bottom p-4">-->
    <!--                    <div class="d-flex justify-content-between mb-4">-->
    <!--                        <a href="#" class="text-muted"><i class="fa fa-calendar-alt text-primary"></i> 28 August-->
    <!--                            2021</a>-->
    <!--                        <a href="#" class="text-muted"><span class="fa fa-comments text-primary"></span> 3-->
    <!--                            Comments</a>-->
    <!--                    </div>-->
    <!--                    <a href="#" class="h4 mb-3 d-block">Classical Dance class</a>-->
    <!--                    <p class="mb-3">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Magni vero excepturi-->
    <!--                        blanditiis quidem</p>-->
    <!--                    <a class="btn btn-primary rounded-pill text-white py-2 px-4" href="#">Read More</a>-->
    <!--                </div>-->
    <!--            </div>-->
    <!--        </div>-->
    <!--    </div>-->
    <!--</div>-->
    <!-- Blogs End -->


    

    <!-- Gallery Start -->
    <div class="container-fluid gallery pb-5">
        <div class="container-fluid px-lg-5 pb-5">
            <div class="pb-5">
                <div class="row g-4 align-items-end">
                    <div class="col-xl-8">
                        <h4 class="text-secondary sub-title fw-bold wow fadeInUp" data-wow-delay="0.1s"> Gallery</h4>
                        <h1 class="display-2 mb-0 wow fadeInUp text-primary" data-wow-delay="0.3s"> Latest Photo gallery</h1>
                    </div>
                    <div class="col-xl-4 text-xl-end pb-3 wow fadeInUp" data-wow-delay="0.3s">
                        <a class="btn btn-primary rounded-pill text-white py-3 px-5" href="gallery.php">View All Images</a>
                    </div>
                </div>
            </div>
            <div class="tab-class wow fadeInUp" data-wow-delay="0.1s">
                <ul class="nav nav-pills d-inline-flex justify-content-center pb-4">
                    <li class="nav-item bg-light border border-primary rounded-pill mb-4">
                        <a class="d-flex py-2 px-5 rounded-pill active" data-bs-toggle="pill" href="#GalleryTab">
                            <span class="text-dark">All</span>
                        </a>
                    </li>
                    <?php 
                        $sql6 = "SELECT DISTINCT gc.* FROM gallery_category gc INNER JOIN gallery g ON gc.name = g.related_to WHERE g.status = 'active'";
                        $res_sql6 = mysqli_query($conn, $sql6);
                        if(mysqli_num_rows($res_sql6)>0){
                            while($row = mysqli_fetch_assoc($res_sql6)){
                         ?>
                    
                        <li class="nav-item bg-light border border-primary rounded-pill mb-4">
                            <a class="d-flex py-2 px-5 rounded-pill" data-bs-toggle="pill" href="#GalleryTab-<?php echo $row['id']; ?>">
                                <span class="text-dark"><?php echo $row['name'];?></span>
                            </a>
                        </li>
                        <?php
                                }
                            }
                        ?>
                    
                </ul>

                <div class="tab-content">
                    
                        <div id="GalleryTab" class="tab-pane fade show p-0 active">
                           
                            <div class="row g-2">
                                 <?php
                                    $sql7 = "SELECT * FROM gallery WHERE status='active'";
                                    $res_sql7 = mysqli_query($conn, $sql7);
                                    if(mysqli_num_rows($res_sql7)>0){
                                        while($row = mysqli_fetch_assoc($res_sql7)) {   
                                    ?>
                                <div class="col-sm-6 col-md-6 col-lg-4 col-xl-2 wow fadeInUp" data-wow-delay="0.1s">
                                    <div class="video h-100">
                                        <img src="admin/files/gallery/<?php echo $row['image_path']; ?>" class="img-fluid rounded w-100 h-100"
                                            style="object-fit: cover;" alt="">
                                        <button type="button" class="btn btn-play" data-bs-toggle="modal"
                                            data-src="admin/files/gallery/<?php echo $row['image_path']; ?>"
                                            data-bs-target="#videoModal">
                                            <span></span>
                                        </button>
                                    </div>
                                </div>
                                 <?php } 
                            }
                            ?>
                            </div>
                           
                        </div>
                    <?php    
                    $res_sql6 = mysqli_query($conn, $sql6);
                    if(mysqli_num_rows($res_sql6)>0){
                            while($row = mysqli_fetch_assoc($res_sql6)){
                               
                         ?>
                    <div id="GalleryTab-<?php echo $row['id']; ?>" class="tab-pane fade show p-0">
                        <div class="row g-2">
                            <?php 
                                $related_to = $row['name'];
                                $sql8 = "SELECT * FROM gallery WHERE related_to='$related_to' AND status='active'";
                                $res_sql8 = mysqli_query($conn, $sql8);
                                if(mysqli_num_rows($res_sql8)>0){
                                    while($res = mysqli_fetch_assoc($res_sql8)){
                            ?>
                                <div class="col-sm-6 col-md-6 col-lg-4 col-xl-2">
                                    <div class="video h-100">
                                        <img src="admin/files/gallery/<?php echo $res['image_path']; ?>" class="img-fluid rounded w-100 h-100"
                                            style="object-fit: cover;" alt="">
                                        <button type="button" class="btn btn-play" data-bs-toggle="modal"
                                            data-src="admin/files/gallery/<?php echo $res['image_path']; ?>"
                                            data-bs-target="#videoModal">
                                            <span></span>
                                        </button>
                                    </div>
                                </div>
                            <?php
                                    }
                                }
                            ?>
                            
                            
                        </div>
                    </div>
                    <?php } }?>
                </div>
            </div>
        </div>
    </div>

    <!-- Modal Image -->
    
    <div class="modal fade" id="videoModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content rounded">
                
                <div class="modal-body p-0">
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" style="position: absolute; top: 10px; right: 10px; z-index: 1050;"></button>
                    <!-- Display Image -->
                    <img id="modalImage" src="" alt="Preview" class="img-fluid w-100 h-100 rounded">
                </div>
            </div>
        </div>
    </div>
    <!-- Gallery End -->

    <!-- Testimonial Start -->
    <!-- <div class="container-fluid testimonial pb-5">-->
    <!--    <div class="container pb-5">-->
    <!--        <div class="pb-5">-->
    <!--            <h4 class="text-secondary sub-title fw-bold wow fadeInUp" data-wow-delay="0.1s">OUR CLIENTS RIVIEWS</h4>-->
    <!--            <h1 class="display-2 mb-0 wow fadeInUp" data-wow-delay="0.3s">What Our Clients Say</h1>-->
    <!--        </div>-->
    <!--        <div class="owl-carousel testimonial-carousel pt-5 wow fadeInUp" data-wow-delay="0.2s">-->
    <!--            <div class="testimonial-item border text-center rounded">-->
    <!--                <div class="rounded-circle position-absolute"-->
    <!--                    style="width: 100px; height: 100px; top: 25px; left: 50%; transform: translateX(-50%);">-->
    <!--                    <img class="img-fluid rounded-circle" src="img/testimonial-1.jpg" alt="img">-->
    <!--                </div>-->
    <!--                <div class="position-relative" style="margin-top: 140px;">-->
    <!--                    <h5 class="mb-0">Person Name</h5>-->
    <!--                    <p>Profession</p>-->
    <!--                    <div class="d-flex justify-content-center">-->
    <!--                        <i class="fas fa-star text-secondary"></i>-->
    <!--                        <i class="fas fa-star text-secondary"></i>-->
    <!--                        <i class="fas fa-star text-secondary"></i>-->
    <!--                        <i class="fas fa-star text-secondary"></i>-->
    <!--                        <i class="fas fa-star"></i>-->
    <!--                    </div>-->
    <!--                </div>-->
    <!--                <div class="testimonial-content p-4">-->
    <!--                    <p class="fs-5 mb-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod-->
    <!--                        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud-->
    <!--                        exercitati eiusmod tempor incididunt.-->
    <!--                    </p>-->
    <!--                </div>-->
    <!--            </div>-->
    <!--            <div class="testimonial-item border text-center rounded">-->
    <!--                <div class="rounded-circle position-absolute"-->
    <!--                    style="width: 100px; height: 100px; top: 25px; left: 50%; transform: translateX(-50%);">-->
    <!--                    <img class="img-fluid rounded-circle" src="img/testimonial-2.jpg" alt="img">-->
    <!--                </div>-->
    <!--                <div class="position-relative" style="margin-top: 140px;">-->
    <!--                    <h5 class="mb-0">Person Name</h5>-->
    <!--                    <p>Profession</p>-->
    <!--                    <div class="d-flex justify-content-center">-->
    <!--                        <i class="fas fa-star text-secondary"></i>-->
    <!--                        <i class="fas fa-star text-secondary"></i>-->
    <!--                        <i class="fas fa-star text-secondary"></i>-->
    <!--                        <i class="fas fa-star text-secondary"></i>-->
    <!--                        <i class="fas fa-star"></i>-->
    <!--                    </div>-->
    <!--                </div>-->
    <!--                <div class="testimonial-content p-4">-->
    <!--                    <p class="fs-5 mb-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod-->
    <!--                        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud-->
    <!--                        exercitati eiusmod tempor incididunt.-->
    <!--                    </p>-->
    <!--                </div>-->
    <!--            </div>-->
    <!--            <div class="testimonial-item border text-center rounded">-->
    <!--                <div class="rounded-circle position-absolute"-->
    <!--                    style="width: 100px; height: 100px; top: 25px; left: 50%; transform: translateX(-50%);">-->
    <!--                    <img class="img-fluid rounded-circle" src="img/testimonial-3.jpg" alt="img">-->
    <!--                </div>-->
    <!--                <div class="position-relative" style="margin-top: 140px;">-->
    <!--                    <h5 class="mb-0">Person Name</h5>-->
    <!--                    <p>Profession</p>-->
    <!--                    <div class="d-flex justify-content-center">-->
    <!--                        <i class="fas fa-star text-secondary"></i>-->
    <!--                        <i class="fas fa-star text-secondary"></i>-->
    <!--                        <i class="fas fa-star text-secondary"></i>-->
    <!--                        <i class="fas fa-star text-secondary"></i>-->
    <!--                        <i class="fas fa-star"></i>-->
    <!--                    </div>-->
    <!--                </div>-->
    <!--                <div class="testimonial-content p-4">-->
    <!--                    <p class="fs-5 mb-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod-->
    <!--                        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud-->
    <!--                        exercitati eiusmod tempor incididunt.-->
    <!--                    </p>-->
    <!--                </div>-->
    <!--            </div>-->
    <!--            <div class="testimonial-item border text-center rounded">-->
    <!--                <div class="rounded-circle position-absolute"-->
    <!--                    style="width: 100px; height: 100px; top: 25px; left: 50%; transform: translateX(-50%);">-->
    <!--                    <img class="img-fluid rounded-circle" src="img/testimonial-3.jpg" alt="img">-->
    <!--                </div>-->
    <!--                <div class="position-relative" style="margin-top: 140px;">-->
    <!--                    <h5 class="mb-0">Person Name</h5>-->
    <!--                    <p>Profession</p>-->
    <!--                    <div class="d-flex justify-content-center">-->
    <!--                        <i class="fas fa-star text-secondary"></i>-->
    <!--                        <i class="fas fa-star text-secondary"></i>-->
    <!--                        <i class="fas fa-star text-secondary"></i>-->
    <!--                        <i class="fas fa-star text-secondary"></i>-->
    <!--                        <i class="fas fa-star"></i>-->
    <!--                    </div>-->
    <!--                </div>-->
    <!--                <div class="testimonial-content p-4">-->
    <!--                    <p class="fs-5 mb-0">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod-->
    <!--                        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud-->
    <!--                        exercitati eiusmod tempor incididunt.-->
    <!--                    </p>-->
    <!--                </div>-->
    <!--            </div>-->
    <!--        </div>-->
    <!--    </div>-->
    <!--</div> -->
    <!-- Testimonial End -->
    
<script>
         document.addEventListener("DOMContentLoaded", function () {
        document.querySelectorAll(".readMore").forEach(button => {
            button.addEventListener("click", function () {
                let parentItem = this.closest(".testimonial-item"); // Get the parent testimonial item
                let shortDesc = parentItem.querySelector(".shortDesc");
                let fullDesc = parentItem.querySelector(".fullDesc");

                if (fullDesc.style.display === "none") {
                    shortDesc.style.display = "none";
                    fullDesc.style.display = "inline";
                    parentItem.classList.add("expanded"); // Expand the item
                    this.innerHTML = "Read Less";
                } else {
                    shortDesc.style.display = "inline";
                    fullDesc.style.display = "none";
                    parentItem.classList.remove("expanded"); // Collapse back
                    this.innerHTML = "Read More";
                }
            });
        });
    });
</script>
    <?php include('footer.php') ?>
</body>

</html>