astro/public/scripts/sound.js

@@ -1,18 +1,22 @@
+const clickSound = new Audio(
+  "/assets/sounds/ui/zapsplat_multimedia_button_click_004_68776.mp3"
+);
+const hoverSound = new Audio(
+  "/assets/sounds/ui/zapsplat_multimedia_button_click_bright_002_92099.mp3"
+);
+
 // Sound effects
 function PlaySound(soundobj) {
-  const thissound = document.getElementById(soundobj);
-  thissound.play();
+  const thisSound = document.getElementById(soundobj);
+  thisSound.play();
 }
 
 function StopSound(soundobj) {
-  const thissound = document.getElementById(soundobj);
-  thissound.pause();
-  thissound.currentTime = 0;
+  const thisSound = document.getElementById(soundobj);
+  thisSound.pause();
+  thisSound.currentTime = 0;
 }
 
-const audio = new Audio(
-  "/assets/sounds/ui/zapsplat_multimedia_button_click_004_68776.mp3"
-);
 const buttons = document.querySelectorAll("button");
 const links = document.querySelectorAll("a");
 const image = document.querySelectorAll("img");
@@ -20,20 +24,39 @@ const image = document.querySelectorAll("img");
 // biome-ignore lint/complexity/noForEach: <explanation>
 links.forEach((a) => {
   a.addEventListener("click", () => {
-    audio.play();
+    clickSound.play();
+  });
+  a.addEventListener("mouseover", () => {
+    hoverSound.play();
   });
 });
 
 // biome-ignore lint/complexity/noForEach: <explanation>
 buttons.forEach((button) => {
   button.addEventListener("click", () => {
-    audio.play();
+    clickSound.play();
   });
+  /*
+  button.addEventListener("mouseover", () => {
+    hoverSound.play();
+  });
+  button.addEventListener("momouseoutuseover", () => {
+    hoverSound.stop();
+  });
+  */
 });
 
 // biome-ignore lint/complexity/noForEach: <explanation>
 image.forEach((button) => {
   button.addEventListener("click", () => {
-    audio.play();
+    clickSound.play();
   });
+  /*
+  button.addEventListener("mouseover", () => {
+    hoverSound.play();
+  });
+  button.addEventListener("mouseout", () => {
+    hoverSound.stop();
+  });
+  */
 });