HTML Audio

Saniyeden Timestamp

1. <audio> tagi içerisindeki dosyanın uzunluğu ilk anda tam yüklenmediği için NaN olarak çıkar.
2. Ama data'nın yüklendiği anda ateşlenen olaylar vardır. Onlardan bizim için en anlamlısı onloadeddata onu algılamak için audio tagine ekliyorum. (onloadeddata iOS'ta çalışmıyor. onloadedmetadata eventini kullanabilirsin.)
   

   <audio id="ap-1" onloadeddata="audioLoaded()">
      <source src="audio.mp3" type="audio/mpeg">
   </audio>

   Copy
3. Diğer eventler için 

   <audio oncanplay="onCanPlayFunction()"
          oncanplaythrough="onCanPlayThroughFunction()"
          onloadeddata="onLoadedData()"
          src="myaudio.ogg"
          controls>
       <a href="myaudio.ogg">Download</a>
   </audio>

   Copy
4. Şimdi bu datanın bize vereceği bilgiyi alıp işleyelim. 

   function getTimestamp(duration) {
       let minutes = Math.floor(duration / 60);
       let seconds = Math.floor(duration - (minutes * 60));
   
       if (minutes < 10) {minutes = "0"+ minutes;}
       if (seconds < 10) {seconds = "0"+ seconds;}
   
       return minutes+':'+seconds;
   }
   
   function audioLoaded() {
      document.querySelector('#' + event.target.id + '-text').innerHTML =  getTimestamp(event.target.duration);
   }

   Copy

Saatli Timestamp

1. String.prototype.toHHMMSS = function () {
       var sec_num = parseInt(this, 10); // don't forget the second param
   
       var hours   = Math.floor(sec_num / 3600);
       var minutes = Math.floor((sec_num - (hours * 3600)) / 60);
       var seconds = sec_num - (hours * 3600) - (minutes * 60);
   
       if (hours   < 10) {hours   = "0"+hours;}
       if (minutes < 10) {minutes = "0"+minutes;}
       if (seconds < 10) {seconds = "0"+seconds;}
   
       return hours+':'+minutes+':'+seconds;
   }
   
   alert("5678".toHHMMSS());

   Copy

Referanslar

1. Saniyeden timestamp çıkartmak - link
2.