diff options
Diffstat (limited to 'assets/js/transitions.js')
| -rw-r--r-- | assets/js/transitions.js | 90 |
1 files changed, 45 insertions, 45 deletions
diff --git a/assets/js/transitions.js b/assets/js/transitions.js index 3955a67..a8042b8 100644 --- a/assets/js/transitions.js +++ b/assets/js/transitions.js @@ -2,61 +2,61 @@ const displacement = document.getElementById("displacement"); const noise = document.getElementById("noise"); -var nextFunc = () => {} +var nextFunc = () => { } function transitionOut(callback) { - document.body.style.filter = "url(#transition)" - const src = new Number(displacement.getAttribute("scale")); - noise.setAttribute("seed",Math.random() * 1000) - if (src < 100) { - displacement.setAttribute("scale", src + 20 + src); - nextFunc = () => transitionOut(callback) - requestAnimationFrame(nextFunc) - } else { - setTimeout(() =>{ - document.body.style.filter = "" - },1000); - callback() - } + document.body.style.filter = "url(#transition)" + const src = new Number(displacement.getAttribute("scale")); + noise.setAttribute("seed", Math.random() * 1000) + if (src < 100) { + displacement.setAttribute("scale", src + 20 + src); + nextFunc = () => transitionOut(callback) + requestAnimationFrame(nextFunc) + } else { + setTimeout(() => { + document.body.style.filter = "" + }, 1000); + callback() + } } function transitionIn() { - document.body.style.filter = "url(#transition)" - const src = new Number(displacement.getAttribute("scale")); - noise.setAttribute("seed",Math.random() * 1000) - if (src > 0) { - displacement.setAttribute("scale", src - 1 - (Math.max(src,1)/4)); - nextFunc = () => transitionIn(); - requestAnimationFrame(nextFunc) - } else { - displacement.setAttribute("scale", 0); - document.body.style.filter = "" - } + document.body.style.filter = "url(#transition)" + const src = new Number(displacement.getAttribute("scale")); + noise.setAttribute("seed", Math.random() * 1000) + if (src > 0) { + displacement.setAttribute("scale", src - 1 - (Math.max(src, 1) / 4)); + nextFunc = () => transitionIn(); + requestAnimationFrame(nextFunc) + } else { + displacement.setAttribute("scale", 0); + document.body.style.filter = "" + } } if (noise && displacement) { - displacement.setAttribute("scale", 200); - transitionIn() - const links = document.querySelectorAll("a"); - links.forEach(l => { - if (l.hasAttribute("no-transition")) return; - if (l.href.startsWith(location.origin)) { - l.addEventListener("click", (e)=>{ - e.preventDefault() - displacement.setAttribute("scale", 0); - transitionOut(() => { - location.href = l.href - }); - }) - } - }) + displacement.setAttribute("scale", 200); + transitionIn() + const links = document.querySelectorAll("a"); + links.forEach(l => { + if (l.hasAttribute("no-transition")) return; + if (l.href.startsWith(location.origin)) { + l.addEventListener("click", (e) => { + e.preventDefault() + displacement.setAttribute("scale", 0); + transitionOut(() => { + location.href = l.href + }); + }) + } + }) } else { - console.log("Can't do transitions!!") + console.log("Can't do transitions!!") } // for when going forwards or back window.addEventListener("pageshow", (e) => { - if (e.persisted) { - displacement.setAttribute("scale", 200); - transitionIn(); - } + if (e.persisted) { + displacement.setAttribute("scale", 200); + transitionIn(); + } }); |
