{% extends 'base.html.twig' %}

{% block title %}{{ player.scumName }}'s Profil{% endblock %}

{% block content %}
    <div class="container mt-4">
        <div class="row">
            <!-- Profil Card -->
            <div class="col-md-6">
                <div class="card shadow">
                    <div class="card-body">
                        <h3 class="card-title">{{ player.scumName }}'s Profil</h3>
                        <p class="card-text"><strong>Level:</strong> {{ player.level }}</p>
                        <p class="card-text"><strong>XP:</strong> {{ player.xp }}</p>

                        <!-- Fortschrittsbalken für XP -->
                        {% set max_xp = player.level * 1000 %}
                        {% set progress = (max_xp > 0) ? (player.xp / max_xp) * 100 : 0 %}
                        <div class="progress" style="height: 20px;">
                            <div class="progress-bar bg-success" role="progressbar"
                                 style="width: {{ progress }}%;"
                                 aria-valuenow="{{ player.xp }}"
                                 aria-valuemin="0"
                                 aria-valuemax="{{ max_xp }}">
                                {{ progress|round }}%
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Ranking Card -->
            <div class="col-md-6">
                <div class="card shadow">
                    <div class="card-body">
                        <h3 class="card-title">Ranking</h3>
                        <p class="card-text display-4 text-center">{{ player.ranking }}</p>
                    </div>
                </div>
            </div>
        </div>

        <div class="row mt-4">
            <!-- Aktive Quests -->
            <div class="col-md-6">
                <div class="card shadow">
                    <div class="card-body">
                        <h3 class="card-title">Aktive Quests</h3>
                        {% if activeQuests is not empty %}
                            <ul class="list-group">
                                {% for playerQuest in activeQuests %}
                                    <li class="list-group-item">{{ playerQuest.quest.name }}</li>
                                {% endfor %}
                            </ul>
                        {% else %}
                            <p class="text-muted">Keine aktiven Quests</p>
                        {% endif %}
                    </div>
                </div>
            </div>

            <!-- Neue Quest zuordnen -->
            <div class="col-md-6">
                <div class="card shadow">
                    <div class="card-body">
                        <h3 class="card-title">Neue Quest zuordnen</h3>
                        <form action="{{ path('add_quest_to_player', {'playerId': player.id, 'steamId': player.steamId}) }}" method="post">
                            <div class="form-group">
                                <label for="quest">Wähle eine Quest:</label>
                                <select name="questId" id="quest" class="form-control">
                                    {% for quest in quests %}
                                        {% if player.level >= quest.getRequiredLevel() %}
                                            <option value="{{ quest.id }}">{{ quest.name }}</option>
                                        {% else %}
                                            <option value="{{ quest.id }}" disabled>{{ quest.name }} (Level {{ quest.getRequiredLevel() }} erforderlich)</option>
                                        {% endif %}
                                    {% endfor %}
                                </select>
                            </div>
                            <button type="submit" class="btn btn-primary mt-2 w-100">Quest zuordnen</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}