kobold-ai/bootle
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add audio assets, UI escape room polish, requirements, and INSTALL.md

Browse Source
This commit is contained in:
Maxi
2026-10-29 08:51:59 +01:00
parent c07c0e10b9
commit 3d30d0812a
17 changed files with 1367 additions and 180 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/templates/index.html
+68 -7
View File
@@ -3,14 +3,75 @@
{% block title %}Die Prüfungen des Steins der Weisen · Hogwarts Escape{% endblock %}
{% block content %}
<div class="parchment-scroll">
<h1 class="parchment-title">⚡ Die Kammern des Steins der Weisen ⚡</h1>
<p class="riddle-poem" style="font-size: 1.3rem; margin: 0.5rem 0;">
"Die Falltür unter Fluffys Pfoten hat sich geöffnet.<br>
Tief unter den Kerkern von Hogwarts wachen uralte Zauber über das größte Geheimnis der Alchemie.<br>
Beweise deinen Scharfsinn, dein Geschick auf dem Besen und deine eiserne Logik!"
</p>
<!-- Interaktiver Hogwarts-Brief & Siegel Intro -->
<div class="escape-letter-intro" id="escapeLetterIntro">
<div class="antique-envelope-scene" id="envelope">
<div class="envelope-base">
<div class="envelope-interior"></div>
<div class="letter-sheet" id="letterSheet">
<header class="letter-header">
<div class="letter-crest-box">
<img src="/static/img/hogwarts_seal.jpg" alt="Hogwarts Crest" class="letter-crest-sketch">
</div>
<h3 class="letter-school-name">Hogwarts-Schule für Hexerei und Zauberei</h3>
<p class="letter-headmaster">Schulleiter: Albus Dumbledore<br><span>(Hüter des Steins der Weisen · Verbotener Korridor)</span></p>
<div class="letter-ornament-line">
<span class="ornament-leaf">❦</span>
<span class="ornament-rule"></span>
<span class="ornament-shield">✦</span>
<span class="ornament-rule"></span>
<span class="ornament-leaf">❧</span>
</div>
</header>
<div class="letter-body-handwritten">
<p class="letter-salutation">Liebe Hexe, lieber Zauberer,</p>
<p class="letter-paragraph">
die Falltür unter Fluffys Pfoten hat sich geöffnet! Tief unter den Kerkern von Hogwarts wachen sechs uralte Schutzzauber der Lehrer über das größte Geheimnis der Alchemie: den <strong>Stein der Weisen</strong>.
</p>
<p class="letter-paragraph">
Schwinge dich auf deinen Besen, stelle dich dem Zauberstab-Duell, braue das goldene Glückselixier und durchschreite Snapes schwarze Flammen. Nur wer alle Kammern meistert, bewahrt das Schloss vor dem Schatten!
</p>
</div>
<footer class="letter-signature-block">
<p class="letter-closing">Mit magischer Hochachtung,</p>
<p class="letter-signature-ink">Minerva McGonagall</p>
<p class="letter-sign-title">Stellvertretende Schulleiterin</p>
</footer>
</div>
<div class="envelope-back-body"></div>
<div class="envelope-closing-flap envelope-v-flap" id="envelopeFlap">
<div class="v-flap-sketch-line"></div>
</div>
<div class="sketched-wax-seal" id="waxSeal" onclick="toggleEscapeLetter()" title="Siegel brechen & Botschaft lesen">
<img src="/static/img/hogwarts_seal.jpg" alt="Hogwarts-Wappen Siegel" class="seal-crest-img">
<div class="seal-emboss-ring"></div>
<div class="seal-glow"></div>
</div>
</div>
</div>
<div style="text-align: center; margin-bottom: 1.5rem;">
<button type="button" id="letterToggleBtn" class="btn-magical" onclick="toggleEscapeLetter()" style="padding: 0.65rem 1.4rem; font-size: 0.95rem;">
📜 Siegel brechen & Einladung lesen
</button>
</div>
</div>
<script>
function toggleEscapeLetter() {
const env = document.getElementById('envelope');
const btn = document.getElementById('letterToggleBtn');
if (!env) return;
const opened = env.classList.toggle('envelope-opened');
if (window.soundFX) window.soundFX.playKeyChime();
const bgm = document.getElementById('bgm');
if (bgm && bgm.paused && (!window.soundFX || !window.soundFX.isMuted())) {
bgm.volume = 0.45;
bgm.play().catch(() => {});
}
if (btn) {
btn.innerText = opened ? '↩ Brief wieder verschließen' : '📜 Siegel brechen & Einladung lesen';
}
}
</script>
<div class="dungeon-card">
<h2 style="color: var(--gold); text-align: center; margin-bottom: 0.5rem; font-size: 1.8rem;">