@stetxems

Как вычислить длину трека(duration audio)?

Есть код Vue Js
С помощью { current } у меня идет счетчик трека при проигрывании .
Нужно еще вычислить длину трека(duration) как это сделать, есть у кого то варианты?
var app = new Vue({
            el: '#player',
            delimiters: ['{', '}'],
            data: {
                isPlaying: false,
                currentMils: '0',
                durationMilliseconds: '180.767347',
                duration: 'xx:xx',
                current: '0:00',
                volume: 0.5,
                interval: null,
            },
            methods: {
                toggle() {
                    this.isPlaying = !this.isPlaying;
                },
                parseTime(time) {
                    let minutes = Math.floor(time / 60),
                        seconds = '' + parseInt(time - minutes * 60);
                    if (seconds.split('').length === 1)
                        seconds = '0' + seconds;
                    return minutes + ' : ' + seconds;
                },
                changeAudio(e) {
                    player.currentTime = e;
                },
                mute() {
                    this.volume = 0;
                    volumeControl.value = 0;
                }
            },
            mounted() {
                this.interval = setInterval(() => {
                    this.currentMils = player.currentTime;
                    this.current = this.parseTime(player.currentTime);

                    if(this.currentMils == this.durationMilliseconds) {
                        this.isPlaying = false;
                        this.currentMils = 0;
                    }
                } , 1000);
                player.volume = this.volume;
            },
            watch: {
                isPlaying: function (val) {
                    if(val) {
                        player.play();
                    } else {
                        player.pause();
                    }
                },
                volume: function (val) {
                    player.volume = val;
                }
            }
        });


<div class="col-lg-6">
                   <div class="mt-lg-3 mb-3 mb-lg-0">
                       <input id="progress"
                              type="range"
                              min="0"
                              max="180"
                              step="1"
                              value="0"
                              class="p-0">
                       <p class="d-none d-lg-flex justify-content-between align-items-center text-14px font-weight-bold mt-2">
                           <span>{ current }</span>
                           <span class="time-music"></span>
                       </p>
                   </div>
               </div>
  • Вопрос задан
  • 438 просмотров
Решения вопроса 1
@stetxems Автор вопроса
Вот так сделал.

function readableDuration(seconds) {
    sec = Math.floor( seconds );    
    min = Math.floor( sec / 60 );
    min = min >= 10 ? min : '' + min;    
    sec = Math.floor( sec % 60 );
    sec = sec >= 10 ? sec : '0' + sec;    
    return min + ':' + sec;
    }
        setTimeout(function(){
            var timeMusic = document.querySelectorAll('.time-music');
            for (let index = 0; index < timeMusic.length; index++) {
                timeMusic[index].innerHTML = readableDuration(audio.duration); 
            }
        }, 200);
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
wapster92
@wapster92 Куратор тега JavaScript
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
28 мар. 2024, в 18:16
1000 руб./за проект
28 мар. 2024, в 18:15
90000 руб./за проект
28 мар. 2024, в 18:05
5000 руб./за проект