62 lines
2.0 KiB
HTML
62 lines
2.0 KiB
HTML
<!doctype html>
|
|
<html>
|
|
|
|
<head>
|
|
<title>shoe says hi!</title>
|
|
<link rel="stylesheet" href="walkers.css">
|
|
</head>
|
|
<body>
|
|
|
|
<div id="page-content">
|
|
<h1>this page wildly under construction</h1>
|
|
<p>aka i am gonna be repeatedly redoing like everything</p>
|
|
|
|
<div id="hi">
|
|
<h1>hi, i'm shoe.</h1>
|
|
<p>i hope you like this place!</p>
|
|
</div>
|
|
|
|
<div id="about-shoe">
|
|
<h1>about shoe</h1>
|
|
<ul>
|
|
<li>they/them</li>
|
|
<li>i like sysadmin</li>
|
|
<li>TODO: I really need this section to not read like garbo<li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div id="controls">
|
|
<h1>controls</h1>
|
|
<p>mess with the random walkers</p>
|
|
<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>
|
|
<p>if you want, you can <button id="button-hide-page">hide</button> the page to just watch the random walk</p>
|
|
</div>
|
|
|
|
<div id="inspiration">
|
|
<h1>inspiration</h1>
|
|
<p>gotta cite your sources >w<</p>
|
|
<ul>
|
|
<li><a href="/~nebula"> ~nebula's homepage</a> is beautiful and convinced me to make a lot of empty space, including the right-aligned elements</li>
|
|
<li><a href="https://jackmckew.dev/interactive-random-walkers-with-javascript.html" target="_blank">Jack McKew's blogpost</a> about random walkers in js was my starting point, even though mine looks nothing like theirs</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="page-content-hidden">
|
|
<button id="button-unhide-page">unhide</button>
|
|
</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>
|