From a94b4c6c9dde7d4d235a724fc2d3bff70db04c4e Mon Sep 17 00:00:00 2001
From: Michael DiBernardo <mikedebo@gmail.com>
Date: Mon, 26 Aug 2024 16:17:50 -0400
Subject: [PATCH] Make "bugs" happydance.

---
 main.js   | 35 ++++++++++++++++++++++++++---------
 style.css | 16 ++++++++++++++++
 2 files changed, 42 insertions(+), 9 deletions(-)

diff --git a/main.js b/main.js
index f321d5c..c6198c8 100644
--- a/main.js
+++ b/main.js
@@ -90,21 +90,19 @@ document.addEventListener("DOMContentLoaded", () => {
 
   function flingRock(event) {
     const rock = event.currentTarget;
-    const angle = Math.random() * Math.PI * 2;
-    const distance = 1000 + Math.random() * 1000;
-    const duration = 500 + Math.random() * 500;
+    const rockContainer = rock.closest(".rock-container");
+    const bug = rockContainer.querySelector(".bug");
 
-    rock.style.transform = `translate(${Math.cos(angle) * distance}px, ${
-      Math.sin(angle) * distance
-    }px) rotate(${Math.random() * 720 - 360}deg)`;
-    rock.style.opacity = "0";
-    rock.style.transition = `all ${duration}ms cubic-bezier(0.25, 0.1, 0.25, 1)`;
+    const rockFlingDuration = 500 + Math.random() * 500;
+
+    animateRock(rock, rockFlingDuration);
 
     rockSounds[Math.floor(Math.random() * rockSounds.length)].play();
 
     setTimeout(() => {
       rock.remove();
-    }, duration);
+      happyDance(bug);
+    }, rockFlingDuration);
   }
 
   function initialize() {
@@ -123,3 +121,22 @@ document.addEventListener("DOMContentLoaded", () => {
 
   initialize();
 });
+
+function happyDance(bug) {
+  bug.classList.add("pulsing");
+
+  setTimeout(() => {
+    bug.classList.remove("pulsing");
+  }, 5000);
+}
+
+function animateRock(rock, duration) {
+  const angle = Math.random() * Math.PI * 2;
+  const distance = 1000 + Math.random() * 1000;
+
+  rock.style.transform = `translate(${Math.cos(angle) * distance}px, ${
+    Math.sin(angle) * distance
+  }px) rotate(${Math.random() * 720 - 360}deg)`;
+  rock.style.opacity = "0";
+  rock.style.transition = `all ${duration}ms cubic-bezier(0.25, 0.1, 0.25, 1)`;
+}
diff --git a/style.css b/style.css
index 35e6d10..5275c6e 100644
--- a/style.css
+++ b/style.css
@@ -149,3 +149,19 @@ body {
   z-index: 1;
   z-index: 50;
 }
+
+@keyframes pulse {
+  0% {
+    transform: scale(1);
+  }
+  50% {
+    transform: scale(1.2);
+  }
+  100% {
+    transform: scale(1);
+  }
+}
+
+.bug.pulsing {
+  animation: pulse 0.5s ease-in-out infinite;
+}