Update public/script.js

public/script.js

@@ -31,6 +31,7 @@ function loadMusicList() {
                     trackList.push(track.filename); // Populate trackList
                     const musicItem = document.createElement('div');
                     musicItem.classList.add('music-item');
+                    musicItem.setAttribute('data-filename', track.filename); // Add this line
 
                     const playButton = document.createElement('button');
                     playButton.innerHTML = '▶';
@@ -52,6 +53,17 @@ function loadMusicList() {
         });
 }
 
+function updatePlayingIndicator() {
+    const musicItems = document.querySelectorAll('.music-item');
+    musicItems.forEach(item => {
+        if (item.getAttribute('data-filename') === currentPlaying) {
+            item.style.boxShadow = '0 0 15px #00ff00'; // Green box shadow
+        } else {
+            item.style.boxShadow = ''; // Remove box shadow from other items
+        }
+    });
+}
+
 function playMusic(fileName) {
     if (isLoadingMusic || fileName === currentPlaying) {
         console.log("This song is already loading or playing.");
@@ -60,6 +72,7 @@ function playMusic(fileName) {
 
     isLoadingMusic = true;
     currentPlaying = fileName;
+    updatePlayingIndicator();
 
     const player = document.getElementById('audio-player');