<?php
require_once 'includes/header.php';
require_once 'includes/marketing_functions.php';

// Get favorite products for logged in users
$favorite_product_ids = [];
if (isLoggedIn()) {
    $favorite_products = getFavoriteProducts($pdo, $_SESSION['user_id']);
    foreach ($favorite_products as $fav) {
        $favorite_product_ids[] = $fav['id'];
    }
}

// Get categories for display
$categories = getCategories($pdo);

// Get some statistics for the homepage
$total_products = count(getAllProducts($pdo));
$total_users_stmt = $pdo->query("SELECT COUNT(*) as count FROM users");
$total_users = $total_users_stmt->fetch(PDO::FETCH_ASSOC)['count'];

// Get active advertisements
$advertisements = getActiveAdvertisements($pdo, 'homepage');

// Function to get CSS class for category
function getCategoryClass($category) {
    $categoryClasses = [
        'Electronics' => 'category-electronics',
        'Clothing' => 'category-clothing',
        'Sports' => 'category-sports',
        'Books' => 'category-books',
        'Home & Garden' => 'category-home-garden'
    ];
    
    return isset($categoryClasses[$category]) ? $categoryClasses[$category] : 'category-electronics';
}
?>

<div class="hero">
    <div class="container">
        <h1>Welcome to <?php echo SITE_NAME; ?></h1>
        <p>Your one-stop shop for all your needs</p>
        <a href="<?php echo SITE_URL; ?>/products/index.php" class="btn btn-primary btn-large">Shop Now</a>
    </div>
</div>

<div class="container">
    <?php if (isset($_SESSION['error_message'])): ?>
        <div class="message error">
            <?php echo htmlspecialchars($_SESSION['error_message']); ?>
            <?php unset($_SESSION['error_message']); ?>
        </div>
    <?php endif; ?>
    
    <?php if (isset($_SESSION['success_message'])): ?>
        <div class="message success">
            <?php echo htmlspecialchars($_SESSION['success_message']); ?>
            <?php unset($_SESSION['success_message']); ?>
        </div>
    <?php endif; ?>
    
    <!-- Statistics Section -->
    <div class="dashboard-stats">
        <div class="stat-card">
            <h3>Products Available</h3>
            <div class="stat-value"><?php echo $total_products; ?></div>
        </div>
        
        <div class="stat-card">
            <h3>Happy Customers</h3>
            <div class="stat-value"><?php echo $total_users; ?></div>
        </div>
        
        <div class="stat-card">
            <h3>Categories</h3>
            <div class="stat-value"><?php echo count($categories); ?></div>
        </div>
    </div>
    
    <!-- Advertisements Section -->
    <?php if (!empty($advertisements)): ?>
    <div class="section-title">
        <h2>Special Offers</h2>
    </div>
    
    <div class="products-grid animated-offers">
        <?php foreach ($advertisements as $ad): ?>
            <div class="product-card offer-card">
                <div class="product-image">
                    <?php if (!empty($ad['image_url'])): ?>
                        <img src="<?php echo SITE_URL . '/' . htmlspecialchars($ad['image_url']); ?>" alt="<?php echo htmlspecialchars($ad['title']); ?>">
                    <?php else: ?>
                        <i class="fas fa-bullhorn" style="font-size: 3rem; color: #f39c12;"></i>
                    <?php endif; ?>
                </div>
                <div class="product-info">
                    <h3><?php echo htmlspecialchars($ad['title']); ?></h3>
                    <p><?php echo htmlspecialchars($ad['description']); ?></p>
                    <a href="<?php echo !empty($ad['link_url']) ? $ad['link_url'] : '#'; ?>" class="btn btn-primary btn-block">Learn More</a>
                </div>
            </div>
        <?php endforeach; ?>
    </div>
    <?php endif; ?>
    
    <!-- Categories Section -->
    <div class="section-title">
        <h2>Shop by Category</h2>
    </div>
    
    <div class="products-grid">
        <?php foreach ($categories as $category): ?>
            <div class="product-card">
                <div class="product-image category-image <?php echo getCategoryClass($category['category']); ?>">
                </div>
                <div class="product-info">
                    <h3><?php echo htmlspecialchars($category['category']); ?></h3>
                    <a href="<?php echo SITE_URL; ?>/products/index.php?category=<?php echo urlencode($category['category']); ?>" class="btn btn-outline btn-block">Browse <?php echo htmlspecialchars($category['category']); ?></a>
                </div>
            </div>
        <?php endforeach; ?>
    </div>
    
    <!-- Featured Products Section -->
    <div class="section-title">
        <h2>Featured Products</h2>
    </div>
    
    <div class="products-grid">
        <?php 
        $all_products = getAllProducts($pdo);
        $featured_products = array_slice($all_products, 0, 4);
        foreach ($featured_products as $product): ?>
            <div class="product-card" data-product-id="<?php echo $product['id']; ?>">
                <div class="product-image">
                    <?php if (!empty($product['image'])): ?>
                        <img src="<?php echo SITE_URL . '/' . htmlspecialchars($product['image']); ?>" alt="<?php echo htmlspecialchars($product['name']); ?>">
                    <?php else: ?>
                        <i class="fas fa-image" style="font-size: 3rem; color: #ccc;"></i>
                    <?php endif; ?>
                    <button class="favorite-btn <?php echo in_array($product['id'], $favorite_product_ids) ? 'active' : ''; ?>" data-product-id="<?php echo $product['id']; ?>">
                        <i class="fas fa-heart"></i>
                    </button>
                </div>
                <div class="product-info">
                    <h3><?php echo htmlspecialchars($product['name']); ?></h3>
                    <div class="product-price">$<?php echo number_format($product['price'], 2); ?></div>
                    <a href="<?php echo SITE_URL; ?>/products/view.php?id=<?php echo $product['id']; ?>" class="btn btn-primary btn-block">View Details</a>
                </div>
            </div>
        <?php endforeach; ?>
    </div>
    
    <!-- Support Section -->
    <div class="section-title">
        <h2>Need Help?</h2>
    </div>
    
    <div class="products-grid">
        <div class="product-card">
            <div class="product-image">
                <i class="fas fa-headset" style="font-size: 3rem; color: #2ecc71;"></i>
            </div>
            <div class="product-info">
                <h3>Customer Support</h3>
                <p>Get help with your orders, returns, and more</p>
                <?php if (isLoggedIn()): ?>
                    <a href="<?php echo SITE_URL; ?>/tickets/create.php" class="btn btn-outline btn-block">Create Support Ticket</a>
                <?php else: ?>
                    <a href="<?php echo SITE_URL; ?>/auth/login.php" class="btn btn-outline btn-block">Login for Support</a>
                <?php endif; ?>
            </div>
        </div>
        
        <div class="product-card">
            <div class="product-image">
                <i class="fas fa-truck" style="font-size: 3rem; color: #f39c12;"></i>
            </div>
            <div class="product-info">
                <h3>Shipping Information</h3>
                <p>Learn about our shipping options and delivery times</p>
                <a href="<?php echo SITE_URL; ?>/shipping-info.php" class="btn btn-outline btn-block">View Shipping Policy</a>
            </div>
        </div>
        
        <div class="product-card">
            <div class="product-image">
                <i class="fas fa-undo" style="font-size: 3rem; color: #9b59b6;"></i>
            </div>
            <div class="product-info">
                <h3>Returns & Exchanges</h3>
                <p>Easy returns and exchanges for your peace of mind</p>
                <a href="<?php echo SITE_URL; ?>/returns-policy.php" class="btn btn-outline btn-block">View Return Policy</a>
            </div>
        </div>
        
        <div class="product-card">
            <div class="product-image">
                <i class="fas fa-question-circle" style="font-size: 3rem; color: #3498db;"></i>
            </div>
            <div class="product-info">
                <h3>FAQ</h3>
                <p>Frequently asked questions and answers</p>
                <a href="<?php echo SITE_URL; ?>/faq.php" class="btn btn-outline btn-block">Browse FAQ</a>
            </div>
        </div>
    </div>
