<?php
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);
session_start();

// ডাটাবেজ কানেকশন ফাইল লিঙ্ক করুন
require_once __DIR__ . '/config.php';

// ক্যাটাগরি আইডি ভ্যালিডেশন
if (!isset($_GET['id']) || empty($_GET['id'])) {
    header("Location: index.php");
    exit();
}

$category_id = intval($_GET['id']);

try {
    // ১. ক্যাটাগরির নাম রিড করা
    $cat_stmt = $pdo->prepare("SELECT name FROM categories WHERE id = ?");
    $cat_stmt->execute([$category_id]);
    $category = $cat_stmt->fetch(PDO::FETCH_ASSOC);

    if (!$category) {
        header("Location: index.php");
        exit();
    }

    // মোট কয়টি প্রোডাক্ট আছে তা জানা (কাউন্টারের জন্য)
    $total_stmt = $pdo->prepare("SELECT COUNT(*) FROM products WHERE category_id = ?");
    $total_stmt->execute([$category_id]);
    $total_products = $total_stmt->fetchColumn();

    // ২. শুধুমাত্র প্রথম ১০টি প্রোডাক্ট রিড করা
    $prod_stmt = $pdo->prepare("SELECT * FROM products WHERE category_id = ? ORDER BY id DESC LIMIT 10");
    $prod_stmt->execute([$category_id]);
    $products = $prod_stmt->fetchAll(PDO::FETCH_ASSOC);

} catch (PDOException $e) {
    die("ডাটাবেস ত্রুটি: " . htmlspecialchars($e->getMessage()));
}
?>
<!DOCTYPE html>
<html lang="bn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php echo htmlspecialchars($category['name']); ?> | ShopVista</title>
    
    <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=Hind+Siliguri:wght@400;600;700&display=swap" rel="stylesheet">
    
    <link rel="stylesheet" href="css/category_products.css">
    
    <style>
        /* লোডার স্পিনারের স্টাইল */
        .loader-container {
            text-align: center;
            padding: 20px;
            display: none; /* ডিফল্টভাবে হাইড থাকবে */
            width: 100%;
        }
        .loader-container .spinner {
            font-size: 2rem;
            color: #4e73df;
            animation: spin 1s linear infinite;
        }
        @keyframes spin {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(360deg); }
        }
    </style>
</head>
<body>

    <div class="container">
        <div class="category-header">
            <h2 class="category-title">
                <i class="fa-solid fa-tags"></i> 
                <?php echo htmlspecialchars($category['name']); ?>
            </h2>
            <span class="product-count">
                মোট প্রোডাক্ট: <?php echo $total_products; ?> টি
            </span>
        </div>

        <?php if ($total_products > 0): ?>
            <div class="products-grid" id="productContainer">
                <?php foreach ($products as $product): ?>
                    <a href="product_details.php?id=<?php echo $product['id']; ?>" class="product-card-link">
                        <div class="product-card">
                            
                            <?php if ($product['discount_price'] > 0 && $product['price'] > 0): ?>
                                <span class="product-badge-discount">
                                    <?php echo round((($product['price'] - $product['discount_price']) / $product['price']) * 100); ?>% ছাড়
                                </span>
                            <?php endif; ?>
                            
                            <i class="fa-regular fa-heart wishlist-btn" title="উইশলিস্টে রাখুন"></i>
                            
                            <div class="product-img-wrapper">
                                <?php if (!empty($product['image']) && file_exists("uploads/products/" . $product['image'])): ?>
                                    <img src="uploads/products/<?php echo htmlspecialchars($product['image']); ?>" alt="<?php echo htmlspecialchars($product['name']); ?>">
                                <?php else: ?>
                                    <img src="https://via.placeholder.com/200?text=No+Image" alt="No Image Available">
                                <?php endif; ?>
                            </div>
                            
                            <h4><?php echo htmlspecialchars($product['name']); ?></h4>
                            
                            <div class="price-row">
                                <span class="current-price">
                                    ৳<?php echo number_format($product['discount_price'] ?? $product['price']); ?>
                                </span>
                                <?php if ($product['discount_price'] > 0): ?>
                                    <span class="old-price">
                                        ৳<?php echo number_format($product['price']); ?>
                                    </span>
                                <?php endif; ?>
                            </div>
                            
                            <div class="rating-row">
                                <span><i class="fa-solid fa-star"></i> 4.8 (120)</span>
                                <button class="add-to-cart-btn" title="কার্টে যোগ করুন">
                                    <i class="fa-solid fa-cart-plus"></i>
                                </button>
                            </div>
                        </div>
                    </a>
                <?php endforeach; ?>
            </div>

            <div class="loader-container" id="loader">
                <i class="fa-solid fa-circle-notch spinner"></i>
            </div>

        <?php else: ?>
            <div class="no-products">
                <i class="fa-regular fa-folder-open"></i>
                <h3>দুঃখিত, কোনো প্রোডাক্ট পাওয়া যায়নি!</h3>
                <p>এই ক্যাটাগরিতে বর্তমানে কোনো প্রোডাক্ট যুক্ত করা নেই।</p>
            </div>
        <?php endif; ?>
    </div>

    <script>
        let offset = 10; // প্রথম ১০টি আগে থেকেই লোড করা আছে
        const limit = 10;
        const categoryId = <?php echo $category_id; ?>;
        const totalProducts = <?php echo $total_products; ?>;
        let isLoading = false;

        window.onscroll = function() {
            // যদি পেজের নিচে চলে আসে এবং এখনও আরও প্রোডাক্ট লোড হওয়ার বাকি থাকে
            if ((window.innerHeight + window.scrollY) >= document.body.offsetHeight - 300) {
                if (!isLoading && offset < totalProducts) {
                    loadMoreProducts();
                }
            }
        };

        function loadMoreProducts() {
            isLoading = true;
            document.getElementById('loader').style.display = 'block';

            // AJAX কল দিয়ে নতুন প্রোডাক্ট ডাটা নিয়ে আসা
            const xhr = new XMLHttpRequest();
            xhr.open('GET', 'load_more_products.php?category_id=' + categoryId + '&offset=' + offset, true);
            
            xhr.onload = function() {
                if (this.status === 200) {
                    const response = this.responseText.trim();
                    if (response !== '') {
                        // নতুন প্রোডাক্টগুলো গ্রিডের শেষে যুক্ত করা হচ্ছে
                        document.getElementById('productContainer').insertAdjacentHTML('beforeend', response);
                        offset += limit; // অফসেট ১০ বাড়িয়ে দেওয়া হলো পরবর্তী কলের জন্য
                    }
                }
                isLoading = false;
                document.getElementById('loader').style.display = 'none';
            };

            xhr.onerror = function() {
                isLoading = false;
                document.getElementById('loader').style.display = 'none';
            };

            xhr.send();
        }
    </script>
</body>
</html>