random-walkers/index.html

41 lines
1.3 KiB
HTML

<!doctype html>
<html>
<head>
<title>walkers!</title>
<link rel="stylesheet" href="walkers.css">
</head>
<body>
<div id="page-content">
<h1>a demo of my random walker javascript</h1>
<p>code started out from <a href="https://jackmckew.dev/interactive-random-walkers-with-javascript.html" target="_blank">Jack McKew's blogpost</a>, but very few parts of that original is left</p>
<h2>walker controls</h2>
<ul>
<li><button id="button-create-walker">create one</button></li>
<li><button id="button-destroy-walker">kill one :(</button></li>
<li><button id="button-reset-walkers">kill them all D:</button></li>
</ul>
<h2>hide text</h2>
<p>click to hide all page contents: <button id="button-hide-page">hide</button></p>
</div>
<div id="page-content-hidden">
<button id="button-unhide-page">unhide</button>
<button id="button-hide-everything">hide more</button>
<p>if you click "hide more" it'll hide all this too, and you'll need to reload to get it back
</div>
<!-- this is the canvas that makes up the page background -->
<div id="canvas-container">
<canvas id="walker-canvas"></canvas>
</div>
</body>
<script src="walkers.js" walkers></script>
<script src="hidepage.js" hidepage></script>
</html>