<?php
session_start();
require_once 'db_config.php';
require_once 'blog_helpers.php';

// Pagination
$page = $_GET['page'] ?? 1;
$limit = 9;
$offset = ($page - 1) * $limit;

// Get filters
$filters = [
    'limit' => $limit,
    'offset' => $offset
];

// Get total count
$totalBlogs = getBlogCount($conn, $filters);
$totalPages = ceil($totalBlogs / $limit);

// Get blogs
$blogs = getBlogs($conn, $filters);

// Get sidebar data
$blogCategories = getBlogCategories($conn);
$recentPosts = getBlogs($conn, ['limit' => 3]);
$recentComments = getRecentComments($conn, 4);
$allTags = getBlogAllTags($conn);
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Blog - Our Latest Articles</title>
    <meta name="description" content="Read our latest blog articles on technology, business, lifestyle, and more.">
    <link rel="stylesheet" href="styles.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
</head>
<body>
    <?php require_once 'header.php'; ?>
    <main>
    <div class="blog-page-wrapper" style="background:#fff; padding:60px 0;">
        <div class="container" style="max-width:1320px; margin:0 auto; padding:0 20px;">
            <!-- Breadcrumb -->
            <div class="blog-breadcrumb" style="margin:0 0 30px 0;">
                <a href="index.php" style="color:#999; text-decoration:none; font-size:14px;">Home</a>
                <span style="color:#ddd; margin:0 10px; font-size:14px;">•</span>
                <span style="color:#666; font-size:14px; font-weight:500;">Blog</span>
            </div>
            
            <!-- Page Header -->
            <div class="blog-page-header" style="text-align:center; margin-bottom:60px;">
                <h1 style="font-size:56px; font-weight:700; color:#000; margin:0; line-height:1.1;">Blog</h1>
            </div>
            
            <div style="display:grid; grid-template-columns: 1fr 340px; gap:60px; align-items:start;">
                <div>
                    <?php if (!empty($blogs)): ?>
                        <!-- Blogs List -->
                        <div class="blogs-list">
                            <?php foreach ($blogs as $blog): 
                                $imageOrientation = $blog['image_orientation'] ?? 'landscape';
                                $imageSize = $blog['image_size'] ?? 'medium';
                                $imageClass = 'blog-post-image blog-image-' . $imageOrientation . ' blog-image-' . $imageSize;
                            ?>
                                <article class="blog-post-item">
                                    <?php if ($blog['featured_image']): ?>
                                        <a href="blog.php?slug=<?php echo htmlspecialchars($blog['slug']); ?>" class="blog-post-image-link">
                                            <img src="uploads/blog/<?php echo htmlspecialchars($blog['featured_image']); ?>" alt="<?php echo htmlspecialchars($blog['title']); ?>" class="<?php echo $imageClass; ?>">
                                        </a>
                                    <?php endif; ?>
                                    <div class="blog-post-content">
                                        <?php if ($blog['category_name']): ?>
                                            <a href="blog_category.php?slug=<?php echo htmlspecialchars($blog['category_slug'] ?? ''); ?>" class="blog-post-category">
                                                <?php echo htmlspecialchars($blog['category_name']); ?>
                                            </a>
                                        <?php endif; ?>
                                        <h3 class="blog-post-title">
                                            <a href="blog.php?slug=<?php echo htmlspecialchars($blog['slug']); ?>">
                                                <?php echo htmlspecialchars($blog['title']); ?>
                                            </a>
                                        </h3>
                                        <div class="blog-post-meta">
                                            <span>By <a href="#"><?php echo htmlspecialchars($blog['author_name'] ?? 'Admin'); ?></a></span>
                                            <span><?php 
                                                $dateStr = $blog['publish_date'] ?? $blog['created_at'] ?? null;
                                                if ($dateStr && strtotime($dateStr) > 0) {
                                                    echo date('M d, Y', strtotime($dateStr));
                                                } else {
                                                    echo date('M d, Y');
                                                }
                                            ?></span>
                                            <span><i class="fa-regular fa-comment"></i> <?php echo $blog['comments_count'] ?? 0; ?> Comments</span>
                                        </div>
                                        <p class="blog-post-excerpt">
                                            <?php echo htmlspecialchars(substr($blog['excerpt'] ?? $blog['content'], 0, 200)); ?>...
                                        </p>
                                        <a href="blog.php?slug=<?php echo htmlspecialchars($blog['slug']); ?>" class="read-more-link">Read more</a>
                                    </div>
                                </article>
                            <?php endforeach; ?>
                        </div>           
                        
                        <!-- Pagination -->
                        <?php if ($totalPages > 1): ?>
                            <nav class="blog-pagination" style="display:flex; justify-content:center; gap:8px; margin-top:60px; flex-wrap:wrap;">
                                <?php for ($i = 1; $i <= $totalPages; $i++): ?>
                                    <?php if ($i === (int)$page): ?>
                                        <span class="pagination-current" style="padding:10px 14px; background:#0066cc; color:#fff; border-radius:4px; font-weight:600;">
                                            <?php echo $i; ?>
                                        </span>
                                    <?php else: ?>
                                        <a href="?page=<?php echo $i; ?>" class="pagination-link" style="padding:10px 14px; background:#f5f5f5; color:#333; border-radius:4px; text-decoration:none; font-weight:500; transition:all 0.3s;">
                                            <?php echo $i; ?>
                                        </a>
                                    <?php endif; ?>
                                <?php endfor; ?>
                                <?php if ($page < $totalPages): ?>
                                    <a href="?page=<?php echo $page + 1; ?>" class="pagination-next" style="padding:10px 14px; background:#f5f5f5; color:#333; border-radius:4px; text-decoration:none; font-weight:500; transition:all 0.3s;">
                                        Next page
                                    </a>
                                <?php endif; ?>
                            </nav>
                        <?php endif; ?>
                    <?php else: ?>
                        <div class="empty-state">
                            <h3>No Blog Posts Yet</h3>
                            <p>Check back soon for our latest articles.</p>
                        </div>
                    <?php endif; ?>
                </div>
                
                <!-- Sidebar -->
                <aside class="blog-sidebar">
                    <!-- Search Widget -->
                    <div class="sidebar-widget search-widget">
                        <h3>Search</h3>
                        <form action="blogs.php" method="get" class="search-form">
                            <input type="text" name="search" placeholder="Search for products...">
                            <button type="submit"><i class="fa-solid fa-magnifying-glass"></i></button>
                        </form>
                    </div>

                    <!-- Categories Widget -->
                    <div class="sidebar-widget categories-widget">
                        <h3>Categories</h3>
                        <ul>
                            <?php foreach ($blogCategories as $category): ?>
                                <li>
                                    <a href="blog_category.php?slug=<?php echo htmlspecialchars($category['slug']); ?>">
                                        <?php echo htmlspecialchars($category['name']); ?>
                                    </a>
                                    <span style="color:#999; font-size:14px;">(<?php echo isset($category['count']) ? $category['count'] : 0; ?>)</span>
                                </li>
                            <?php endforeach; ?>
                        </ul>
                    </div>

                    <!-- Recent Posts Widget -->
                    <div class="sidebar-widget recent-posts-widget">
                        <h3>Recent Posts</h3>
                        <ul>
                            <?php foreach ($recentPosts as $post): ?>
                                <li>
                                    <a href="blog.php?slug=<?php echo htmlspecialchars($post['slug']); ?>">
                                        <?php if ($post['featured_image']): ?>
                                            <img src="uploads/blog/<?php echo htmlspecialchars($post['featured_image']); ?>" alt="<?php echo htmlspecialchars($post['title']); ?>">
                                        <?php endif; ?>
                                        <div class="post-info">
                                            <h4><?php echo htmlspecialchars(substr($post['title'], 0, 50)); ?></h4>
                                            <span><?php 
                                                $dateStr = $post['publish_date'] ?? $post['created_at'] ?? null;
                                                if ($dateStr && strtotime($dateStr) > 0) {
                                                    echo date('M d, Y', strtotime($dateStr));
                                                } else {
                                                    echo date('M d, Y');
                                                }
                                            ?></span>
                                        </div>
                                    </a>
                                </li>
                            <?php endforeach; ?>
                        </ul>
                    </div>

                    <!-- Tags Widget -->
                    <div class="sidebar-widget tags-widget">
                        <h3>Tags</h3>
                        <div class="tags-cloud">
                            <?php foreach ($allTags as $tag): ?>
                                <a href="blog_tag.php?slug=<?php echo htmlspecialchars($tag['slug']); ?>" class="tag-cloud-item">
                                    <?php echo htmlspecialchars($tag['name']); ?>
                                </a>
                            <?php endforeach; ?>
                        </div>
                    </div>
                </aside>
            </div>
        </div>
    </div>
</main>
    <?php require_once 'footer.php'; ?>

</body>
</html>
<!-- dffdfg -->
