From e64464863010b20219ef89c42c48f7ef1c0c286e Mon Sep 17 00:00:00 2001
From: Thomas Dannenberg <kontakt@bratonien.de>
Date: Tue, 4 Nov 2025 12:36:13 +0000
Subject: [PATCH] adventskalender/shared/js/glitter.js aktualisiert

---
 adventskalender/shared/js/glitter.js | 25 ++++++++++++++++---------
 1 file changed, 16 insertions(+), 9 deletions(-)

diff --git a/adventskalender/shared/js/glitter.js b/adventskalender/shared/js/glitter.js
index baf0cec..9d9d358 100644
--- a/adventskalender/shared/js/glitter.js
+++ b/adventskalender/shared/js/glitter.js
@@ -1,6 +1,7 @@
-// Bratonien Glitter Hover Effekt – Partikel explodieren aus dem Zentrum
+// Bratonien Glitter Hover Effekt – Explosion folgt dem Cursor
 document.querySelectorAll(".door").forEach(door => {
   let canvas, ctx, particles = [], anim, hovering = false;
+  let cursorX = 0, cursorY = 0;
 
   // Canvas vorbereiten
   function setupCanvas() {
@@ -17,13 +18,20 @@ document.querySelectorAll(".door").forEach(door => {
     ctx = canvas.getContext("2d");
   }
 
-  // Partikel hinzufügen (Explosion aus dem Zentrum)
+  // Cursorposition innerhalb des Türchens erfassen
+  door.addEventListener("mousemove", e => {
+    const rect = door.getBoundingClientRect();
+    cursorX = (e.clientX - rect.left) * 1.4 - (door.offsetWidth * 0.2);
+    cursorY = (e.clientY - rect.top) * 1.4 - (door.offsetHeight * 0.2);
+  });
+
+  // Partikel hinzufügen (Explosion folgt Cursor)
   function addParticles() {
-    const cx = canvas.width / 2;
-    const cy = canvas.height / 2;
+    const cx = cursorX || canvas.width / 2;
+    const cy = cursorY || canvas.height / 2;
     for (let i = 0; i < 4; i++) {
-      const angle = Math.random() * Math.PI * 2; // 360°
-      const speed = Math.random() * 1.5 + 0.3;   // Unterschiedliche Energie
+      const angle = Math.random() * Math.PI * 2;
+      const speed = Math.random() * 1.5 + 0.3;
       particles.push({
         x: cx,
         y: cy,
@@ -40,7 +48,6 @@ document.querySelectorAll(".door").forEach(door => {
   // Zeichnen
   function draw() {
     ctx.clearRect(0, 0, canvas.width, canvas.height);
-
     if (hovering) addParticles();
 
     particles.forEach(p => {
@@ -55,8 +62,8 @@ document.querySelectorAll(".door").forEach(door => {
 
       // Bewegung – Explosion + leichte Gravitation
       p.x += p.vx;
-      p.y += p.vy + 0.05; // leichte Schwerkraft
-      p.vx *= 0.98;       // Reibung
+      p.y += p.vy + 0.05;
+      p.vx *= 0.98;
       p.vy *= 0.98;
       p.alpha -= p.decay;
       p.life--;