barrett/barrettruth.com
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: handle multiple clicks

Browse source
This commit is contained in:
Barrett Ruth 2024-06-08 21:00:29 -05:00
parent 3f660fcaf3
commit ad13299030
2 changed files with 48 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

10
index.html
View file

@ -10,10 +10,12 @@
</head> </head>
<body> <body>
<header> <header>
<div class="terminal-prompt"> <a href="/" onclick="refresh(event)">
<span class="prompt">barrett@ruth:~$</span> <div class="terminal-prompt">
<span class="cursor"></span> <span class="prompt">barrett@ruth:~$</span>
</div> <span class="cursor"></span>
</div>
</a>
<div class="header-links"> <div class="header-links">
<a target="_blank" href="public/resume.pdf">Resume</a> <a target="_blank" href="public/resume.pdf">Resume</a>
<a target="_blank" href="public/transcript.pdf">Transcript</a> <a target="_blank" href="public/transcript.pdf">Transcript</a>

47
scripts/index.js
View file

@ -15,7 +15,44 @@ const postMapping = new Map([
["Algorithms", ["two pointers", "convex hull"]], ["Algorithms", ["two pointers", "convex hull"]],
]); ]);
// TODO: ensure handling multiple clicks const TERMINAL_PROMPT = "barrett@ruth:~$ ";
let clearing = false;
function refresh(e) {
e.preventDefault();
const topics = document.querySelectorAll(".topic a");
topics.forEach((topic) => {
topic.classList.remove("active");
topic.style.color = "";
});
document.getElementById("posts").innerHTML = "";
const terminalPrompt = document.querySelector(".prompt");
const topicLength = terminalPrompt.innerHTML.length - TERMINAL_PROMPT.length;
function clearPrompt() {
if (clearing) return;
clearing = true;
let i = 0;
function removeChar() {
if (i++ < topicLength) {
terminalPrompt.textContent = terminalPrompt.textContent.slice(0, -1);
setTimeout(removeChar, 1000 / topicLength);
} else {
i = 0;
clearing = false;
}
}
removeChar();
}
clearPrompt();
}
function renderPosts(topic) { function renderPosts(topic) {
const posts = document.getElementById("posts"); const posts = document.getElementById("posts");
posts.innerHTML = ""; posts.innerHTML = "";
@ -32,12 +69,11 @@ function typechars(e) {
e.preventDefault(); e.preventDefault();
const topic = e.target.textContent; const topic = e.target.textContent;
const terminalText = ` ${topic.toLowerCase()}/`; const terminalText = `${topic.toLowerCase()}/`;
const terminalPrompt = document.querySelector(".prompt"); const terminalPrompt = document.querySelector(".prompt");
terminalPrompt.innerHTML = "barrett@ruth:~$ "; terminalPrompt.innerHTML = TERMINAL_PROMPT;
let i = 0; let i = 0;
function typechar() { function typechar() {
if (i < terminalText.length) { if (i < terminalText.length) {
terminalPrompt.innerHTML += terminalText.charAt(i++); terminalPrompt.innerHTML += terminalText.charAt(i++);
@ -51,7 +87,7 @@ function typechars(e) {
} }
window.addEventListener("beforeunload", () => { window.addEventListener("beforeunload", () => {
document.querySelector(".prompt").innerHTML = "barrett@ruth:~$ "; document.querySelector(".prompt").innerHTML = TERMINAL_PROMPT;
}); });
function applyColor(topic) { function applyColor(topic) {
@ -94,6 +130,7 @@ document.addEventListener("DOMContentLoaded", function () {
}); });
topic.classList.add("active"); topic.classList.add("active");
document.getElementById("posts").innerHTML = "";
applyColor(topic); applyColor(topic);
}); });
}); });