<?php
$page_title = "Shop — GyaniGuru by JMC";
include 'includes/header.php';

// Get Filter Parameters
$cat_slug = $_GET['cat'] ?? '';
$search = $_GET['q'] ?? '';
$min_price = $_GET['min_price'] ?? 0;
$max_price = $_GET['max_price'] ?? 2000;
$rating_filter = $_GET['rating'] ?? 0;
$sort = $_GET['sort'] ?? 'newest';

// Build Query
$sql = "SELECT b.*, c.name as cat_name FROM books b LEFT JOIN categories c ON b.category_id = c.id WHERE b.is_upcoming = 0 AND b.price > 0";
$params = [];

if ($cat_slug) {
    $sql .= " AND c.slug = ?";
    $params[] = $cat_slug;
}
if ($search) {
    $sql .= " AND (b.title LIKE ? OR b.author LIKE ?)";
    $params[] = "%$search%";
    $params[] = "%$search%";
}
if ($min_price) {
    $sql .= " AND b.price >= ?";
    $params[] = $min_price;
}
if ($max_price < 2000) {
    $sql .= " AND b.price <= ?";
    $params[] = $max_price;
}
if ($rating_filter) {
    $sql .= " AND b.rating >= ?";
    $params[] = $rating_filter;
}

// Sorting
switch ($sort) {
    case 'price_low': $sql .= " ORDER BY b.price ASC"; break;
    case 'price_high': $sql .= " ORDER BY b.price DESC"; break;
    case 'rating': $sql .= " ORDER BY b.rating DESC"; break;
    default: $sql .= " ORDER BY b.created_at DESC";
}

$shop_books = get_all($sql, $params);
$all_cats = get_all("SELECT * FROM categories");
?>

<div class="shop-header py-5" style="background: var(--dark-surface); border-bottom: 2px solid var(--gold)">
    <div class="container text-center py-4">
        <h1 class="font-cinzel text-light mb-2">Divine Collection</h1>
        <p class="text-white-50">Explore wisdom curated from the ancient Vedic scriptures</p>
    </div>
</div>

