index.php

<?php include 'header.php'; ?>

<!-- bagian banner -->
<?php
    $banner = mysqli_query($conn, "SELECT * FROM banner ORDER BY id DESC");
?>
<div class="banner-carousel">
    <?php while($b = mysqli_fetch_array($banner)){ ?>
        <div class="banner-slide" style="background-image: url('uploads/banner/<?= $b['gambar'] ?>');">
            <div class="banner-text">
                <div class="container">
                    <h3>Selamat Datang di <?= $d->nama ?></h3>
                    <p>Sekolah Menengah Atas dengan berbagai minat jurusan yang dapat anda pilih.</p>
                </div>
            </div>
        </div>
    <?php } ?>
    <button class="banner-prev">&#10094;</button>
    <button class="banner-next">&#10095;</button>
</div>
<div class="banner-dots">
    <?php
        $i = 0;
        $banner->data_seek(0);
        while($b = mysqli_fetch_array($banner)){ 
    ?>
        <span class="dot" onclick="currentSlide(<?= $i ?>)"></span>
    <?php $i++; } ?>
</div>

<!-- bagian sambutan -->
<div class="section">
    <div class="container sambutan-wrap">
        <div class="sambutan-foto">
            <img src="uploads/identitas/<?= $d->foto_kepsek ?>" alt="Foto Kepala Sekolah">
        </div>
        <div class="sambutan-teks">
            <h3 class="judul-sambutan">Sambutan Kepala Sekolah</h3>
            <h4><?= $d->nama_kepsek ?></h4>
            <p><?= $d->sambutan_kepsek ?></p>
            <a href="sambutan-detail.php" class="btn-selengkapnya-kepsek">Selengkapnya</a>
        </div>
    </div>

    <!-- Statistik DGK -->
    <div class="statistik-dgk">
        <div class="stat-item-dgk">
            <h2><span class="counter" data-target="568">0</span> +</h2>
            <p>Peserta Didik</p>
        </div>
        <div class="stat-item-dgk">
            <h2><span class="counter" data-target="27">0</span> +</h2>
            <p>Guru</p>
        </div>
        <div class="stat-item-dgk">
            <h2><span class="counter" data-target="15">0</span> +</h2>
            <p>Kelas</p>
        </div>
    </div>
</div>

<!-- Tambahkan ini sebelum </body> atau di footer.php -->
<script>
document.addEventListener("DOMContentLoaded", () => {
    const counters = document.querySelectorAll('.counter');
    counters.forEach(counter => {
        counter.innerText = '0';
        const updateCount = () => {
            const target = +counter.getAttribute('data-target');
            const count = +counter.innerText;
            const increment = target / 100;

            if (count < target) {
                counter.innerText = Math.ceil(count + increment);
                setTimeout(updateCount, 20);
            } else {
                counter.innerText = target;
            }
        };
        updateCount();
    });
});
</script>

    </div>
</div>

    <!-- bagian ajakan pendaftaran -->
    <div class="section section-daftar" id="daftar">
        <div class="container text-center">
            <h2 class="judul-sekolah">SMA MUHAMMADIYAH 15 JAKARTA</h2>
            <h1 class="judul-daftar">Pendaftaran Peserta Didik Baru</h1>
            <p class="deskripsi-daftar">
                Mari bergabung menjadi bagian dari keluarga besar <strong>SMA Muhammadiyah 15 Jakarta</strong> —
                sekolah unggulan yang membina siswa secara <strong>spiritual, intelektual, emosional, dan sosial</strong>.
                Temukan jurusan impianmu dan raih masa depan gemilang bersama kami!
            </p>
            <a href="detail-pembayaran.php" class="btn-daftar-highlight">Daftar Sekarang</a>
        </div>
    </div>


    <!-- bagian seragam -->
    <div class="section">
        <div class="container text-center">
            <h3 class="seragam-title">Seragam Harian Siswa</h3>
            <div class="seragam-grid">
                <?php
                $seragam = [
                    ['hari' => '', 'gambar' => 'seragam1.jpg'],
                    ['hari' => '', 'gambar' => 'seragam2.jpg'],
                    ['hari' => '', 'gambar' => 'seragam3.jpg'],
                ];

                foreach ($seragam as $s) {
                    echo '
                    <div class="seragam-item">
                        <a href="uploads/seragam/' . $s['gambar'] . '" target="_blank">
                            <img src="uploads/seragam/' . $s['gambar'] . '" alt="Seragam ' . $s['hari'] . '" class="seragam-img">
                        </a>
                        <div class="seragam-hari">' . $s['hari'] . '</div>
                    </div>';
                }
                ?>
            </div>
        </div>
    </div>

<div class="section">
    <div class="container text-center">
        <h3 class="informasi-title">Berita</h3>
        <?php
            // Ambil 4 berita paling baru
            $informasi = mysqli_query($conn, "SELECT * FROM informasi ORDER BY id DESC LIMIT 4");

            if (mysqli_num_rows($informasi) > 0) {
                while ($p = mysqli_fetch_array($informasi)) {
        ?>
            <div class="col-2">
                <a href="berita.php?id=<?= $p['id'] ?>" class="thumbnail-link">
                    <div class="thumbnail-box">
                        <div class="thumbnail-img"
                             style="background-image: url('uploads/informasi/<?= $p['gambar'] ?>');">
                        </div>
                        <div class="thumbnail-text">
                            <?= substr($p['judul'], 0, 50) ?>
                        </div>
                    </div>
                </a>
            </div>
        <?php
                }
            } else {
                echo 'Tidak Ada Data';
            }
        ?>
    </div>
</div>


<?php include 'footer.php'; ?>