Merge pull request #44 from utkarsh0903/bugfix/song-pause-button

Bugfix/song pause button
adityakmrmishra · Oct 10, 2023 · cb5228d · cb5228d
2 parents f452072 + 16918d5
commit cb5228d
Showing 1 changed file with 54 additions and 27 deletions.
diff --git a/script.js b/script.js
@@ -339,36 +339,63 @@ let index = 0;
 let poster_master_play = document.getElementById('poster_master_play');
 let tite = document.getElementById('title');
 let download_music = document.getElementById('download_music');
+let isPlaying=false;
+let pausedTime = 0; // Initialize to 0
+let pausedIndex = 0;
+let playingIndex = 0;
 
 Array.from(document.getElementsByClassName('playlistplay')).forEach((e)=>{
     e.addEventListener('click', (el)=>{
-        index = el.target.id;
-        // console.log(index);
-        music.src = `audio/${index}.mp3`;
-        poster_master_play.src=`img/${index}.jpg`;
-        music.play();
-        wave.classList.add('active2')
-        masterplay.classList.remove('bi-play-fill')
-        masterplay.classList.add('bi-pause-fill')
-        // download
-        download_music.href =`audio/${index}.mp3`;
-
-        let songTitles = songs.filter((ele)=>{
-              return ele.id == index;
-        });
-
-        songTitles.forEach(elem =>{
-            let {songName} = elem;
-            title.innerHTML= songName;
-            download_music.setAttribute('download',songName);
-        });
-
-        makeAllBackground();
-        Array.from(document.getElementsByClassName('songItem'))[index-1].style.background="rgb(105, 105, 170, .1)";
-
-        makeAllPlay();
-        el.target.classList.remove('bi-play-circle-fill');
-        el.target.classList.add('bi-pause-circle-fill');
+        //If paused then play and if playing then pause through icon
+
+        if (isPlaying ){
+
+            music.pause();
+            pausedTime=music.currentTime;
+            pausedIndex=playingIndex;
+            wave.classList.remove('active2');
+            masterplay.classList.add('bi-play-fill');
+            masterplay.classList.remove('bi-pause-fill');
+            makeAllPlay();
+        }
+        else{
+            index = el.target.id;
+            // console.log(pauseTime);
+            music.src = `audio/${index}.mp3`;
+            poster_master_play.src=`img/${index}.jpg`;
+            // download
+            download_music.href =`audio/${index}.mp3`;
+            let songTitles = songs.filter((ele)=>{
+                return ele.id == index;
+            });
+
+            songTitles.forEach(elem =>{
+                let {songName} = elem;
+                title.innerHTML= songName;
+                download_music.setAttribute('download',songName);
+            });
+
+            makeAllBackground();
+            Array.from(document.getElementsByClassName('songItem'))[index-1].style.background="rgb(105, 105, 170, .1)";
+
+            if(index==pausedIndex){
+                music.currentTime=pausedTime; //Initialize time with paused time.
+            }
+            else{
+                music.currentTime=0;
+            }
+
+            music.play();
+            playingIndex=index;
+            wave.classList.add('active2')
+            masterplay.classList.remove('bi-play-fill')
+            masterplay.classList.add('bi-pause-fill')            
+
+            makeAllPlay();
+            el.target.classList.remove('bi-play-circle-fill');
+            el.target.classList.add('bi-pause-circle-fill');
+        }
+        isPlaying=!isPlaying;
     })
 })