Thomas/Bratonien-Adventskalender
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

adventskalender/shared/js/glitter.js aktualisiert

Browse Source
This commit is contained in:
Thomas Dannenberg
2025-11-04 21:22:10 +00:00
parent d5168cc15a
commit 195a5c16d7
1 changed files with 12 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
adventskalender/shared/js/glitter.js
View File

@@ -1,26 +1,21 @@
// Bratonien Glitter Hover Effekt – für .door, .openfield und .fluegel // Bratonien Glitter Hover Effekt – für .door, .openfield und .fluegel
document.querySelectorAll(".door, .openfield, .fluegel").forEach(elem => { document.querySelectorAll(".door, .openfield, .fluegel").forEach(elem => {
let canvas, ctx, particles = [], anim, hovering = false; let canvas, ctx, particles = [], anim, hovering = false;
let cursorX = 0, cursorY = 0; let cursorX = 0, cursorY = 0;
const day = elem.dataset.day; const day = elem.dataset.day;
let partner = null; const partnerElems = new Set();
let openfield = null;
// Partner zuweisen
if (elem.classList.contains("door")) { if (elem.classList.contains("door")) {
partner = document.querySelector(`.openfield[data-day="${day}"]`); document.querySelectorAll(`.openfield[data-day="${day}"]`).forEach(e => partnerElems.add(e));
} else if (elem.classList.contains("openfield")) {
partner = document.querySelector(`.door[data-day="${day}"]`);
} else if (elem.classList.contains("fluegel")) {
const isLeft = elem.classList.contains("left");
const isRight = elem.classList.contains("right");
if (isLeft) {
partner = document.querySelector(`.fluegel.right[data-day="${day}"]`);
} else if (isRight) {
partner = document.querySelector(`.fluegel.left[data-day="${day}"]`);
} }
openfield = document.querySelector(`.openfield[data-day="${day}"]`); if (elem.classList.contains("openfield")) {
document.querySelectorAll(`.door[data-day="${day}"], .fluegel[data-day="${day}"]`).forEach(e => partnerElems.add(e));
}
if (elem.classList.contains("fluegel")) {
document.querySelectorAll(`.fluegel[data-day="${day}"]:not(.${elem.classList.contains("left") ? "left" : "right"})`).forEach(e => partnerElems.add(e));
document.querySelectorAll(`.openfield[data-day="${day}"]`).forEach(e => partnerElems.add(e));
} }
function setupCanvas() { function setupCanvas() {
@@ -95,8 +90,7 @@ document.querySelectorAll(".door, .openfield, .fluegel").forEach(elem => {
cancelAnimationFrame(anim); cancelAnimationFrame(anim);
draw(); draw();
if (partner) partner.classList.add("hover-proxy"); partnerElems.forEach(p => p.classList.add("hover-proxy"));
if (openfield) openfield.classList.add("hover-proxy");
}); });
// HOVER ENDE // HOVER ENDE
@@ -110,7 +104,6 @@ document.querySelectorAll(".door, .openfield, .fluegel").forEach(elem => {
} }
}, 300); }, 300);
if (partner) partner.classList.remove("hover-proxy"); partnerElems.forEach(p => p.classList.remove("hover-proxy"));
if (openfield) openfield.classList.remove("hover-proxy");
}); });
}); });