krh/muuhd
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

progress

Browse Source
This commit is contained in:
Kim Ravn Hansen
2025-10-09 15:51:40 +02:00
parent 2bf6272291
commit 1f97ea63e2
20 changed files with 1173 additions and 855 deletions
Download Patch File Download Diff File Expand all files Collapse all files

133
frontend/dungeon_studio.html Executable file
View File

@@ -0,0 +1,133 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>ASCII Dungeon Generator</title>
<style>
body {
font-family: "Courier New", monospace;
background-color: #9a9;
color: #aba;
margin: 0;
padding: 20px;
}
.container {
max-width: 1200px;
margin: 0 auto;
}
h1 {
text-align: center;
color: #00ff00;
text-shadow: 0 0 10px #00ff00;
}
.controls {
text-align: center;
margin-bottom: 20px;
}
button {
background-color: #333;
color: #00ff00;
border: 2px solid #00ff00;
padding: 10px 20px;
margin: 5px;
cursor: pointer;
font-family: "Courier New", monospace;
font-size: 14px;
transition: all 0.3s;
}
button:hover {
background-color: #00ff00;
color: #1a1a1a;
box-shadow: 0 0 10px #00ff00;
}
.dungeon-display {
font-family: "Courier New", monospace;
background-color: #000;
border: 2px solid #777;
padding: 15px;
font-size: 15px;
line-height: 17px;
overflow-x: auto;
white-space: pre;
box-shadow: 0 0 20px rgba(0, 255, 0, 0.3);
}
.settings {
display: flex;
justify-content: center;
gap: 20px;
margin-bottom: 20px;
flex-wrap: wrap;
}
.setting {
display: flex;
align-items: center;
gap: 5px;
}
input[type="range"] {
background-color: #333;
}
label {
color: #00ff00;
font-size: 14px;
}
.legend {
margin-top: 20px;
padding: 15px;
background-color: #222;
border: 1px solid #444;
border-radius: 5px;
}
.legend h3 {
margin-top: 0;
color: #1f1;
}
.legend-item {
margin: 5px 0;
}
</style>
</head>
<body>
<div class="container">
<h1>⚔️ ASCII DUNGEON GENERATOR ⚔️</h1>
<div class="settings">
<div class="setting">
<label for="width">Width:</label>
<input type="range" id="width" min="40" max="100" value="69" />
<span id="widthValue">69</span>
</div>
<div class="setting">
<label for="height">Height:</label>
<input type="range" id="height" min="30" max="60" value="42" />
<span id="heightValue">42</span>
</div>
<div class="setting">
<label for="roomCount">Rooms:</label>
<input type="range" id="roomCount" min="5" max="20" value="18" />
<span id="roomCountValue">18</span>
</div>
</div>
<div class="controls">
<button onclick="generateDungeon()">Generate New Dungeon</button>
<button onclick="downloadDungeon()">Download as Text</button>
</div>
<div class="dungeon-display" id="dungeonDisplay" contenteditable="true"></div>
<div class="legend">
<h3>Legend:</h3>
<div class="legend-item"><strong>#</strong> - Wall</div>
<div class="legend-item"><strong>.</strong> - Floor</div>
<div class="legend-item"><strong>+</strong> - Door</div>
<div class="legend-item"><strong>@</strong> - Player Start</div>
<div class="legend-item"><strong>$</strong> - Treasure</div>
<div class="legend-item"><strong>!</strong> - Monster</div>
<div class="legend-item"><strong>^</strong> - Trap</div>
</div>
</div>
<script type="module" src="./dungeon_studio.js"></script>
</body>
</html>