-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
40 lines (39 loc) · 1.74 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<html>
<head>
<meta charset=UTF-8>
<link href="https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap" rel="stylesheet">
<link href="https://unpkg.com/[email protected]/css/nes.min.css" rel="stylesheet" />
<link href="/css/style.css" rel="stylesheet" />
</head>
<body style="background: lightblue;">
<h1>Pathfinding</h1>
<section class="nes-container">
<div class="containers">
<div class="draw nes-container with-title">
<h2 class="title">Canvas</h2>
<canvas id="canvas" width="401px" height="401px" oncontextmenu="return false" style="background: white;"></canvas>
</div>
<div class="config nes-container with-title">
<h2 class="title">Config</h2>
<div class="buttons nes-container">
<button class="nes-btn" id="wallTileButton">Wall Tile</button>
<button class="nes-btn" id="waterTileButton">Water Tile</button>
<button class="nes-btn" id="selectObjectiveButton">Objective</button>
<button class="nes-btn" id="resetButton">Reset</button>
</div>
<div class="nes-container">
<input type="range" min="1" max="20" value=5 id="widthSlider">
<input type="range" min="1" max="20" value=5 id="heightSlider">
</div>
</div>
</div>
<img id="test"></img>
</section>
<footer>
CSS Framework : <a href="https://github.com/nostalgic-css/NES.css">NES.css</a></br>
Medieval Tilesheet : <a href="https://www.kenney.nl">Kenney</a></br>
Pathfinding Algorithms : <a href="https://www.redblobgames.com/pathfinding/a-star/introduction.html">Amit Patel at Red Blob Game</a>
</footer>
<script src="src/main.ts"></script>
</body>
</html>