percoandClaude Fable 5
fe13a4d518
Portes 🚪 (max 10/niveau) téléportant vers un autre niveau publié avec troll conservé (PV, PI, équipement) ; clé d'auteur renvoyée au POST et stockée en localStorage, PUT /api/levels/<id> protégé par X-Level-Secret, section « Mes niveaux publiés » dans l'éditeur, objectifs de victoire affinés (sortie > nettoyage, portes = continuation). Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
130 lines
4.7 KiB
HTML
130 lines
4.7 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="fr">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>MountyCrawl — Le Monde Souterrain</title>
|
||
<link rel="stylesheet" href="css/style.css">
|
||
</head>
|
||
<body>
|
||
|
||
<!-- Écran de création du troll -->
|
||
<div id="screen-create" class="screen">
|
||
<div class="create-box">
|
||
<h1>🧌 MountyCrawl</h1>
|
||
<p class="subtitle">Le Monde Souterrain — hommage à MountyHall, la Terre des Trõlls</p>
|
||
<p class="lore">Au 24<sup>e</sup> cycle après Ragnarok, les Trõlls descendent dans le Monde Souterrain
|
||
en quête de monstres, de trésors et de gloire. Choisis ta race, jeune Trõllinet,
|
||
et pars affronter le Béhémoth qui rôde dans les profondeurs…</p>
|
||
<input type="text" id="troll-name" placeholder="Nom de ton Trõll" maxlength="20" value="Trõllinet">
|
||
<div id="race-list"></div>
|
||
<button id="btn-start" class="big-btn">⚔️ Descendre dans le Monde Souterrain</button>
|
||
<div class="menu-row">
|
||
<button id="btn-community" class="menu-btn">🌍 Niveaux de la communauté</button>
|
||
<button id="btn-editor" class="menu-btn">🛠️ Éditeur de niveaux</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Écran des niveaux communautaires -->
|
||
<div id="screen-community" class="screen hidden">
|
||
<div class="create-box">
|
||
<h1>🌍 Niveaux de la communauté</h1>
|
||
<p class="subtitle">Tu y joueras avec le Trõll configuré sur l'écran d'accueil</p>
|
||
<div id="level-list"><p class="lore">Chargement…</p></div>
|
||
<button id="btn-comm-back" class="big-btn">← Retour à la Taverne</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Écran éditeur de niveaux -->
|
||
<div id="screen-editor" class="screen hidden">
|
||
<header>
|
||
<h1>🛠️ Éditeur de niveaux</h1>
|
||
<button id="ed-back" class="menu-btn">← Retour à la Taverne</button>
|
||
</header>
|
||
<div id="ed-layout">
|
||
<aside id="ed-palette">
|
||
<h3>Terrain</h3>
|
||
<div id="ed-tiles"></div>
|
||
<h3>Monstres</h3>
|
||
<select id="ed-tpl"></select>
|
||
<div id="ed-monsters"></div>
|
||
<h3>Objets</h3>
|
||
<div id="ed-items"></div>
|
||
<h3>Portes (vers un niveau publié)</h3>
|
||
<select id="ed-door-target"></select>
|
||
<div id="ed-doors"></div>
|
||
<h3>Outils</h3>
|
||
<div id="ed-tools"></div>
|
||
<h3>Mes niveaux publiés</h3>
|
||
<div id="ed-mine"></div>
|
||
</aside>
|
||
<main id="ed-main">
|
||
<canvas id="ed-map" width="672" height="480"></canvas>
|
||
<div id="ed-meta">
|
||
<input id="ed-name" placeholder="Nom du niveau" maxlength="40">
|
||
<input id="ed-author" placeholder="Ton pseudo d'auteur" maxlength="30">
|
||
</div>
|
||
<div id="ed-actions">
|
||
<button id="ed-test" class="big-btn">▶️ Tester le niveau</button>
|
||
<button id="ed-publish" class="big-btn">🌍 Publier en ligne</button>
|
||
</div>
|
||
<div id="ed-status"></div>
|
||
<div class="help" id="ed-help">
|
||
<p>Clic / glisser : peindre la sélection · Un niveau publiable a un point de départ 🧌 et au moins un monstre, une porte ou une sortie.</p>
|
||
<p>Victoire : atteindre la sortie ▼ si elle existe, sinon terrasser tous les monstres. Les portes 🚪 téléportent vers un autre niveau publié (PV, PI et équipement conservés) — idéal pour chaîner une campagne.</p>
|
||
<p>Tes niveaux publiés restent modifiables depuis « Mes niveaux publiés » (la clé d'auteur est gardée par ton navigateur).</p>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Écran de jeu -->
|
||
<div id="screen-game" class="screen hidden">
|
||
<header>
|
||
<h1>🧌 MountyCrawl</h1>
|
||
<div id="depth-label">Profondeur −1</div>
|
||
</header>
|
||
<div id="layout">
|
||
<aside id="panel-left">
|
||
<h2 id="troll-title"></h2>
|
||
<div id="stats"></div>
|
||
<h3>S'améliorer (PI)</h3>
|
||
<div id="improve"></div>
|
||
</aside>
|
||
<main id="panel-center">
|
||
<canvas id="map" width="672" height="480"></canvas>
|
||
<div id="pa-bar"></div>
|
||
<div id="actions"></div>
|
||
</main>
|
||
<aside id="panel-right">
|
||
<h3>Équipement</h3>
|
||
<div id="equipment"></div>
|
||
<h3>Sac</h3>
|
||
<div id="inventory"></div>
|
||
<h3>Aide</h3>
|
||
<div class="help">
|
||
<p>ZQSD / flèches : se déplacer (1 PA)</p>
|
||
<p>Marcher sur un ennemi : attaquer (3 PA)</p>
|
||
<p>Espace : passer la DLA</p>
|
||
<p>La DLA passée, les monstres agissent et tu régénères.</p>
|
||
</div>
|
||
</aside>
|
||
</div>
|
||
<div id="log"></div>
|
||
</div>
|
||
|
||
<!-- Écran de fin -->
|
||
<div id="screen-end" class="screen hidden">
|
||
<div class="create-box">
|
||
<h1 id="end-title"></h1>
|
||
<p id="end-text" class="lore"></p>
|
||
<button id="btn-restart" class="big-btn">🍺 Retour à la Taverne (rejouer)</button>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="js/game.js"></script>
|
||
<script src="js/editor.js"></script>
|
||
</body>
|
||
</html>
|