Files
bootle/app/templates/chess.html
T

69 lines
3.2 KiB
HTML
Executable File
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
{% extends "base.html" %}
{% block title %}Kammer II: McGonagalls Zauberschach · Hogwarts Escape{% endblock %}
{% block content %}
<div class="parchment-scroll">
<h1 class="parchment-title">♟️ Kammer II: McGonagalls Zauberschach ⚔️</h1>
<p class="riddle-poem" style="font-size: 1.25rem; margin: 0.5rem 0;">
"Wir müssen uns den Weg quer durch das Zimmer freispielen!", rief Ron.<br>
Hinter den weißen Riesenfiguren liegt die schwere Eichentür zur Flammenkammer.<br>
Übernimm die Kontrolle über die schwarzen Steine und setze den weißen König schachmatt!
</p>
</div>
<div class="dungeon-card" style="text-align: center;">
<div id="chessStatus" style="font-size: 1.15rem; color: var(--gold); margin-bottom: 1rem; min-height: 28px;">
🧙‍♂️ Wähle deinen schwarzen Springer oder deine Dame und führe den Siegeszug aus!
</div>
<!-- 8x8 Chess Board Container -->
<div class="chess-board-wrapper">
<div id="chessBoard" class="chess-board">
<!-- Rendered dynamically by chess.js -->
</div>
</div>
<div style="margin-top: 1.25rem; display: flex; justify-content: center; gap: 1rem; flex-wrap: wrap;">
<button type="button" id="btnResetChess" class="btn-control" style="font-size: 0.95rem; padding: 0.6rem 1.2rem;">
🔄 Stellung zurücksetzen
</button>
<a href="/bottles" class="btn-magical">
🧪 Zu Snapes Flaschenkammer ➔
</a>
</div>
<!-- Move History Log -->
<div style="margin-top: 1.25rem; text-align: left; background: rgba(15, 12, 22, 0.7); border: 1px solid rgba(229, 185, 72, 0.25); border-radius: 8px; padding: 0.8rem 1rem;">
<strong style="color: var(--gold); font-size: 0.9rem;">📜 Zug-Protokoll:</strong>
<ul id="moveHistory" style="list-style: none; margin-top: 0.4rem; font-size: 0.85rem; color: var(--text-dim); line-height: 1.6;">
<li>Partie eröffnet: Schwarz am Zug!</li>
</ul>
</div>
</div>
<!-- Tactical Hint Accordion -->
<div class="dungeon-card">
<details>
<summary style="cursor: pointer; font-size: 1.15rem; color: var(--gold); font-weight: bold;">
💡 Rons taktischer Schach-Tipp (Hier klicken)
</summary>
<div style="margin-top: 0.75rem; line-height: 1.7; color: var(--text-light); font-size: 0.95rem;">
<p>
Der weiße König steht in der Ecke auf <strong>h1</strong>, eingeklemmt von seinen eigenen Bauern auf g2 und h2.
</p>
<p style="margin-top: 0.5rem;">
🎯 <strong>Möglichkeit 1:</strong> Führe mit dem schwarzen Springer auf <strong>g4</strong> ein verheerendes Schachgebot auf <strong>f2</strong> aus (♞f2+) – Rons klassisches Springer-Opfer!
</p>
<p style="margin-top: 0.5rem;">
🎯 <strong>Möglichkeit 2:</strong> Schlage mit der schwarzen Dame auf <strong>h4</strong> direkt den Bauern auf <strong>h2</strong> (♛xh2#) – augenblickliches Schachmatt mit Springer-Deckung!
</p>
</div>
</details>
</div>
{% endblock %}
{% block scripts %}
<script src="/static/js/chess.js?v=1.0"></script>
{% endblock %}