tomsjavajive-app/index.php

<?php
/**
 * Tom's Java Jive - Homepage
 */

$pageTitle = "Tom's Java Jive | Premium Coffee Beans & Fresh Roasts";
require_once __DIR__ . '/includes/functions.php';

// Get featured products
$featuredProducts = db()->fetchAll(
    "SELECT * FROM products WHERE is_active = 1 AND is_featured = 1 ORDER BY created_at DESC LIMIT 4"
);

// If no featured products, get latest products
if (empty($featuredProducts)) {
    $featuredProducts = db()->fetchAll(
        "SELECT * FROM products WHERE is_active = 1 ORDER BY created_at DESC LIMIT 4"
    );
}

require_once __DIR__ . '/includes/header.php';
?>

<!-- Hero Section -->
<section class="hero">
    <div class="container">
        <h1>Premium Coffee, Delivered Fresh</h1>
        <p>Artisan roasted coffee beans sourced from the world's finest growing regions. Experience the perfect cup, every time.</p>
        <div style="display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap;">
            <a href="/shop.php" class="btn btn-primary btn-lg">Shop Now</a>
            <a href="#about" class="btn btn-outline btn-lg">Learn More</a>
        </div>
    </div>
</section>

<!-- Features Section -->
<section class="section" style="background: var(--color-surface);">
    <div class="container">
        <div class="features-grid">
            <div class="feature-card">
                <div class="feature-icon">
                    <i class="fas fa-leaf"></i>
                </div>
                <h3>Ethically Sourced</h3>
                <p>Direct trade relationships with farmers ensuring fair wages and sustainable practices.</p>
            </div>
            <div class="feature-card">
                <div class="feature-icon">
                    <i class="fas fa-fire"></i>
                </div>
                <h3>Fresh Roasted</h3>
                <p>Roasted in small batches weekly to ensure maximum freshness and flavor.</p>
            </div>
            <div class="feature-card">
                <div class="feature-icon">
                    <i class="fas fa-truck"></i>
                </div>
                <h3>Fast Delivery</h3>
                <p>Free shipping on orders over $50. Same-day dispatch for orders before 2pm.</p>
            </div>
            <div class="feature-card">
                <div class="feature-icon">
                    <i class="fas fa-heart"></i>
                </div>
                <h3>Satisfaction Guaranteed</h3>
                <p>Not happy with your order? We'll make it right or your money back.</p>
            </div>
        </div>
    </div>
</section>

<!-- Featured Products Section -->
<section class="section">
    <div class="container">
        <div class="section-header">
            <h2>Featured Products</h2>
            <p>Our most popular coffee selections</p>
        </div>
        
        <div class="product-grid">
            <?php if (empty($featuredProducts)): ?>
                <div style="grid-column: 1 / -1; text-align: center; padding: 3rem;">
                    <p class="text-muted">Products coming soon! Check back later.</p>
                    <a href="/admin/products.php" class="btn btn-primary mt-1">Add Products</a>
                </div>
            <?php else: ?>
                <?php foreach ($featuredProducts as $product): 
                    $images = json_decode($product['images'] ?? '[]', true);
                    $imageUrl = !empty($images) ? $images[0] : '/assets/images/placeholder-product.svg';
                    $price = $product['sale_price'] ?? $product['price'];
                ?>
                    <div class="product-card">
                        <a href="/product.php?id=<?= $product['product_id'] ?>" class="product-card-image">
                            <img src="<?= htmlspecialchars($imageUrl) ?>" alt="<?= htmlspecialchars($product['name']) ?>">
                            <?php if ($product['sale_price']): ?>
                                <span class="product-card-badge">Sale</span>
                            <?php endif; ?>
                        </a>
                        <div class="product-card-body">
                            <?php if ($product['category']): ?>
                                <div class="product-card-category"><?= htmlspecialchars($product['category']) ?></div>
                            <?php endif; ?>
                            <h3 class="product-card-title">
                                <a href="/product.php?id=<?= $product['product_id'] ?>"><?= htmlspecialchars($product['name']) ?></a>
                            </h3>
                            <div class="product-card-price">
                                <span class="current"><?= formatCurrency($price) ?></span>
                                <?php if ($product['sale_price']): ?>
                                    <span class="original"><?= formatCurrency($product['price']) ?></span>
                                <?php endif; ?>
                            </div>
                            <button class="btn btn-primary btn-block add-to-cart" data-id="<?= $product['product_id'] ?>">
                                <i class="fas fa-shopping-bag"></i> Add to Cart
                            </button>
                        </div>
                    </div>
                <?php endforeach; ?>
            <?php endif; ?>
        </div>
        
        <div style="text-align: center; margin-top: 3rem;">
            <a href="/shop.php" class="btn btn-secondary btn-lg">View All Products</a>
        </div>
    </div>
</section>

<!-- About Section -->
<section class="section" id="about" style="background: var(--color-surface);">
    <div class="container">
        <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center;">
            <div>
                <h2 style="font-family: var(--font-display); font-size: 2.5rem; margin-bottom: 1.5rem;">Our Story</h2>
                <p style="font-size: 1.125rem; color: var(--color-text-muted); margin-bottom: 1.5rem;">
                    Founded in Fort Worth, Texas, Tom's Java Jive began with a simple mission: to bring exceptional coffee to our community. What started as a small roastery has grown into a beloved local institution.
                </p>
                <p style="font-size: 1.125rem; color: var(--color-text-muted); margin-bottom: 1.5rem;">
                    We source our beans directly from farmers around the world, ensuring fair prices and sustainable practices. Every batch is carefully roasted to bring out the unique flavors and characteristics of each origin.
                </p>
                <a href="/shop.php" class="btn btn-primary">Explore Our Coffee</a>
            </div>
            <div style="position: relative;">
                <img src="/assets/images/coffee-brewing.jpg" alt="Coffee brewing" style="border-radius: var(--radius-lg); box-shadow: var(--shadow-xl);">
            </div>
        </div>
    </div>
</section>

<!-- Newsletter Section -->
<section class="newsletter">
    <div class="container">
        <h2>Join Our Coffee Community</h2>
        <p>Subscribe for exclusive offers, brewing tips, and early access to new roasts.</p>
        <form class="newsletter-form" id="newsletter-form">
            <input type="email" name="email" placeholder="Your email" required>
            <button type="submit">Subscribe</button>
        </form>
        <p id="newsletter-message" style="margin-top: 1rem; display: none;"></p>
    </div>
</section>

<script>
document.getElementById('newsletter-form').addEventListener('submit', async function(e) {
    e.preventDefault();
    const email = this.querySelector('input[name="email"]').value;
    const msgEl = document.getElementById('newsletter-message');
    
    try {
        const response = await fetch('/api/subscribe.php', {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({ email })
        });
        const data = await response.json();
        
        msgEl.style.display = 'block';
        if (data.success) {
            msgEl.textContent = 'Thanks for subscribing!';
            msgEl.style.color = '#10B981';
            this.reset();
        } else {
            msgEl.textContent = data.error || 'Something went wrong';
            msgEl.style.color = '#EF4444';
        }
    } catch (err) {
        msgEl.style.display = 'block';
        msgEl.textContent = 'Failed to subscribe. Please try again.';
        msgEl.style.color = '#EF4444';
    }
});
</script>

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