neale/homepage
neale
/
homepage
1
0
Fork 0
Code Pull Requests Actions Activity

Add Serpenski gasket

This commit is contained in:
Neale Pickett 2020-12-24 15:47:45 -07:00
parent 3a5c46c1a5
commit ac4216f7e3
2 changed files with 76 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
toys/index.md
View File

@ -11,3 +11,4 @@ Maybe you'll just wonder why I spend so much time on this garbage.
* If you need to write someone a letter but really don't want to, try my * If you need to write someone a letter but really don't want to, try my
[social letter generator](letter.html) [social letter generator](letter.html)
* [Crunt](crunt.html) * [Crunt](crunt.html)
* [Serpenski Gasket on Tektronix Terminal](serpenski.html) which amazed 4 whole people at my high school in 1991.

75
toys/serpenski.html Normal file
View File

@ -0,0 +1,75 @@
<!DOCTYPE html>
<html>
<head>
<title>Tektronix Terminal</title>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=VT323&display=swap" rel="stylesheet">
<style>
html,
body {
background: black;
color: white;
width: 100%;
height: 100%;
margin: 0;
}
#credit {
position: fixed;
top: 20px;
left: 20px;
color: goldenrod;
font-family: VT323, monospace;
font-size: 22px;
}
</style>
<script>
lastPoint = [0, 0]
points = [[0, 0], [0, 0], [0, 0]]
interval = null
function choose(arr) {
return arr[Math.floor(Math.random() * arr.length)]
}
function midpoint(a, b) {
return [(a[0] + b[0]) / 2, (a[1] + b[1]) / 2]
}
function drawPoint() {
lastPoint = midpoint(choose(points), lastPoint)
ctx.fillRect(lastPoint[0], lastPoint[1], 2, 2)
}
function go() {
canvas = document.querySelector("canvas")
ctx = canvas.getContext("2d")
canvas.width = innerWidth
canvas.height = innerHeight
ctx.fillStyle = "goldenrod"
lastPoint = [
Math.random() * canvas.width,
Math.random() * canvas.height,
]
points = [
[canvas.width / 2, 0],
[canvas.width, canvas.height],
[0, canvas.height],
]
if (!interval) {
interval = setInterval(drawPoint, 40)
}
}
addEventListener("load", go)
addEventListener("resize", go)
</script>
</head>
<body>
<canvas></canvas>
<div id="credit">The Serpenski Gasket<br>1991 by Neale Pickett</div>
</body>
</html>