martes, 9 de julio de 2013

Transformar segundos a horas, minutos y segundos

Normalmente, en programación, se trabaja con tiempos en segundos porque es mucho más facil operar con ellos. Sumar o restar tiempos en formato hh:mm:ss es bastante más complicado. Sin embargo, en el momento de presentar cualquier tiempo en pantalla, en el interfaz de usuario, tenemos que transformarlo al formato 'legible'.

El código no es complicado, vamos a partir de que tenemos una variable time con los segundos totales, que tenemos que pasar a otros formatos

var time = 9690;

Veamos como podriamos transformarlo.

Minutos y segundos ( mmm:ss )

En aplicaciones de video y multimedia, es habitual mostrar la duración el contenido en minutos y segundos, por ejemplo 122:33.

var minutes = Math.floor( time / 60 );
var seconds = time % 60;

//Anteponiendo un 0 a los minutos si son menos de 10 
minutes = minutes < 10 ? '0' + minutes : minutes;

//Anteponiendo un 0 a los segundos si son menos de 10 
seconds = seconds < 10 ? '0' + seconds : seconds;

var result = minutes + ":" + seconds;  // 161:30

El string ":" en la última línea nos asegura la conversión implicita a string de las variables si es necesario. El + concatenará texto en vez de sumar números.

Horas, minutos y segundos ( h:mm:ss )

Esta es la conversión mas común para presentar tiempos en pantalla.

var hours = Math.floor( time / 3600 );  
var minutes = Math.floor( (time % 3600) / 60 );
var seconds = time % 60;

//Anteponiendo un 0 a los minutos si son menos de 10 
minutes = minutes < 10 ? '0' + minutes : minutes;

//Anteponiendo un 0 a los segundos si son menos de 10 
seconds = seconds < 10 ? '0' + seconds : seconds;

var result = hours + ":" + minutes + ":" + seconds;  // 2:41:30

El código no es complicado. Lo único que hay que saber es que hay 3600 segundos en una hora.

Fuentes:
StackOverflow

3 comentarios:

  1. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  2. Al usar el segundo trozo de código me daba un error al añadir un 0 delante de los minutos y los segundos. En las siguientes líneas:

    minutes = minutes < 10 ? '0' + minutes : minutes;
    seconds = seconds < 10 ? '0' + seconds : seconds;

    He solucionado el código quitando esas dos líneas y usando la función "slice" en la variable result directamente. Quedaría así:

    var result = ("0" + hours).slice(-2) + ":" + ("0" + minutes).slice(-2) + ":" + ("0" + seconds).slice(-2);

    ResponderEliminar
  3. Excelente aporte! mucho mejor que andar buscando solucionar esto con momentjs, muchas gracias!!

    ResponderEliminar