summaryrefslogtreecommitdiff
path: root/assets/js/transitions.js
diff options
context:
space:
mode:
authorElis Eriksson <spelis@spelis.li>2026-07-07 22:35:51 +0200
committerElis Eriksson <spelis@spelis.li>2026-07-07 22:35:51 +0200
commitcda6973714d3770a887df6f6ff451636919170bb (patch)
treec1113f257d9982bf6982a31fd63b251eeec421fd /assets/js/transitions.js
parentbd65a742f81157b5c4c9fe399db65a0c1838f47d (diff)
downloadspelis-web-cda6973714d3770a887df6f6ff451636919170bb.tar
spelis-web-cda6973714d3770a887df6f6ff451636919170bb.tar.gz
spelis-web-cda6973714d3770a887df6f6ff451636919170bb.tar.bz2
spelis-web-cda6973714d3770a887df6f6ff451636919170bb.tar.lz
spelis-web-cda6973714d3770a887df6f6ff451636919170bb.tar.xz
spelis-web-cda6973714d3770a887df6f6ff451636919170bb.tar.zst
spelis-web-cda6973714d3770a887df6f6ff451636919170bb.zip
more aesthetic changes + code formatting
Diffstat (limited to 'assets/js/transitions.js')
-rw-r--r--assets/js/transitions.js90
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();
+ }
});