<?php
require_once "../includes/config.php";

// Get today's champion
$todaysChampion = getTodaysChampion($pdo);
$championId     = $todaysChampion['id'];

// Fetch all bounties
$stmt = $pdo->query("
    SELECT id, title, description, xp_reward, image_path, frequency, created_at
    FROM habits
    WHERE is_bounty = 1
    ORDER BY created_at DESC
");
$bounties = $stmt->fetchAll();
?>
<!DOCTYPE html>
<html>
<head>
    <title>Bounty Board</title>
    <link rel="stylesheet" href="../assets/css/style.css">

    <style>
        .bounty-container {
            width: 900px;
            margin: 0 auto;
            color: #eee;
        }

        .bounty-card {
            background: #1a1a1f;
            border: 1px solid #444;
            padding: 15px;
            border-radius: 8px;
            margin-bottom: 15px;
            display: flex;
            gap: 15px;
        }

        .bounty-img {
            width: 70px;
            height: 70px;
            border-radius: 6px;
            object-fit: cover;
            border: 1px solid #555;
        }

        .bounty-info {
            flex: 1;
        }

        .bounty-card h3 {
            color: #ffcc66;
            margin: 0 0 6px 0;
        }

        .bounty-meta {
            font-size: 13px;
            color: #ccc;
            margin-bottom: 6px;
        }

        .bounty-card button {
            margin-top: 8px;
            background: #7a0000;
            border: none;
            padding: 8px 12px;
            color: white;
            cursor: pointer;
            border-radius: 4px;
        }

        .bounty-card button:hover {
            background: #a00000;
        }
    </style>

    <script src="../assets/js/app.js"></script>
</head>
<body>

<?php include "../includes/menu.php"; ?>

<div class="bounty-container">

    <h1 style="color:#ffcc66; text-align:center; margin-bottom:20px;">
        <img src="../assets/images/icons/trophy.svg" class="menu-icon">
        Bounty Board
    </h1>

    <h3 style="text-align:center; margin-bottom:25px;">
        Champion: <?= htmlspecialchars($todaysChampion['name']) ?>
        (<?= htmlspecialchars($todaysChampion['class_name']) ?>)
    </h3>

    <?php if (empty($bounties)): ?>
        <p>No bounties available.</p>
    <?php else: ?>
        <?php foreach ($bounties as $bounty): ?>
            <div class="bounty-card" id="bounty-<?= $bounty['id'] ?>">

                <?php if ($bounty['image_path']): ?>
                    <img src="../<?= $bounty['image_path'] ?>" class="bounty-img">
                <?php else: ?>
                    <img src="../assets/images/icons/scroll.svg" class="bounty-img">
                <?php endif; ?>

                <div class="bounty-info">
                    <h3><?= htmlspecialchars($bounty['title']) ?></h3>

                    <div class="bounty-meta">
                        XP Reward:
                        <strong><?= (int)$bounty['xp_reward'] ?></strong>
                        &nbsp;|&nbsp;
                        Frequency:
                        <?= ucfirst($bounty['frequency']) ?>
                    </div>

                    <?php if ($bounty['description']): ?>
                        <p><?= nl2br(htmlspecialchars($bounty['description'])) ?></p>
                    <?php endif; ?>

                    <button onclick="completeHabit(<?= $bounty['id'] ?>)">
                        Complete Bounty
                    </button>
                </div>

            </div>
        <?php endforeach; ?>
    <?php endif; ?>

</div>

</body>
</html>