194 lines
8.3 KiB
HTML
194 lines
8.3 KiB
HTML
{% extends "layout.html" %}
|
|
{% block content %}
|
|
<section class="game-section">
|
|
<div class="content-card">
|
|
<h2 class="section-title" style="margin: 0;"><i data-lucide="user"></i> Hallo, {{ player.display_name }}!</h2>
|
|
</div>
|
|
|
|
{% if not player.is_approved %}
|
|
<div class="content-card notice-card warning-card">
|
|
<h2 class="modal-title"><i data-lucide="hourglass"></i> Warten auf Freigabe</h2>
|
|
<p class="notice-text">Die Spielleitung muss deinen Account noch aktivieren.</p>
|
|
</div>
|
|
{% elif game_status == 'pending' %}
|
|
<div class="content-card notice-card">
|
|
<h2 class="modal-title"><i data-lucide="clock"></i> Spiel startet in Kürze</h2>
|
|
</div>
|
|
{% elif game_status == 'finished' %}
|
|
<div class="content-card leaderboard-card">
|
|
<h2 class="section-title"><i data-lucide="trophy"></i> Rangliste</h2>
|
|
<table class="data-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Platz</th>
|
|
<th>Name</th>
|
|
<th>Punkte</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for current_player in all_players %}
|
|
<tr class="{% if current_player.player_identifier == session['player_identifier'] %}highlighted-row{% endif %}">
|
|
<td>{{ loop.index }}</td>
|
|
<td>{{ current_player.display_name }}</td>
|
|
<td>{{ current_player.score }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{% elif game_status in ['running', 'paused'] %}
|
|
<div class="tab-container">
|
|
<button class="tab-button active-tab" data-target="mission-panel"><i data-lucide="crosshair"></i> Ziel</button>
|
|
<button class="tab-button" data-target="leaderboard-panel"><i data-lucide="bar-chart-2"></i> Punkte</button>
|
|
<button class="tab-button" data-target="rules-panel"><i data-lucide="book-open"></i> Regeln</button>
|
|
</div>
|
|
|
|
<div id="mission-panel" class="tab-content active-content">
|
|
{% if game_status == 'paused' %}
|
|
<div class="content-card notice-card warning-card">
|
|
<h2 class="modal-title"><i data-lucide="pause-circle"></i> Pausiert</h2>
|
|
<p class="notice-text">Kills sind vorübergehend deaktiviert.</p>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if player.is_alive %}
|
|
<div class="content-card target-card" style="text-align: center;">
|
|
<h3 class="card-subtitle"><i data-lucide="target"></i> Ziel</h3>
|
|
<h2 class="target-name">{{ target_player.display_name if target_player else 'Niemand' }}</h2>
|
|
|
|
{% if game_status == 'running' %}
|
|
{% if has_pending_kill_report %}
|
|
<div class="notice-card warning-card" style="padding: var(--spacing-medium); border-radius: var(--border-radius-small); margin-top: var(--spacing-large);">
|
|
<h3 style="margin-top: 0; display: flex; align-items: center; justify-content: center; gap: var(--spacing-small);"><i data-lucide="loader"></i> Kill gemeldet</h3>
|
|
<p>Warte auf Bestätigung…</p>
|
|
<button type="button" id="trigger-revoke-elimination" class="action-button secondary-button"><i data-lucide="rotate-ccw"></i> Zurückziehen</button>
|
|
</div>
|
|
{% else %}
|
|
<button type="button" id="trigger-elimination" class="action-button danger-button large-button"><i data-lucide="crosshair"></i> Kill melden</button>
|
|
{% endif %}
|
|
{% else %}
|
|
<button type="button" class="action-button secondary-button large-button" disabled><i data-lucide="lock"></i> Gesperrt</button>
|
|
{% endif %}
|
|
</div>
|
|
{% elif player.late_joiner %}
|
|
<div class="content-card notice-card warning-card">
|
|
<h2 class="modal-title"><i data-lucide="users"></i> Warten auf Einwechslung</h2>
|
|
<p class="notice-text">Die Spielleitung wechselt dich bald ein.</p>
|
|
</div>
|
|
{% else %}
|
|
<div class="content-card notice-card danger-card">
|
|
<h2 class="modal-title"><i data-lucide="skull"></i> Gekillt</h2>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="content-card statistics-card">
|
|
<h3 class="section-title"><i data-lucide="pie-chart"></i> Übersicht</h3>
|
|
<p>Lebend: <strong>{{ alive_count }}</strong></p>
|
|
<p>Kills: <strong>{{ player.score }}</strong></p>
|
|
<p>Gesamt: <strong>{{ total_eliminations }}</strong></p>
|
|
<p>Zeit: <strong id="game-stopwatch" data-start-time="{{ start_time }}">Lade...</strong></p>
|
|
</div>
|
|
|
|
<div class="content-card settings-card">
|
|
<h3 class="section-title"><i data-lucide="user-cog"></i> Profil</h3>
|
|
{% if player.pending_display_name %}
|
|
<div class="notice-card warning-card" style="padding: var(--spacing-medium); border-radius: var(--border-radius-small);">
|
|
<p class="notice-text" style="margin-top: 0;"><strong>{{ player.pending_display_name }}</strong> wird geprüft…</p>
|
|
<form action="{{ url_for('handle_player_action') }}" method="POST" class="asynchronous-form">
|
|
<input type="hidden" name="action_type" value="cancel_name_change">
|
|
<button type="submit" class="action-button secondary-button small-button"><i data-lucide="x"></i> Abbrechen</button>
|
|
</form>
|
|
</div>
|
|
{% else %}
|
|
<button type="button" id="trigger-name-change-modal" class="action-button secondary-button"><i data-lucide="edit-3"></i> Name ändern</button>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<div id="leaderboard-panel" class="tab-content">
|
|
<div class="content-card">
|
|
<table class="data-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Platz</th>
|
|
<th>Name</th>
|
|
<th>Punkte</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for current_player in all_players %}
|
|
<tr class="{% if current_player.player_identifier == session['player_identifier'] %}highlighted-row{% endif %}">
|
|
<td>{{ loop.index }}</td>
|
|
<td>{{ current_player.display_name }}</td>
|
|
<td>{{ current_player.score }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="rules-panel" class="tab-content">
|
|
<div class="content-card markdown-container">
|
|
{{ rules_markup | safe }}
|
|
</div>
|
|
</div>
|
|
|
|
<div id="elimination-confirm-modal" class="modal-overlay">
|
|
<div class="modal-dialog">
|
|
<h2 class="modal-title"><i data-lucide="alert-triangle"></i> Kill melden</h2>
|
|
<p class="modal-description">Sicher, dass du den Kill melden möchtest?</p>
|
|
<div class="modal-actions">
|
|
<button type="button" id="proceed-elimination" class="action-button danger-button"><i data-lucide="crosshair"></i> Melden</button>
|
|
<button type="button" id="cancel-elimination" class="action-button secondary-button"><i data-lucide="x"></i> Abbrechen</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="rejection-modal" class="modal-overlay">
|
|
<div class="modal-dialog">
|
|
<h2 class="modal-title"><i data-lucide="x-octagon"></i> Abgelehnt</h2>
|
|
<p class="modal-description">Das Ziel hat die Meldung abgelehnt. Bitte klären.</p>
|
|
<div class="modal-actions">
|
|
<button type="button" id="acknowledge-rejection" class="action-button primary-button"><i data-lucide="check"></i> Okay</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="verification-modal" class="modal-overlay {% if player.pending_attacker_identifier %}active-modal{% endif %}">
|
|
<div class="modal-dialog">
|
|
<h2 class="modal-title"><i data-lucide="shield-alert"></i> Gekillt?</h2>
|
|
<p class="modal-description">
|
|
{% if pending_attacker_name %}
|
|
Wurdest du von <strong>{{ pending_attacker_name }}</strong> gekillt?
|
|
{% else %}
|
|
Wurdest du gekillt?
|
|
{% endif %}
|
|
</p>
|
|
<div class="modal-actions">
|
|
<button type="button" id="confirm-elimination" class="action-button danger-button"><i data-lucide="check"></i> Ja</button>
|
|
<button type="button" id="reject-elimination" class="action-button secondary-button"><i data-lucide="x"></i> Nein</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="name-change-modal" class="modal-overlay">
|
|
<div class="modal-dialog">
|
|
<h2 class="modal-title"><i data-lucide="edit-3"></i> Name ändern</h2>
|
|
<p class="modal-description">Der Name wird vorher von der Spielleitung geprüft.</p>
|
|
<form action="{{ url_for('handle_player_action') }}" method="POST" class="input-form asynchronous-form">
|
|
<input type="hidden" name="action_type" value="request_name_change">
|
|
<div class="form-group" style="text-align: left;">
|
|
<label for="pending_display_name" class="input-label">Neuer Name</label>
|
|
<input type="text" id="pending_display_name" name="pending_display_name" class="text-input" required>
|
|
</div>
|
|
<div class="modal-actions">
|
|
<button type="submit" class="action-button primary-button"><i data-lucide="send"></i> Speichern</button>
|
|
<button type="button" id="cancel-name-change-modal" class="action-button secondary-button"><i data-lucide="x"></i> Abbrechen</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</section>
|
|
{% endblock %} |