Something went wrong. Try again.
My personal website
Something went wrong. Try again.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132/*! * Personal website of Sefa Eyeoglu * Copyright (C) 2018-2022 Sefa Eyeoglu <contact@scrumplex.net> * * This program is free software: you can redistribute it and/or modify * it under the terms of the GNU Affero General Public License as published by * the Free Software Foundation, either version 3 of the License, or * (at your option) any later version. * * This program is distributed in the hope that it will be useful, * but WITHOUT ANY WARRANTY; without even the implied warranty of * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the * GNU Affero General Public License for more details. * * You should have received a copy of the GNU Affero General Public License * along with this program. If not, see <https://www.gnu.org/licenses/>. */
import ready from "./_utils";
const mainElem = document.getElementById("main");
document.querySelectorAll(".scrumplex-logo").forEach((elem) => { elem.addEventListener("dblclick", () => { const randomRotation = Math.floor(Math.random() * 360); elem.style.transform = `rotate(${randomRotation}deg)`; });});
document.querySelectorAll("*[data-scroll]").forEach((elem) => { elem.addEventListener("click", (e) => { e.preventDefault(); const targetSelector = elem.getAttribute("data-scroll"); applyScrollSpecial(targetSelector); });});
mainElem.addEventListener("animationend", applyScrollInitially);
function applyScrollInitially() { mainElem.removeEventListener("animationend", applyScrollInitially);
window.addEventListener("scroll", applyScrollConditionally);
if (location.hash.startsWith("#")) { const result = applyScrollSpecial(location.hash); if (result) return; } applyScrollConditionally();}
function applyScrollConditionally() { if ( mainElem.getBoundingClientRect().top <= 0 || // offset to top window border mainElem.getBoundingClientRect().height >= window.innerHeight ) applyScroll();}
function applyScrollSpecial(targetSelector) { if (!targetSelector) return false; const targetElem = document.querySelector(targetSelector); if (!targetElem) return false; const offset = applyScroll(targetElem); window.scrollTo({ top: offset, behavior: "smooth" }); history.pushState({ hash: targetSelector }, "", targetSelector); return true;}
function applyScroll(scrollTarget = null) { // Black magic ahead! // We sometimes need this method to show all sheets and then scroll to one of them. // To achieve this we need to have a way to get the target position (like pixels) of // the sheet we want to scroll to (in this case it's scrollTarget). // As the bounding box always includes current transforms (so our translateY in the // fade-in animation) we need to somehow get the boundingBox while our sheet is not // being transformed. A hacky way to do this is to modify the behavior of .sheet[hidden] // depending on the state of this method. In this case we are adding .scrolled to body // which will cause all hidden sheets to instead be transparent. // Additionally we will stop any animations that would be playing then. // Now the element should be at it's target position so we just grab the position before // un-hiding the elements and voila! // One caveat: if the content changes after this method returned, the scroll might be a // bit offset.
let offset = getElementScrollOffset(scrollTarget); if (document.body.classList.contains("scrolled")) return offset;
const hiddenElems = document.querySelectorAll(".sheet[hidden]"), posMain = getElementScrollOffset(mainElem); // offset to top rel. to document
document.getElementById("wrapper").style.paddingTop = `${posMain}px`; document.body.classList.add("scrolled");
mainElem.classList.add("sheet-splashed"); mainElem.classList.remove("sheet-splash"); if (scrollTarget) // recalculate, as it probably changed because of body.scrolled offset = getElementScrollOffset(scrollTarget);
hiddenElems.forEach((elem) => { elem.removeAttribute("hidden"); });
window.removeEventListener("scroll", applyScrollConditionally); return offset;}
function startSpinningChars(fps = 4) { const spinningChars = ["|", "/", "-", "\\"], spinnerElement = document.getElementById("text-spinner");
let currentIndex = 0;
setInterval(() => { spinnerElement.innerText = spinningChars[currentIndex]; currentIndex++; if (currentIndex >= spinningChars.length) currentIndex = 0; }, 1000 / fps);
spinnerElement.removeAttribute("hidden");}
function getElementScrollOffset(elem) { if (elem) return window.pageYOffset + elem.getBoundingClientRect().top; return -1;}
ready().then(() => { startSpinningChars();});