Как правильно выводить длину видео?

Question

[Andrew Morozov]

Как правильно выводить длину видео файла, у меня сейчас выводит

"00:00:10"
"00:00:06"

Нужно если длина видео в секундах было вот так

"00:10"

если в минутах

"10:40"

и если в часах уже вот так как сейчас

"00:00:10"

const a = 'https://www.w3schools.com/html/mov_bbb.mp4';
const b = 'https://assets.codepen.io/6093409/hubspot-video-example.mp4';

const arr = [a, b];

arr.map((item) => {
  let media = new Audio(item);
  media.onloadedmetadata = function () {
    console.log(new Date(media.duration * 1000).toISOString().slice(11, 19));
  };
});

codepen

Answer 1

[Сергей Соколов]

Можно начальный индекс вырезания подстроки менять, и часы забирать только когда длиннее часа:

-    console.log(new Date(media.duration * 1000).toISOString().slice(11, 19));
+    console.log(new Date(media.duration * 1000).toISOString().slice(media.duration > 3600 ? 11 : 14, 19));

Comments

[Andrew Morozov]

Спасибо

Answer 2

[calculator212]

Просто делать проверку на то, что длительность меньше одного часа. Если использовать ваш код, то можно сделать так

arr.map((item) => {
  let media = new Audio(item);
  media.onloadedmetadata = function () {
    
    let ac = new Date(media.duration * 1000);
    const hours = ac.getUTCHours();
    
    if (hours == 0){
      console.log(ac.toISOString().slice(14, 19))
    } else {
      console.log(ac.toISOString().slice(11, 19))
    }  
    
  };
});

Answer 3

[Okujava-script]

Но разве удобно использовать такой странный метод, как toISOString() :) Я бы сделал так:

const a = 'https://www.w3schools.com/html/mov_bbb.mp4';
const b = 'https://assets.codepen.io/6093409/hubspot-video-example.mp4';

const arr = [a, b];

arr.map((item) => {
	let media = new Audio(item);
	media.onloadedmetadata = function () {
		let date = new Date(this.duration * 1000);
		let h = date.getUTCHours();
		h = h ? h + ':' : '';
		let m = date.getMinutes();
		let s = date.getSeconds();
		console.log(h + m + ':' + s);
	};
});

Comments

[Сергей Соколов]

getMinutes() и другие возвращают число. Может получаться корявое время типа 4:5 из четырёх минут и пяти секунд. Поэтому надо заморочиться дописыванием нуля справа, если значение меньше 10: if (m < 10) m = '0' + m;

Так что раз уж связались с датой, toISOString() вполне элегантное решение.

Иначе же можно просто делить и вычитать:

let s = this.duration;
const h = Math.floor(s / 3600);
s -= h * 3600;

const m = Math.floor(s / 60);
s -= m * 60;

const time = [h, m, s];
if (h === 0) time.splice(0, 1); // убрать часы

const timeString = time.map(n => n.toString().padStart(2, '0')).join(':');

[Okujava-script]

Да, я согласен. Я сначала забыл, что придётся ноль дописывать.