diff options
author | Dante Catalfamo | 2025-01-08 19:02:07 -0500 |
---|---|---|
committer | Dante Catalfamo | 2025-01-08 19:02:07 -0500 |
commit | 66292c0e95236a024f61439465d8992ebfb49b1f (patch) | |
tree | ff0645114eb45ac1a2d3b1e4b64fe5b9f95d0a60 | |
parent | 428b349e7ededbfa8ed49d4ed16f30e5f510f519 (diff) | |
download | homepage-66292c0e95236a024f61439465d8992ebfb49b1f.tar.gz homepage-66292c0e95236a024f61439465d8992ebfb49b1f.tar.bz2 homepage-66292c0e95236a024f61439465d8992ebfb49b1f.zip |
Add trail
-rw-r--r-- | public/index.html | 2 | ||||
-rw-r--r-- | public/style.css | 21 | ||||
-rw-r--r-- | public/trail.js | 56 |
3 files changed, 79 insertions, 0 deletions
diff --git a/public/index.html b/public/index.html index fe530fb..0d71224 100644 --- a/public/index.html +++ b/public/index.html @@ -10,6 +10,7 @@ </style> </head> <body> + <div id="chars"></div> <div class="bigguy"> <pre class="lambda"></pre> <div class="linkbox"> @@ -22,5 +23,6 @@ </div> <script src="lambda.js"></script> <script src="braille.js"></script> + <script src="trail.js"></script> </body> </html> diff --git a/public/style.css b/public/style.css index fd93835..c87c349 100644 --- a/public/style.css +++ b/public/style.css @@ -45,3 +45,24 @@ body { display: block; } } +/* Char trail */ +#chars { + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; +} +.chr { + position: absolute; + user-select: none; + font-family: monospace, monospace; + color: #00000000; + animation-name: fade; + animation-duration: 2s; +} + +@keyframes fade { + from { color: limegreen; } + to { color: #00000000 } +} diff --git a/public/trail.js b/public/trail.js new file mode 100644 index 0000000..6cafc7d --- /dev/null +++ b/public/trail.js @@ -0,0 +1,56 @@ +let mouseText = `char * +auth_mkvalue(char *value) +{ + char *big, *p; + + big = malloc(strlen(value) * 4 + 1); + if (big == NULL) + return (NULL); + + for (p = big; *value; ++value) { + switch (*value) { + case '\r': + *p++ = '\\'; +`; + +const textUrl = "https://raw.githubusercontent.com/openbsd/src/refs/heads/master/lib/libc/gen/authenticate.c"; + +fetch(textUrl).then(body => { + body.text().then(text => { + mouseText = text.substring(text.indexOf("#include")).replaceAll(/\s+/g, " "); + }); +}); + +const grid = document.getElementById("chars"); +const minDistance = 4; +const disappearTime = 2000; +let curChar = 0; +let lastX = 0; +let lastY = 0; + +window.addEventListener("mousemove", (event) => { + const x = event.pageX; + const y = event.pageY; + const diffX = Math.abs(lastX-x); + const diffY = Math.abs(lastY-y); + const distance = Math.sqrt(diffX*2+diffY*2); + if (distance < minDistance) { + return; + } + lastY = y; + lastX = x; + placeText(x+"px",y+"px", "e"); +}); + +function placeText(x, y) { + const char = mouseText[curChar++ % mouseText.length]; + const el = document.createElement("div"); + el.className = "chr"; + el.style.left = x; + el.style.top = y; + el.innerText = char; + window.setTimeout(() => { + el.remove(); + }, 2000); + grid.appendChild(el); +} |