<?php
$pageTitle = 'Manage Games';
ob_start();
?>

<div class="bg-dark rounded-lg shadow-lg p-6">
    <div class="flex flex-col md:flex-row justify-between items-start md:items-center mb-6">
        <h2 class="text-2xl font-bold mb-4 md:mb-0">Manage Games</h2>
        
        <!-- Search Form -->
        <form action="/admin/games" method="GET" class="w-full md:w-auto">
            <div class="flex">
                <input 
                    type="text" 
                    name="search" 
                    placeholder="Search games..." 
                    value="<?= htmlspecialchars($search ?? '') ?>"
                    class="bg-sidebar-bg border border-gray-700 rounded-l px-4 py-2 focus:outline-none focus:ring-2 focus:ring-primary w-full"
                >
                <button type="submit" class="bg-primary hover:bg-secondary text-white px-4 py-2 rounded-r">
                    <i class="fas fa-search"></i>
                </button>
            </div>
        </form>
    </div>
    
    <?php if (!empty($success)): ?>
        <div class="bg-green-800 text-white p-4 rounded-md mb-6">
            <i class="fas fa-check-circle mr-2"></i> <?= htmlspecialchars($success) ?>
        </div>
    <?php endif; ?>
    
    <?php if (!empty($error)): ?>
        <div class="bg-red-800 text-white p-4 rounded-md mb-6">
            <i class="fas fa-exclamation-circle mr-2"></i> <?= htmlspecialchars($error) ?>
        </div>
    <?php endif; ?>
    
    <?php if (empty($games)): ?>
        <div class="bg-gray-800 rounded-lg p-6 text-center">
            <p class="text-gray-400">No games found.</p>
        </div>
    <?php else: ?>
        <div class="overflow-x-auto">
            <table class="min-w-full bg-dark rounded-lg overflow-hidden">
                <thead class="bg-gray-800">
                    <tr>
                        <th class="px-4 py-3 text-left text-xs font-medium text-gray-400 uppercase tracking-wider">ID</th>
                        <th class="px-4 py-3 text-left text-xs font-medium text-gray-400 uppercase tracking-wider">Thumbnail</th>
                        <th class="px-4 py-3 text-left text-xs font-medium text-gray-400 uppercase tracking-wider">Title</th>
                        <th class="px-4 py-3 text-left text-xs font-medium text-gray-400 uppercase tracking-wider">Category</th>
                        <th class="px-4 py-3 text-left text-xs font-medium text-gray-400 uppercase tracking-wider">Featured</th>
                        <th class="px-4 py-3 text-left text-xs font-medium text-gray-400 uppercase tracking-wider">Source</th>
                        <th class="px-4 py-3 text-left text-xs font-medium text-gray-400 uppercase tracking-wider">Actions</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-gray-800">
                    <?php foreach ($games as $game): ?>
                        <tr class="hover:bg-gray-800">
                            <td class="px-4 py-3 whitespace-nowrap"><?= $game['id'] ?></td>
                            <td class="px-4 py-3 whitespace-nowrap">
                                <img src="<?= htmlspecialchars($game['thumbnail']) ?>" alt="<?= htmlspecialchars($game['title']) ?>" class="w-16 h-16 object-cover rounded">
                            </td>
                            <td class="px-4 py-3">
                                <div class="text-sm font-medium"><?= htmlspecialchars($game['title']) ?></div>
                                <div class="text-xs text-gray-400">
                                    <a href="/game/<?= htmlspecialchars($game['slug']) ?>" target="_blank" class="hover:text-primary">
                                        <i class="fas fa-external-link-alt mr-1"></i> View
                                    </a>
                                </div>
                            </td>
                            <td class="px-4 py-3">
                                <form action="/admin/games/update-category" method="POST" class="flex items-center space-x-2">
                                    <input type="hidden" name="game_id" value="<?= $game['id'] ?>">
                                    <select name="category_id" class="bg-sidebar-bg border border-gray-700 rounded px-4 py-2 w-full focus:outline-none focus:ring-2 focus:ring-primary">
                                        <option value="">-- No Category --</option>
                                        <?php foreach ($categories as $category): ?>
                                            <option value="<?= $category['id'] ?>" <?= $game['category_id'] == $category['id'] ? 'selected' : '' ?>>
                                                <?= htmlspecialchars($category['name']) ?>
                                            </option>
                                        <?php endforeach; ?>
                                    </select>
                                    <button type="submit" class="bg-primary hover:bg-secondary text-white px-2 py-1 rounded text-xs">
                                        <i class="fas fa-save"></i>
                                    </button>
                                </form>
                            </td>
                            <td class="px-4 py-3 whitespace-nowrap">
                                <form action="/admin/games/update-featured" method="POST" class="inline">
                                    <input type="hidden" name="game_id" value="<?= $game['id'] ?>">
                                    <input type="hidden" name="featured" value="<?= $game['featured'] ? 0 : 1 ?>">
                                    <button type="submit" class="<?= $game['featured'] ? 'text-yellow-500 hover:text-yellow-400' : 'text-gray-500 hover:text-yellow-500' ?>" title="<?= $game['featured'] ? 'Remove from featured' : 'Add to featured' ?>">
                                        <i class="fas fa-star"></i>
                                    </button>
                                </form>
                            </td>
                            <td class="px-4 py-3 whitespace-nowrap">
                                <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-700 text-gray-300">
                                    <?= htmlspecialchars($game['source'] ?? 'Unknown') ?>
                                </span>
                            </td>
                            <td class="px-4 py-3 whitespace-nowrap text-right text-sm font-medium space-x-2">
                                <a href="/admin/games/edit/<?= $game['id'] ?>" class="text-primary hover:text-secondary">
                                    <i class="fas fa-edit"></i> Edit
                                </a>
                                <form action="/admin/games/delete" method="POST" class="inline" onsubmit="return confirm('Are you sure you want to delete this game?');">
                                    <input type="hidden" name="game_id" value="<?= $game['id'] ?>">
                                    <button type="submit" class="text-red-500 hover:text-red-400">
                                        <i class="fas fa-trash"></i> Delete
                                    </button>
                                </form>
                            </td>
                        </tr>
                    <?php endforeach; ?>
                </tbody>
            </table>
        </div>
        
        <!-- Pagination -->
        <?php if ($totalPages > 1): ?>
            <div class="mt-6 flex justify-center">
                <nav class="relative z-0 inline-flex rounded-md shadow-sm -space-x-px" aria-label="Pagination">
                    <?php if ($page > 1): ?>
                        <a href="/admin/games?page=<?= $page - 1 ?><?= !empty($search) ? '&search=' . urlencode($search) : '' ?>" class="relative inline-flex items-center px-2 py-2 rounded-l-md border border-gray-700 bg-sidebar-bg text-sm font-medium text-gray-300 hover:bg-gray-700">
                            <span class="sr-only">Previous</span>
                            <i class="fas fa-chevron-left"></i>
                        </a>
                    <?php endif; ?>
                    
                    <?php
                    $startPage = max(1, $page - 2);
                    $endPage = min($totalPages, $startPage + 4);
                    
                    if ($endPage - $startPage < 4 && $startPage > 1) {
                        $startPage = max(1, $endPage - 4);
                    }
                    
                    for ($i = $startPage; $i <= $endPage; $i++):
                    ?>
                        <a href="/admin/games?page=<?= $i ?><?= !empty($search) ? '&search=' . urlencode($search) : '' ?>" class="relative inline-flex items-center px-4 py-2 border border-gray-700 <?= $i === $page ? 'bg-gray-700 text-white' : 'bg-sidebar-bg text-gray-300 hover:bg-gray-700' ?> text-sm font-medium">
                            <?= $i ?>
                        </a>
                    <?php endfor; ?>
                    
                    <?php if ($page < $totalPages): ?>
                        <a href="/admin/games?page=<?= $page + 1 ?><?= !empty($search) ? '&search=' . urlencode($search) : '' ?>" class="relative inline-flex items-center px-2 py-2 rounded-r-md border border-gray-700 bg-sidebar-bg text-sm font-medium text-gray-300 hover:bg-gray-700">
                            <span class="sr-only">Next</span>
                            <i class="fas fa-chevron-right"></i>
                        </a>
                    <?php endif; ?>
                </nav>
            </div>
        <?php endif; ?>
    <?php endif; ?>
</div>

<?php
$content = ob_get_clean();
include __DIR__ . '/layout.php';
?>