Merge pull request #62 from priyanshu-buwade/main

Added Time Stamp (Audio Length) in the list of songs in "My Songs" page.

assets/mysongsscript.js

@@ -12,8 +12,8 @@ const currTime = document.querySelector('#currTime');
 const durTime = document.querySelector('#durTime');
 
 // Song titles
-const songs = ['Mere Naam Tu','Deva Deva','Alkananda','Kesariya','Perfect','Prithibi Ta Naki Chhoto Hote Hote', 'Tum Se Hi', 'Ek Purono Masjide','Kisi Se Pyar Ho Jaye','Bhuter Raja Dilo Bor','faded', 'Beche Thakar Gaan',
-'Abar-Phire-Ele','Boba-Tunnel','Ei Sraabon','Apna-Bana-Le','Tere Hawaale','Ami shei manushta r nei'];;
+const songs = ['Mere Naam Tu', 'Deva Deva', 'Alkananda', 'Kesariya', 'Perfect', 'Prithibi Ta Naki Chhoto Hote Hote', 'Tum Se Hi', 'Ek Purono Masjide', 'Kisi Se Pyar Ho Jaye', 'Bhuter Raja Dilo Bor', 'Faded', 'Beche Thakar Gaan',
+  'Abar-Phire-Ele', 'Boba-Tunnel', 'Ei Sraabon', 'Apna-Bana-Le', 'Tere Hawaale', 'Ami shei manushta r nei'];
 // Keep track of song 
 let songIndex = songs.length - 1;
 
@@ -220,6 +220,37 @@ audio.addEventListener('ended', () => {
 audio.addEventListener('timeupdate', DurTime);
 
 
+function songDurTime(songDuration) {
+  var sec_duration;
+
+  // Define minutes duration
+  let min_duration = (isNaN(songDuration) === true) ? '0' :
+    Math.floor(songDuration / 60);
+  min_duration = min_duration < 10 ? '0' + min_duration : min_duration;
+
+  // Function to calculate seconds duration
+  function get_sec_d(x) {
+    if (Math.floor(x) >= 60) {
+      for (var i = 1; i <= 60; i++) {
+        if (Math.floor(x) >= (60 * i) && Math.floor(x) < (60 * (i + 1))) {
+          sec_duration = Math.floor(x) - (60 * i);
+          sec_duration = sec_duration < 10 ? '0' + sec_duration : sec_duration;
+        }
+      }
+    } else {
+      sec_duration = (isNaN(songDuration) === true) ? '0' :
+        Math.floor(x);
+      sec_duration = sec_duration < 10 ? '0' + sec_duration : sec_duration;
+    }
+  }
+
+  // Call the function to calculate seconds duration
+  get_sec_d(songDuration);
+
+  // Return the formatted duration string (MM:SS)
+  return min_duration + ':' + sec_duration;
+}
+
 // Adding List Of Songs In "My Audio" Page
 let x = 1;
 for (let i in songs) {
@@ -243,9 +274,26 @@ for (let i in songs) {
   songname.className = 'song-name';
   songname.innerHTML = songs[i];
 
+  const songName = document.createElement('audio');
+  songName.src = `../music/${songs[i]}.mp3`;
+
+  let songduration = document.createElement('div');
+  songduration.className = 'song-duration';
+
+  // Wait for the audio to load before getting the duration
+  songName.addEventListener('loadedmetadata', function() {
+    console.log('loadedmetadata event triggered');
+    let songDuration = songName.duration;
+    songduration.innerHTML = songDurTime(songDuration);
+  });
+
+  // Load the audio to trigger the 'loadedmetadata' event
+  songName.load();
+
   layout.appendChild(songnumber);
   layout.appendChild(songimage);
   layout.appendChild(songname);
+  layout.appendChild(songduration);
 
   songList.appendChild(layout);
   x++;