Maxi
68 lines
2.6 KiB
HTML
Executable File
68 lines
2.6 KiB
HTML
Executable File
{% extends "base.html" %}
|
|
|
|
{% block title %}Kammer II: Das Zauberspruch-Duell · Hogwarts Escape{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="parchment-scroll">
|
|
<h1 class="parchment-title">🪄 Kammer II: Das Zauberspruch-Duell ⚡</h1>
|
|
<p class="riddle-poem" style="font-size: 1.15rem; margin: 0.3rem 0;">
|
|
"Zücke deinen Zauberstab! Verbinde die Runensterne <strong>1 bis 4</strong> (durch Ziehen oder Antippen),
|
|
um die Sprüche zu wirken und die verzauberte Rüstung zu bezwingen!"
|
|
</p>
|
|
</div>
|
|
|
|
{% if is_locked and lock_info %}
|
|
<div class="chamber-lock-banner">
|
|
<div class="chamber-lock-icon">🔒</div>
|
|
<h2 class="chamber-lock-title">Kammer Versiegelt!</h2>
|
|
<p class="chamber-lock-desc">
|
|
{{ lock_info.reason }}
|
|
</p>
|
|
<div class="chamber-req-box">
|
|
<div class="chamber-req-icon">{{ lock_info.item_icon }}</div>
|
|
<div class="chamber-req-info">
|
|
<strong>{{ lock_info.item_name }}</strong>
|
|
<span>Erforderlich aus: {{ lock_info.from_chamber }}</span>
|
|
</div>
|
|
</div>
|
|
<div class="chamber-lock-actions">
|
|
<a href="{{ lock_info.from_url }}" class="btn-magical">
|
|
➔ Zu {{ lock_info.from_chamber }} gehen
|
|
</a>
|
|
<a href="?alohomora=1" class="alohomora-link">
|
|
✨ Zauberspruch »Alohomora« wirken (Prüfung für Spielleiter / Tester freischalten)
|
|
</a>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="canvas-wrapper">
|
|
<div class="game-hud">
|
|
<div>🪄 Spruch: <strong id="spellName" style="color: var(--gold);">Flipendo ⚡</strong></div>
|
|
<div id="spellProgress" style="color: #4cc9f0; font-weight: bold;">Zauberspruch 1 von 4</div>
|
|
<div>🛡️ Ziel: <span id="dummyHp">4 Zauber übrig</span></div>
|
|
</div>
|
|
|
|
<canvas id="spellCanvas" style="touch-action: none; -webkit-user-select: none; user-select: none; width: 100%; display: block;"></canvas>
|
|
</div>
|
|
|
|
<div class="dungeon-card" style="margin-top: 1rem; text-align: center; padding: 0.75rem 1rem;">
|
|
<p id="spellDesc" style="font-size: 1.1rem; color: var(--gold); margin-bottom: 0.4rem;">
|
|
Verbinde die leuchtenden Runensterne von 1 bis 4, um den Zauber zu wirken!
|
|
</p>
|
|
<p style="color: var(--text-dim); font-size: 0.9rem; margin: 0;">
|
|
💡 <em>Tipp: Ziehe mit dem Daumen über die Sterne oder tippe sie einfach der Reihe nach (1 ➔ 2 ➔ 3 ➔ 4) an!</em>
|
|
</p>
|
|
</div>
|
|
|
|
<div style="text-align: center; margin-top: 1.25rem;">
|
|
<a href="/brew" class="btn-magical">
|
|
Direkt weiter zur Brauküche ⚗️ ➔
|
|
</a>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block scripts %}
|
|
<script src="/static/js/duel.js?v=5.0"></script>
|
|
{% endblock %}
|