<div class="container py-5">
    <div class="filter-backdrop" id="filterBackdrop" onclick="toggleFilter()"></div>
    <div class="row g-4">
        <!-- Sidebar filters -->
        <div class="col-lg-3">
            <div class="filter-sidebar">
                <div class="filter-mobile-header">
                    <h5 class="filter-drawer-title">Filters</h5>
                    <button class="filter-close-btn" type="button" onclick="toggleFilter()" aria-label="Close filters">
                        <i class="bi bi-x-lg"></i>
                    </button>
                </div>
                <form action="shop.php" method="GET" id="filterForm">
                    <h5 class="filter-title">Search Wisdom</h5>
                    <div class="filter-group mb-4">
                        <div class="input-group">
                            <input type="text" name="q" class="form-control bg-light border-secondary" value="<?php echo htmlspecialchars($search); ?>" placeholder="Book or Author...">
                            <button class="btn btn-light" type="submit"><i class="bi bi-search"></i></button>
                        </div>
                    </div>

                    <h5 class="filter-title">Categories</h5>
                    <div class="filter-group">
                        <ul class="list-unstyled">
                            <li class="mb-2">
                                <a href="shop.php?<?php echo http_build_query(array_merge($_GET, ['cat' => ''])); ?>" 
                                   class="text-decoration-none <?php echo !$cat_slug ? 'text-gold fw-bold' : 'text-muted'; ?>">
                                   All Books
                                </a>
                            </li>
                            <?php foreach($all_cats as $cat): ?>
                            <li class="mb-2">
                                <a href="shop.php?<?php echo http_build_query(array_merge($_GET, ['cat' => $cat['slug']])); ?>" 
                                   class="text-decoration-none <?php echo $cat_slug == $cat['slug'] ? 'text-gold fw-bold' : 'text-muted'; ?>">
                                   <?php echo $cat['name']; ?>
                                </a>
                            </li>
                            <?php endforeach; ?>
                        </ul>
                    </div>

                    <h5 class="filter-title mt-4">Price Range</h5>
                    <div class="filter-group">
                        <input type="range" class="form-range" min="0" max="2000" step="50" name="max_price" id="max_price" value="<?php echo $max_price; ?>">
                        <div class="d-flex justify-content-between text-muted small mt-2">
                            <span>₹0</span>
                            <span class="text-gold fw-bold">Up to ₹<?php echo $max_price; ?></span>
                        </div>
                    </div>

                    <h5 class="filter-title mt-4">Rating</h5>
                    <div class="filter-group">
                        <?php for($i=4; $i>=1; $i--): ?>
                        <div class="filter-checkbox mb-2">
                            <label class="d-flex align-items-center gap-2 cursor-pointer">
                                <input type="radio" name="rating" value="<?php echo $i; ?>" <?php echo $rating_filter == $i ? 'checked' : ''; ?> onchange="this.form.submit()">
                                <span class="stars text-gold"><?php echo str_repeat('★', $i); ?></span>
                                <span class="small text-muted">& Up</span>
                            </label>
                        </div>
                        <?php endfor; ?>
                    </div>

                    <div class="mt-4 pt-4 border-top border-secondary">
                        <button type="submit" class="btn btn-saffron w-100 mb-2">Apply Filters</button>
                        <a href="shop.php" class="btn btn-outline-gold w-100 btn-sm">Reset All</a>
                    </div>
                </form>
            </div>
        </div>

        <!-- Book Grid -->
        <div class="col-lg-9">
            <!-- Sort & View Controls -->
            <div class="d-flex justify-content-between align-items-center mb-4 pb-3 border-bottom border-secondary" data-aos="fade-down">
                <div class="d-flex align-items-center gap-3">
                    <button class="filter-toggle-btn" type="button" onclick="toggleFilter()" aria-label="Toggle filters">
                        <i class="bi bi-funnel-fill"></i>
                        <span>Filters</span>
                    </button>
                    <div class="results-count">
                        Showing <strong class="text-gold"><?php echo count($shop_books); ?></strong> books
                    <?php if($cat_slug): ?> in <span class="text-gold"><?php echo $cat_slug; ?></span><?php endif; ?>
                    </div>
                </div>
                <div class="d-flex align-items-center gap-3">
                    <select class="form-select form-select-sm bg-dark text-white border-secondary" onchange="window.location.href='shop.php?<?php echo http_build_query(array_merge($_GET, ['sort' => ''])); ?>'.slice(0,-1) + this.value">
                        <option value="newest" <?php echo $sort == 'newest' ? 'selected' : ''; ?>>Newest Arrivals</option>
                        <option value="price_low" <?php echo $sort == 'price_low' ? 'selected' : ''; ?>>Price: Low to High</option>
                        <option value="price_high" <?php echo $sort == 'price_high' ? 'selected' : ''; ?>>Price: High to Low</option>
                        <option value="rating" <?php echo $sort == 'rating' ? 'selected' : ''; ?>>Top Rated</option>
                    </select>
                </div>
            </div>

            <div class="row g-4" id="booksGrid">
                <?php foreach($shop_books as $book): ?>
                <div class="col-md-4" data-aos="fade-up">
                    <?php 
                    $disc = $book['original_price'] > 0 ? round((1 - $book['price'] / $book['original_price']) * 100) : 0;
                    $rating = (float)$book['rating'];
                    $stars = str_repeat('★', floor($rating)) . ($rating - floor($rating) >= 0.5 ? '½' : '');
                    ?>
                    <div class="book-card h-100">
                        <?php if($book['badge']): ?><span class="card-badge"><?php echo $book['badge']; ?></span><?php endif; ?>
                        <a href="book-detail.php?id=<?php echo $book['id']; ?>" style="text-decoration:none;color:inherit">
                            <div class="book-image-wrap">
                                <img src="<?php echo $book['image']; ?>" alt="<?php echo $book['title']; ?>" onerror="this.src='images/placeholder.png'" style="height: auto;">
                            </div>
                        </a>
                        <div class="book-card-body">
                            <div class="book-category text-gold"><?php echo $book['cat_name']; ?></div>
                            <a href="book-detail.php?id=<?php echo $book['id']; ?>" style="text-decoration:none">
                                <div class="book-title text-mute"><?php echo $book['title']; ?></div>
                            </a>
                            <div class="book-author text-muted small">by <?php echo $book['author']; ?></div>
                            <div class="book-rating my-2">
                                <span class="stars text-gold" style="font-size:0.8rem"><?php echo $stars; ?></span>
                                <span class="small text-muted ms-1">(<?php echo $book['reviews']; ?>)</span>
                            </div>
                            <div class="book-price">
                                <span class="price-current text-gold">₹<?php echo $book['price']; ?></span>
                                <span class="price-original">₹<?php echo $book['original_price']; ?></span>
                            </div>
                            <div class="book-actions mt-3">
                                <button class="btn btn-saffron btn-sm w-100" onclick="triggerAddToCart('<?php echo $book['id']; ?>', '<?php echo addslashes($book['title']); ?>', '<?php echo addslashes($book['author']); ?>', '<?php echo $book['price']; ?>', '<?php echo $book['image']; ?>', '<?php echo $book['cat_name']; ?>')">
                                     <i class="bi bi-bag-plus"></i> Add to Cart
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
                <?php endforeach; ?>
                
                <?php if(empty($shop_books)): ?>
                <div class="col-12 text-center py-5">
                    <i class="bi bi-search display-1 text-muted opacity-25"></i>
                    <h3 class="mt-4 font-cinzel">Nothing Divine Found</h3>
                    <p class="text-muted">No books match your current filters or searching.</p>
                    <a href="shop.php" class="btn btn-gold mt-3">Reset Filters</a>
                </div>
                <?php endif; ?>
            </div>
        </div>
    </div>
</div>

<script>
    // Handle price range dynamic display
    document.getElementById('max_price').addEventListener('input', function(e) {
        this.nextElementSibling.querySelector('.text-gold').textContent = 'Up to ₹' + e.target.value;
    });

    // Mobile filter toggle
    function toggleFilter() {
        document.querySelector('.filter-sidebar').classList.toggle('active');
        document.getElementById('filterBackdrop').classList.toggle('active');
        document.body.classList.toggle('filter-open');
    }

    document.addEventListener('keydown', function(e) {
        if (e.key === 'Escape' && document.querySelector('.filter-sidebar.active')) {
            toggleFilter();
        }
    });
</script>

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