106 lines
3.6 KiB
JavaScript
106 lines
3.6 KiB
JavaScript
/* boot splash — a short systemd/Arch-Linux-style boot, shown once per session
|
|
(first visit + every new tab). pjax means it never replays on navigation.
|
|
click or press any key to skip. safe: head fallback timeout clears it. */
|
|
(function () {
|
|
var html = document.documentElement;
|
|
if (!html.classList.contains("booting")) return;
|
|
var boot = document.getElementById("boot");
|
|
var log = boot && boot.querySelector(".boot__log");
|
|
|
|
var ended = false;
|
|
function done() {
|
|
if (ended) return;
|
|
ended = true;
|
|
document.removeEventListener("keydown", skip, true);
|
|
document.removeEventListener("click", skip, true);
|
|
try { sessionStorage.setItem("kgv_booted", "1"); } catch (e) {}
|
|
if (!boot) { html.classList.remove("booting"); return; }
|
|
boot.style.transition = "opacity .3s ease";
|
|
boot.style.opacity = "0";
|
|
setTimeout(function () {
|
|
html.classList.remove("booting");
|
|
if (boot.parentNode) boot.parentNode.removeChild(boot);
|
|
}, 300);
|
|
}
|
|
function skip() { done(); }
|
|
|
|
if (!log) { done(); return; }
|
|
document.addEventListener("keydown", skip, true);
|
|
document.addEventListener("click", skip, true);
|
|
|
|
// [type, text, delay-after-ms]. type: 'k' plain kernel/info, 'ok' green [ OK ],
|
|
// 'st' "Starting…", 'b' blank, 'd' dim.
|
|
var L = [
|
|
["k", "karimgabrielevarano.xyz 1.0 (tty1)", 90],
|
|
["d", "kgv-sh · hugo static runtime · pjax router", 320],
|
|
["b", "", 60],
|
|
["k", "Welcome to karimgabrielevarano.xyz", 120],
|
|
["ok", "Loaded index.html", 70],
|
|
["ok", "Loaded css/bundle.css", 60],
|
|
["ok", "Loaded fonts/iosevka-curly-slab.woff2", 90],
|
|
["ok", "Loaded js/bundle.js", 80],
|
|
["ok", "Parsed DOM — 0 errors", 120],
|
|
["st", "Mounting routes...", 240],
|
|
["ok", "Mounted /", 50],
|
|
["ok", "Mounted /portfolio", 50],
|
|
["ok", "Mounted /about", 50],
|
|
["ok", "Mounted /studio", 50],
|
|
["ok", "Mounted /openbureau", 50],
|
|
["ok", "Mounted /cv", 50],
|
|
["ok", "Mounted /colophon", 110],
|
|
["st", "Prerendering portfolio...", 220],
|
|
["ok", "rendered portfolio/textilsteinwerk", 60],
|
|
["ok", "rendered portfolio/the-shadow-over-emmen", 60],
|
|
["ok", "rendered portfolio/studytrip-trieste", 60],
|
|
["ok", "rendered portfolio/dojo", 60],
|
|
["ok", "rendered portfolio/museo", 110],
|
|
["ok", "Hydrated shell · cursor · theme", 100],
|
|
["ok", "Reached target Interactive.", 260],
|
|
["b", "", 110],
|
|
["k", "karimgabrielevarano login: karim (automatic)", 180],
|
|
["k", "welcome_", 500]
|
|
];
|
|
|
|
function render(item) {
|
|
var type = item[0], text = item[1];
|
|
var line = document.createElement("div");
|
|
line.className = "boot__line";
|
|
if (type === "ok") {
|
|
var s = document.createElement("span");
|
|
s.className = "boot__ok";
|
|
s.textContent = "[ OK ] ";
|
|
line.appendChild(s);
|
|
line.appendChild(document.createTextNode(text));
|
|
} else if (type === "st") {
|
|
line.className += " boot__dim";
|
|
line.appendChild(document.createTextNode("[ ] " + text));
|
|
} else if (type === "d") {
|
|
line.className += " boot__dim";
|
|
line.textContent = text;
|
|
} else if (type === "b") {
|
|
line.innerHTML = " ";
|
|
} else {
|
|
line.textContent = text;
|
|
}
|
|
log.appendChild(line);
|
|
boot.scrollTop = boot.scrollHeight; // keep the newest line in view
|
|
}
|
|
|
|
var reduce = window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
|
|
if (reduce) {
|
|
L.forEach(render);
|
|
setTimeout(done, 700);
|
|
return;
|
|
}
|
|
|
|
var i = 0;
|
|
(function next() {
|
|
if (ended) return;
|
|
if (i >= L.length) { setTimeout(done, 450); return; }
|
|
var item = L[i];
|
|
render(item);
|
|
i++;
|
|
setTimeout(next, item[2] || 110);
|
|
})();
|
|
})();
|