<?php
/**
 * BERITA DETAIL PAGE
 * Yayasan Andalusia
 */

require_once __DIR__ . '/../config/database.php';
require_once __DIR__ . '/../config/config.php';

$slug = $_GET['slug'] ?? null;

if (!$slug) {
    header('Location: berita.php');
    exit;
}

try {
    $news = db_fetch($pdo, "SELECT * FROM berita WHERE slug = ? AND is_published = 1", [$slug]);
    
    if (!$news) {
        header('Location: berita.php');
        exit;
    }
    
    // Increment views
    db_execute($pdo, "UPDATE berita SET views = views + 1 WHERE id = ?", [$news['id']]);
    
    // Get related news
    $related = db_fetch_all($pdo, "SELECT * FROM berita WHERE id != ? AND is_published = 1 AND (category = ? OR category IS NULL) ORDER BY RAND() LIMIT 3", [$news['id'], $news['category']]);
    
    $site_settings = db_fetch_all($pdo, "SELECT setting_key, setting_value FROM site_settings");
    $settings = [];
    foreach ($site_settings as $setting) {
        $settings[$setting['setting_key']] = $setting['setting_value'];
    }
} catch (PDOException $e) {
    error_log('Berita Detail Error: ' . $e->getMessage());
    header('Location: berita.php');
    exit;
}

$site_name = $settings['site_name'] ?? 'Yayasan Andalusia';
$page_title = sanitize($news['title']) . ' - ' . $site_name;
?>
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php echo $page_title; ?></title>
    <meta name="description" content="<?php echo sanitize($news['excerpt']); ?>">
    
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="<?php echo BASE_URL; ?>/assets/css/style.css">
</head>
<body>

<?php include __DIR__ . '/../includes/navbar.php'; ?>

<!-- Article Section -->
<section class="article-section py-5">
    <div class="container">
        <div class="row">
            <div class="col-lg-8 mx-auto">
                <!-- Breadcrumb -->
                <nav aria-label="breadcrumb" class="mb-4">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="<?php echo BASE_URL; ?>">Home</a></li>
                        <li class="breadcrumb-item"><a href="berita.php">Berita</a></li>
                        <li class="breadcrumb-item active"><?php echo truncate(sanitize($news['title']), 50); ?></li>
                    </ol>
                </nav>
                
                <!-- Article Header -->
                <div class="article-header mb-4">
                    <?php if ($news['category']): ?>
                        <span class="badge bg-primary mb-3"><?php echo sanitize($news['category']); ?></span>
                    <?php endif; ?>
                    
                    <h1 class="article-title mb-3"><?php echo sanitize($news['title']); ?></h1>
                    
                    <div class="article-meta d-flex flex-wrap gap-3 text-muted mb-4">
                        <span><i class="far fa-calendar me-2"></i><?php echo format_date($news['published_at'], 'd F Y'); ?></span>
                        <span><i class="far fa-eye me-2"></i><?php echo $news['views']; ?> views</span>
                        <?php if ($news['author_id']): 
                            $author = db_fetch($pdo, "SELECT full_name FROM users WHERE id = ?", [$news['author_id']]);
                            if ($author):
                        ?>
                            <span><i class="far fa-user me-2"></i><?php echo sanitize($author['full_name']); ?></span>
                        <?php endif; endif; ?>
                    </div>
                </div>
                
                <!-- Featured Image -->
                <?php if ($news['image'] && file_exists(BERITA_UPLOAD_DIR . $news['image'])): ?>
                    <div class="article-image mb-4">
                        <img src="<?php echo BERITA_UPLOAD_URL . sanitize($news['image']); ?>" 
                             alt="<?php echo sanitize($news['title']); ?>" 
                             class="img-fluid rounded shadow-sm w-100">
                    </div>
                <?php endif; ?>
                
                <!-- Article Content -->
                <div class="article-content mb-5">
                    <div class="content-body" style="line-height: 1.8; font-size: 1.05rem;">
                        <?php echo nl2br(sanitize($news['content'])); ?>
                    </div>
                </div>
                
                <!-- Share Buttons -->
                <div class="article-share border-top border-bottom py-4 mb-5">
                    <div class="d-flex justify-content-between align-items-center">
                        <h6 class="mb-0">Bagikan artikel ini:</h6>
                        <div class="d-flex gap-2">
                            <button onclick="shareOnSocialMedia('facebook', window.location.href, '<?php echo sanitize($news['title']); ?>')" 
                                    class="btn btn-sm btn-outline-primary">
                                <i class="fab fa-facebook me-1"></i> Facebook
                            </button>
                            <button onclick="shareOnSocialMedia('twitter', window.location.href, '<?php echo sanitize($news['title']); ?>')" 
                                    class="btn btn-sm btn-outline-info">
                                <i class="fab fa-twitter me-1"></i> Twitter
                            </button>
                            <button onclick="shareOnSocialMedia('whatsapp', window.location.href, '<?php echo sanitize($news['title']); ?>')" 
                                    class="btn btn-sm btn-outline-success">
                                <i class="fab fa-whatsapp me-1"></i> WhatsApp
                            </button>
                        </div>
                    </div>
                </div>
                
                <!-- Related News -->
                <?php if (!empty($related)): ?>
                    <div class="related-news">
                        <h4 class="mb-4">Berita Terkait</h4>
                        <div class="row g-4">
                            <?php foreach ($related as $item): ?>
                                <div class="col-md-4">
                                    <div class="card h-100 border-0 shadow-sm">
                                        <img src="<?php echo file_exists(BERITA_UPLOAD_DIR . $item['image']) ? BERITA_UPLOAD_URL . $item['image'] : BASE_URL . '/assets/images/default-news.jpg'; ?>" 
                                             class="card-img-top" alt="<?php echo sanitize($item['title']); ?>" style="height: 150px; object-fit: cover;">
                                        <div class="card-body">
                                            <h6 class="card-title">
                                                <a href="berita-detail.php?slug=<?php echo sanitize($item['slug']); ?>" class="text-decoration-none text-dark">
                                                    <?php echo truncate(sanitize($item['title']), 60); ?>
                                                </a>
                                            </h6>
                                            <small class="text-muted">
                                                <i class="far fa-calendar me-1"></i>
                                                <?php echo format_date($item['published_at'], 'd M Y'); ?>
                                            </small>
                                        </div>
                                    </div>
                                </div>
                            <?php endforeach; ?>
                        </div>
                    </div>
                <?php endif; ?>
            </div>
        </div>
    </div>
</section>

<?php include __DIR__ . '/../includes/footer.php'; ?>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script src="<?php echo BASE_URL; ?>/assets/js/main.js"></script>

</body>
</html>