Update audio.js

audio.js

@@ -1,28 +1,21 @@
-document.addEventListener('DOMContentLoaded', function () {
-  const movieContainers = document.querySelectorAll('.movie');
+document.addEventListener('DOMContentLoaded', function() {
+    const searchBar = document.getElementById('searchBar');
+    const songNames = document.querySelectorAll('h1[style="font-size: 28px;"]');
+    const descriptions = document.querySelectorAll('p[style="font-size: 20px;"]');
+    
 
-  movieContainers.forEach(function (container) {
-    container.addEventListener('click', function () {
-      const audio = this.querySelector('audio');
+    searchBar.addEventListener('input', function() {
+        const searchText = searchBar.value.toLowerCase();
 
-      // Pause all other audio elements except the one clicked
-      movieContainers.forEach(function (otherContainer) {
-        const otherAudio = otherContainer.querySelector('audio');
-        if (otherAudio !== audio && !otherAudio.paused) {
-          otherAudio.pause();
-          otherAudio.classList.add('d-none'); // Hide other audio elements
-        }
-      });
+        songNames.forEach((song, index) => {
+            const songName = song.textContent.toLowerCase();
+            const description = descriptions[index].textContent.toLowerCase();
 
-      // If audio is paused or not already playing, play it
-      if (audio.paused) {
-        audio.play();
-      } else {
-        audio.pause();
-      }
-
-      // Toggle the display of the audio element
-      audio.classList.toggle('d-none');
+            if (songName.includes(searchText) || description.includes(searchText)) {
+                song.parentElement.parentElement.style.display = 'block';
+            } else {
+                song.parentElement.parentElement.style.display = 'none';
+            }
+        });
     });
-  });
 });