| 1 | // 🤖 Carloku — hand-written, dependency-free. Two jobs only: |
| 2 | // 1. the hero terminal types its session once (skipped under reduced motion), |
| 3 | // 2. the sticky header grows its hairline once the page scrolls. |
| 4 | (function () { |
| 5 | "use strict"; |
| 6 | |
| 7 | var head = document.querySelector(".site-head"); |
| 8 | if (head) { |
| 9 | var onScroll = function () { |
| 10 | head.classList.toggle("scrolled", window.scrollY > 8); |
| 11 | }; |
| 12 | window.addEventListener("scroll", onScroll, { passive: true }); |
| 13 | onScroll(); |
| 14 | } |
| 15 | |
| 16 | var body = document.querySelector(".term-body"); |
| 17 | if (!body) return; |
| 18 | if (window.matchMedia("(prefers-reduced-motion: reduce)").matches) return; |
| 19 | |
| 20 | var lines = Array.prototype.slice.call(body.querySelectorAll(".line")); |
| 21 | var caretLine = lines.pop(); // trailing caret stays put until the end |
| 22 | var texts = lines.map(function (el) { return el.textContent; }); |
| 23 | // A line can hold markup — the last one's URL is a real link — and typing |
| 24 | // sets textContent, which would throw those children away. Keep the |
| 25 | // original markup and put it back the moment the line finishes. |
| 26 | var htmls = lines.map(function (el) { return el.innerHTML; }); |
| 27 | lines.forEach(function (el) { |
| 28 | el.textContent = ""; |
| 29 | el.style.display = "none"; |
| 30 | }); |
| 31 | if (caretLine) caretLine.style.display = "none"; |
| 32 | |
| 33 | var li = 0; |
| 34 | function nextLine() { |
| 35 | if (li >= lines.length) { |
| 36 | if (caretLine) caretLine.style.display = ""; |
| 37 | return; |
| 38 | } |
| 39 | var el = lines[li]; |
| 40 | var text = texts[li]; |
| 41 | var html = htmls[li]; |
| 42 | li++; |
| 43 | el.style.display = ""; |
| 44 | if (el.hasAttribute("data-type")) { |
| 45 | var ci = 0; |
| 46 | (function typeChar() { |
| 47 | if (ci <= text.length) { |
| 48 | el.textContent = text.slice(0, ci); |
| 49 | ci++; |
| 50 | setTimeout(typeChar, 14); |
| 51 | } else { |
| 52 | el.innerHTML = html; |
| 53 | setTimeout(nextLine, 160); |
| 54 | } |
| 55 | })(); |
| 56 | } else { |
| 57 | el.innerHTML = html; |
| 58 | setTimeout(nextLine, el.classList.contains("ok") ? 260 : 120); |
| 59 | } |
| 60 | } |
| 61 | setTimeout(nextLine, 450); |
| 62 | })(); |
| 63 | |
amadan