<?php

require_once __DIR__ . '/app/helpers.php';
require_once __DIR__ . '/app/marketing.php';
require_once __DIR__ . '/app/analytics.php';
require_once __DIR__ . '/app/public-layout.php';

$page = max(1, (int) ($_GET['page'] ?? 1));
$blog_title = trim(sparrow_public_setting('blog_page_title', 'Product Stories'));
$blog_intro = trim(sparrow_public_setting('blog_page_intro'));
$per_page = max(1, min(50, (int) sparrow_public_setting('blog_posts_per_page', '4')));

$total_posts = sparrow_count_public_blog_posts();
$total_pages = max(1, (int) ceil($total_posts / $per_page));
$page = min($page, $total_pages);
$offset = ($page - 1) * $per_page;

$posts = sparrow_get_public_blog_posts($per_page, $offset);

sparrow_record_analytics_event('page_view', 'page', null, 'Product Stories', '', '/blog.php');

foreach ($posts as $tracked_post) {
    sparrow_record_analytics_event(
        'blog_post_view',
        'marketing_post',
        (int) $tracked_post['id'],
        $tracked_post['title'] ?? '',
        'Product Stories',
        '/blog.php'
    );
}

$blog_css = <<<'CSS'
.blog-list {
    display: grid;
    gap: 18px;
}

.blog-card {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 18px;
    background: var(--sparrow-card);
    border: 1px solid var(--sparrow-border);
    border-radius: 22px;
    padding: 16px;
    box-shadow: 0 8px 30px rgba(70, 35, 60, 0.06);
}

.blog-card-image {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 18px;
    border: 1px solid var(--sparrow-border);
    background: #ffffff;
}

.blog-card-placeholder {
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 18px;
    border: 1px dashed var(--sparrow-border);
    background: var(--sparrow-soft-pink);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--sparrow-muted);
    text-align: center;
    padding: 12px;
    font-size: 13px;
}

.blog-card-date {
    margin: 0 0 6px;
    color: var(--sparrow-muted);
    font-size: 13px;
    font-weight: bold;
}

.blog-card h2 {
    margin: 0 0 10px;
    color: var(--sparrow-purple-dark);
    font-size: 22px;
    line-height: 1.2;
}

.blog-card-section {
    margin: 0 0 12px;
    color: var(--sparrow-muted);
    line-height: 1.55;
    white-space: pre-wrap;
}

.blog-card-section strong {
    color: var(--sparrow-purple-dark);
}

.blog-empty {
    background: var(--sparrow-card);
    border: 1px solid var(--sparrow-border);
    border-radius: 18px;
    padding: 24px;
    text-align: center;
    color: var(--sparrow-muted);
}

.blog-pagination {
    display: flex;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 24px;
}

.blog-page-link {
    display: inline-block;
    padding: 8px 12px;
    border-radius: 999px;
    border: 1px solid var(--sparrow-border);
    background: #ffffff;
    color: var(--sparrow-purple-dark);
    text-decoration: none;
    font-weight: bold;
    font-size: 13px;
}

.blog-page-link.is-active,
.blog-page-link:hover {
    background: var(--sparrow-soft-pink);
}

@media (max-width: 700px) {
    .blog-card {
        grid-template-columns: 1fr;
    }

    .blog-card-image,
    .blog-card-placeholder {
        max-width: 280px;
    }
}
CSS;

sparrow_public_header($blog_title !== '' ? $blog_title : 'Product Stories', 'blog', $blog_css);

?>

<section class="public-card public-hero">
    <h1><?php echo sparrow_escape($blog_title !== '' ? $blog_title : 'Product Stories'); ?></h1>
    <?php if ($blog_intro !== ''): ?>
        <p><?php echo nl2br(sparrow_escape($blog_intro)); ?></p>
    <?php endif; ?>
</section>

<?php if (!$posts): ?>
    <section class="blog-empty">
        No product stories are showing yet.
    </section>
<?php else: ?>
    <section class="blog-list">
        <?php foreach ($posts as $post): ?>
            <article class="blog-card">
                <div>
                    <?php if (!empty($post['image_path'])): ?>
                        <img
                            class="blog-card-image"
                            src="<?php echo sparrow_escape(sparrow_url($post['image_path'])); ?>"
                            alt="<?php echo sparrow_escape($post['title']); ?>"
                        >
                    <?php else: ?>
                        <div class="blog-card-placeholder">
                            <?php echo sparrow_escape(sparrow_public_setting('business_name', 'Sparrow & Seed Creations')); ?>
                        </div>
                    <?php endif; ?>
                </div>

                <div>
                    <p class="blog-card-date">
                        <?php echo sparrow_escape(sparrow_blog_post_display_date($post)); ?>
                    </p>

                    <h2><?php echo sparrow_escape($post['title']); ?></h2>

                    <?php if (!empty($post['message'])): ?>
                        <p class="blog-card-section">
                            <?php echo nl2br(sparrow_escape($post['message'])); ?>
                        </p>
                    <?php else: ?>
                        <p class="blog-card-section">
                            A new Sparrow &amp; Seed product story is coming soon.
                        </p>
                    <?php endif; ?>

                    <?php if (!empty($post['promotion'])): ?>
                        <p class="blog-card-section">
                            <strong>Promotion:</strong><br>
                            <?php echo nl2br(sparrow_escape($post['promotion'])); ?>
                        </p>
                    <?php endif; ?>

                    <?php if (!empty($post['short_prayer'])): ?>
                        <p class="blog-card-section">
                            <strong>Prayer:</strong><br>
                            <?php echo nl2br(sparrow_escape($post['short_prayer'])); ?>
                        </p>
                    <?php endif; ?>
                </div>
            </article>
        <?php endforeach; ?>
    </section>

    <?php if ($total_pages > 1): ?>
        <nav class="blog-pagination">
            <?php if ($page > 1): ?>
                <a class="blog-page-link" href="<?php echo sparrow_escape(sparrow_url('/blog.php?page=' . ($page - 1))); ?>">
                    Previous
                </a>
            <?php endif; ?>

            <?php for ($i = 1; $i <= $total_pages; $i++): ?>
                <a
                    class="blog-page-link <?php echo $i === $page ? 'is-active' : ''; ?>"
                    href="<?php echo sparrow_escape(sparrow_url('/blog.php?page=' . $i)); ?>"
                >
                    <?php echo $i; ?>
                </a>
            <?php endfor; ?>

            <?php if ($page < $total_pages): ?>
                <a class="blog-page-link" href="<?php echo sparrow_escape(sparrow_url('/blog.php?page=' . ($page + 1))); ?>">
                    Next
                </a>
            <?php endif; ?>
        </nav>
    <?php endif; ?>
<?php endif; ?>

<?php sparrow_public_footer(); ?>
