Update audio.js

audio.js

@@ -1,46 +1,41 @@
 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;"]');
-  const movieContainers = document.querySelectorAll('.movie');
+    const searchBar = document.getElementById('searchBar');
+    const movieContainers = document.querySelectorAll('.movie');
 
-  movieContainers.forEach(function (container) {
-    container.addEventListener('click', function () {
-      const audio = this.querySelector('audio');
+    searchBar.addEventListener('input', function () {
+        const searchText = searchBar.value.toLowerCase().trim();
 
-      // 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');
-        }
-      });
+        movieContainers.forEach(function (container) {
+            const title = container.querySelector('.title').textContent.toLowerCase();
+            const description = container.querySelector('.description').textContent.toLowerCase();
 
-      // Play or pause the audio based on its current state
-      if (audio.paused) {
-        audio.play();
-      } else {
-        audio.pause();
-      }
-
-      // Toggle the display of the audio element
-      audio.classList.toggle('d-none');
+            if (title.includes(searchText) || description.includes(searchText)) {
+                container.style.display = 'block';
+            } else {
+                container.style.display = 'none';
+            }
+        });
     });
-  });
 
-  searchBar.addEventListener('input', function() {
-        const searchText = searchBar.value.toLowerCase();
+    movieContainers.forEach(function (container) {
+        container.addEventListener('click', function () {
+            const audio = this.querySelector('audio');
 
-        songNames.forEach((song, index) => {
-            const songName = song.textContent.toLowerCase();
-            const description = descriptions[index].textContent.toLowerCase();
+            movieContainers.forEach(function (otherContainer) {
+                const otherAudio = otherContainer.querySelector('audio');
+                if (otherAudio !== audio && !otherAudio.paused) {
+                    otherAudio.pause();
+                    otherAudio.classList.add('d-none');
+                }
+            });
 
-            if (songName.includes(searchText) || description.includes(searchText)) {
-                song.parentElement.parentElement.style.display = 'block';
+            if (audio.paused) {
+                audio.play();
             } else {
-                song.parentElement.parentElement.style.display = 'none';
+                audio.pause();
             }
+
+            audio.classList.toggle('d-none');
         });
     });
 });