</div>

<style>
.original-price {
    text-decoration: line-through;
    color: #95a5a6;
    font-size: 0.9rem;
}

.discounted-price {
    color: #e74c3c;
    font-weight: bold;
    font-size: 1.2rem;
}

.discount-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    background-color: #e74c3c;
    color: white;
    padding: 5px 10px;
    border-radius: 4px;
    font-weight: bold;
    font-size: 0.9rem;
}

/* Animated Offers Styles */
.animated-offers {
    position: relative;
    overflow: hidden;
}

.offer-card {
    animation: pulse 2s infinite;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.offer-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
}

@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(52, 152, 219, 0.4);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(52, 152, 219, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(52, 152, 219, 0);
    }
}

/* Additional animation for the section */
.section-title h2 {
    position: relative;
    display: inline-block;
}

.section-title h2::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 3px;
    background: linear-gradient(to right, #3498db, #2c3e50);
    transition: width 0.5s ease;
}

.section-title h2:hover::after {
    width: 100px;
}
</style>

<script>
// Add additional animation effects
document.addEventListener('DOMContentLoaded', function() {
    const offerCards = document.querySelectorAll('.offer-card');
    
    // Add staggered animation delay
    offerCards.forEach((card, index) => {
        card.style.animationDelay = (index * 0.2) + 's';
    });
    
    // Add entrance animation
    const observer = new IntersectionObserver((entries) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                entry.target.style.opacity = 1;
                entry.target.style.transform = 'translateY(0)';
            }
        });
    }, { threshold: 0.1 });
    
    // Apply to animated offers section
    const animatedOffers = document.querySelector('.animated-offers');
    if (animatedOffers) {
        animatedOffers.style.opacity = 0;
        animatedOffers.style.transform = 'translateY(20px)';
        animatedOffers.style.transition = 'opacity 0.6s ease, transform 0.6s ease';
        observer.observe(animatedOffers);
    }
});
</script>

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