<?php
$currentPage = 'index';
require __DIR__ . '/_includes/db_connect.php';

$site = getSiteSettings();
$page = getPageContent('index');

// Fetch news items
$newsResult = mysqli_query($conn, "SELECT * FROM tbl_news_items WHERE is_active = 1 ORDER BY sort_order ASC, published_date DESC LIMIT 3");
$newsItems = [];
while ($row = mysqli_fetch_assoc($newsResult)) { $newsItems[] = $row; }

// Fetch featured gallery images (for homepage preview)
$galleryResult = mysqli_query($conn, "SELECT * FROM tbl_gallery_images WHERE is_active = 1 AND is_featured = 1 ORDER BY sort_order ASC LIMIT 4");
$galleryImages = [];
while ($row = mysqli_fetch_assoc($galleryResult)) { $galleryImages[] = $row; }

$pageTitle = $page['page_title'] ?? ($site['school_name'] ?? 'Home');
$metaDescription = $page['meta_description'] ?? '';
require __DIR__ . '/_includes/header.php';
?>

  <!-- Hero Section -->
  <section class="hero"<?php if (!empty($page['hero_image_url'])): ?> style="background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url('<?= e($page['hero_image_url']) ?>'); background-size: cover; background-position: center;"<?php endif; ?>>
    <div class="container">
      <div class="hero__content">
        <h1><?= e($page['hero_heading'] ?? 'Welcome') ?></h1>
        <p><?= e($page['hero_text'] ?? '') ?></p>
        <?= renderVideo($page['hero_video_url'] ?? null, 'hero-video') ?>
      </div>
    </div>
  </section>

  <!-- Welcome Section -->
  <?php if (!empty($page['section1_heading']) || !empty($page['section1_content'])): ?>
  <section class="section">
    <div class="container">
      <div class="two-col">
        <div>
          <?php if (!empty($page['section1_heading'])): ?>
          <h2 class="section-title" style="text-align:left; padding-bottom:0;"><?= e($page['section1_heading']) ?></h2>
          <?php endif; ?>
          <?= raw($page['section1_content'] ?? '') ?>
          <a href="about.php" class="btn">Read More</a>
        </div>
        <div class="placeholder-img placeholder-img--hero">
          <?php if (!empty($page['section1_video_url'])): ?>
          <?= renderVideo($page['section1_video_url']) ?>
          <?php elseif (!empty($page['section1_image_url'])): ?>
          <img src="<?= e($page['section1_image_url']) ?>" alt="<?= e($page['section1_image_alt'] ?? '') ?>" style="width:100%;height:100%;object-fit:cover;">
          <?php else: ?>
          [<?= e($page['section1_image_alt'] ?? 'School Building Image') ?>]
          <?php endif; ?>
        </div>
      </div>
    </div>
  </section>
  <?php endif; ?>

  <!-- About Section -->
  <?php if (!empty($page['section2_heading']) || !empty($page['section2_content'])): ?>
  <section class="section section--alt">
    <div class="container">
      <h2 class="section-title"><?= e($page['section2_heading'] ?? '') ?></h2>
      <div class="two-col">
        <div class="placeholder-img placeholder-img--hero">
          <?php if (!empty($page['section2_video_url'])): ?>
          <?= renderVideo($page['section2_video_url']) ?>
          <?php elseif (!empty($page['section2_image_url'])): ?>
          <img src="<?= e($page['section2_image_url']) ?>" alt="<?= e($page['section2_image_alt'] ?? '') ?>" style="width:100%;height:100%;object-fit:cover;">
          <?php else: ?>
          [<?= e($page['section2_image_alt'] ?? 'Campus Image') ?>]
          <?php endif; ?>
        </div>
        <div>
          <?= raw($page['section2_content'] ?? '') ?>
        </div>
      </div>
    </div>
  </section>
  <?php endif; ?>

  <!-- News / Blog Section -->
  <?php if (!empty($page['section3_heading']) || !empty($newsItems)): ?>
  <section class="section">
    <div class="container">
      <h2 class="section-title"><?= e($page['section3_heading'] ?? 'Latest News') ?></h2>
      <?php if (!empty($newsItems)): ?>
      <div class="card-grid">
        <?php foreach ($newsItems as $news): ?>
        <div class="card">
          <div class="placeholder-img placeholder-img--small">
            <?php if (!empty($news['image_url'])): ?>
            <img src="<?= e($news['image_url']) ?>" alt="<?= e($news['image_alt'] ?? '') ?>" style="width:100%;height:100%;object-fit:cover;">
            <?php else: ?>
            [<?= e($news['image_alt'] ?? 'News Image') ?>]
            <?php endif; ?>
          </div>
          <div class="card__body">
            <span class="card__date"><?= !empty($news['published_date']) ? date('F j, Y', strtotime($news['published_date'])) : '' ?></span>
            <h3 class="card__title"><?= e($news['title'] ?? '') ?></h3>
            <p class="card__text"><?= e($news['content'] ?? '') ?></p>
          </div>
        </div>
        <?php endforeach; ?>
      </div>
      <?php endif; ?>
    </div>
  </section>
  <?php endif; ?>

  <!-- Principal's Message Section -->
  <?php if (!empty($page['section4_heading']) || !empty($page['section4_content'])): ?>
  <section class="section section--alt">
    <div class="container">
      <h2 class="section-title"><?= e($page['section4_heading'] ?? '') ?></h2>
      <div class="two-col">
        <div>
          <?= raw($page['section4_content'] ?? '') ?>
          <?php if (!empty($site['principal_name'])): ?>
          <p><strong><?= e($site['principal_name']) ?>, <?= e($site['principal_title'] ?? '') ?></strong></p>
          <?php endif; ?>
          <a href="principals-message.php" class="btn btn--secondary">Read Full Message</a>
        </div>
        <div class="placeholder-img placeholder-img--hero">
          <?php if (!empty($page['section4_video_url'])): ?>
          <?= renderVideo($page['section4_video_url']) ?>
          <?php elseif (!empty($page['section4_image_url'])): ?>
          <img src="<?= e($page['section4_image_url']) ?>" alt="<?= e($page['section4_image_alt'] ?? '') ?>" style="width:100%;height:100%;object-fit:cover;">
          <?php else: ?>
          [<?= e($page['section4_image_alt'] ?? "Principal's Photo") ?>]
          <?php endif; ?>
        </div>
      </div>
    </div>
  </section>
  <?php endif; ?>

  <!-- School Intro Video (from site settings) -->
  <?php if (!empty($site['intro_video_url'])): ?>
  <section class="section">
    <div class="container">
      <h2 class="section-title">Watch Our School</h2>
      <div style="max-width: 800px; margin: 0 auto;">
        <?= renderVideo($site['intro_video_url']) ?>
      </div>
    </div>
  </section>
  <?php endif; ?>

  <!-- Gallery Preview -->
  <?php if (!empty($page['section5_heading'])): ?>
  <section class="section<?= empty($site['intro_video_url']) ? '' : ' section--alt' ?>">
    <div class="container">
      <h2 class="section-title"><?= e($page['section5_heading'] ?? 'School Gallery') ?></h2>
      <?= raw($page['section5_content'] ?? '') ?>
      <?php if (!empty($page['section5_video_url'])): ?>
      <div style="max-width: 700px; margin: 1rem auto;">
        <?= renderVideo($page['section5_video_url']) ?>
      </div>
      <?php endif; ?>
      <?php if (!empty($galleryImages)): ?>
      <div class="gallery-grid" style="margin-top: 2rem;">
        <?php foreach ($galleryImages as $img): ?>
        <div class="placeholder-img placeholder-img--gallery">
          <?php if (!empty($img['image_url']) && $img['image_url'] !== 'images/gallery/placeholder.jpg'): ?>
          <img src="<?= e($img['image_url']) ?>" alt="<?= e($img['alt_text'] ?? '') ?>" style="width:100%;height:100%;object-fit:cover;">
          <?php else: ?>
          [<?= e($img['alt_text'] ?? 'Gallery Image') ?>]
          <?php endif; ?>
        </div>
        <?php endforeach; ?>
      </div>
      <?php endif; ?>
      <div class="text-center" style="margin-top: 2rem;">
        <a href="galleries.php" class="btn">View All Galleries</a>
      </div>
    </div>
  </section>
  <?php endif; ?>

  <!-- Contact Section -->
  <?php if (!empty($page['section6_heading'])): ?>
  <section class="section section--alt">
    <div class="container">
      <h2 class="section-title"><?= e($page['section6_heading'] ?? 'Get In Touch') ?></h2>
      <div class="two-col">
        <div>
          <form>
            <div class="form-group">
              <label for="name">Your Name</label>
              <input type="text" id="name" name="name" placeholder="Enter your name">
            </div>
            <div class="form-group">
              <label for="email">Email Address</label>
              <input type="email" id="email" name="email" placeholder="Enter your email">
            </div>
            <div class="form-group">
              <label for="subject">Subject</label>
              <input type="text" id="subject" name="subject" placeholder="Enter subject">
            </div>
            <div class="form-group">
              <label for="message">Message</label>
              <textarea id="message" name="message" placeholder="Enter your message"></textarea>
            </div>
            <button type="submit" class="btn">Send Message</button>
          </form>
        </div>
        <div>
          <div class="info-box">
            <h3>Contact Information</h3>
            <?php if (!empty($site['address'])): ?>
            <p><strong>Address:</strong> <?= e($site['address']) ?></p>
            <?php endif; ?>
            <?php if (!empty($site['phone'])): ?>
            <p><strong>Phone:</strong> <?= e($site['phone']) ?></p>
            <?php endif; ?>
            <?php if (!empty($site['email'])): ?>
            <p><strong>Email:</strong> <?= e($site['email']) ?></p>
            <?php endif; ?>
          </div>
        </div>
      </div>
    </div>
  </section>
  <?php endif; ?>

<?php require __DIR__ . '/_includes/footer.php'; ?>
