JavaScript seconds to time string with format hh mm ss

Question

I want to convert a duration of time  i e   number of seconds to colon-separated time string  hh mm ss   I found some useful answers here but they all talk about converting to x hours and x minutes format   So is there a tiny snippet that does this in jQuery or just raw JavaScript

User · Answer

function secondsToTime secs        var hours   Math floor secs    60   60         var divisor for minutes   secs    60   60       var minutes   Math floor divisor for minutes   60        var divisor for seconds   divisor for minutes   60      var seconds   Math ceil divisor for seconds        if hours  gt   12             var m   pm                else                 var m  am              if hours-12  gt 0                     var hrs   hours-12              else if hours-12  lt 0                     var hrs   hours             var obj              h   hrs           m   minutes           s   seconds           a  m              return obj    var d   new Date    var n   d getHours    var hms   d getHours       d getMinutes       d getSeconds         your input string var a   hms split          split it at the colons     minutes are worth 60 seconds  Hours are worth 60 minutes  var seconds     a 0     60   60     a 1     60     a 2         console log seconds   console log secondsToTime seconds     https   jsfiddle net jithinksoft 9x6z4sdt

User · Answer

I d upvote artem s answer  but I am a new poster   I did expand on his solution  though not what the OP asked for as follows      t  new Date    toString   split           timestring    t 2  t 1     lt b gt   t 4    lt  b gt    t 6  1  t 7  0  t 8  0      To get  04Oct 16 31 28 PDT  This works for me     But if you are starting with just a time quantity  I use two functions  one to format and pad  and one to calculate   function sec2hms timect      if timect    undefined  timect  0  timect     null  return          timect is seconds  NOT milliseconds   var se timect   60    the remainder after div by 60   timect   Math floor timect 60     var mi timect   60    the remainder after div by 60   timect   Math floor timect 60     var hr   timect   24    the remainder after div by 24   var dy   Math floor timect 24     return padify  se  mi  hr  dy      function padify  se  mi  hr  dy     hr   hr lt 10  0  hr hr    mi   mi lt 10  0  mi mi    se   se lt 10  0  se se    dy   dy gt 0 dy  d         return dy hr     mi     se

User · Answer

You can use Momement js with moment-duration-format plugin    x000D   x000D  var seconds   3820  x000D  var duration   moment duration seconds   seconds    x000D  var formatted   duration format  hh mm ss    x000D  console log formatted      01 03 40 x000D   lt  -- Moment js library -- gt  x000D   lt script src  https   cdnjs cloudflare com ajax libs moment js 2 18 1 moment min js  gt  lt  script gt  x000D   x000D   lt  -- moment-duration-format plugin -- gt  x000D   lt script src  https   cdnjs cloudflare com ajax libs moment-duration-format 1 3 0 moment-duration-format min js  gt  lt  script gt  x000D   x000D   x000D    See also this Fiddle

User · Answer

Here is an es6 Version of it   export const parseTime    time    gt       send time in seconds    eslint-disable-next-line  let hours   parseInt time   60   60   mins   Math abs parseInt time   60  -  hours   60    seconds   Math round time   60   return isNaN hours     isNaN mins     isNaN seconds     00 00 00       hours  gt  9   Math max hours  0     0    Math max hours  0     mins  gt  9   Math max mins  0     0    Math max 0  mins     seconds  gt  9   Math max 0  seconds     0    Math max 0  seconds

User · Answer

If you know the number of seconds you have  this will work  It also uses the native Date   object   function formattime numberofseconds           var zero    0   hours  minutes  seconds  time       time   new Date 0  0  0  0  0  numberofseconds  0        hh   time getHours        mm   time getMinutes        ss   time getSeconds            Pad zero values to 00     hh    zero hh  slice -2       mm    zero mm  slice -2       ss    zero ss  slice -2        time   hh         mm         ss      return time

User · Answer

This is how i did it  function timeFromSecs seconds        return      Math floor seconds 86400   d         Math floor   seconds 86400  1  24   h          Math floor   seconds 3600  1  60   m          Math round   seconds 60  1  60   s        timeFromSecs 22341938  will return  258d 14h 5m 38s

User · Answer

I m personally prefer the leading unit  days  hours  minutes  without leading zeros  But seconds should always be leaded by minutes  0 13   this presentation is easily considered as  duration   without further explanation  marking as min  sec s   etc    usable in various languages  internationalization           returns   - d h mm ss  f                   - h mm ss  f                   - m ss  f      function formatSeconds  value  fracDigits            var isNegative   false          if  isNaN value                 return value            else if  value  lt  0                isNegative   true              value   Math abs value                     var days   Math floor value   86400           value    86400          var hours   Math floor value   3600           value    3600          var minutes   Math floor value   60           var seconds    value   60  toFixed fracDigits    0           if  seconds  lt  10                seconds    0    seconds                     var res   hours    hours           0    minutes  slice -2          seconds     minutes         seconds           if  days                res   days         res                    return  isNegative     -    res    res             imitating the server side   net  C   duration formatting like       public static string Format this TimeSpan interval                string pattern          if  interval Days  gt  0           pattern     d  h  mm  ss           else if  interval Hours  gt  0     pattern     h  mm  ss           else                            pattern     m  ss           return string Format   0    interval ToString pattern

User · Answer

I saw that everybody s posting their takes on the problem despite the fact that few top answers already include all the necessary info to tailor for the specific use case   And since I want to be hip as well - here s my unnecessary and a bit cumbersome solution  which is    a  Readable  I hope   b  Easily customizable c  Doesn t print any zeroes    drum roll  function durationToDDHHMMSSMS durms        if   durms  return            var HHMMSSMS   new Date durms  toISOString   substr 11  12       if   HHMMSSMS  return            var HHMMSS   HHMMSSMS split      0       if   HHMMSS  return            var MS   parseInt HHMMSSMS split      1  10       var split   HHMMSS split           var SS   parseInt split 2  10       var MM   parseInt split 1  10       var HH   parseInt split 0  10        var DD   Math floor durms  1000 60 60 24         var string           if  DD  string        DD d       if  HH  string        HH h       if  MM  string        MM m       if  SS  string        SS s       if  MS  string        MS ms        return string       Note that this code uses ES6 template strings  I m sure that such a smarty-pants as you are will have no difficulties replacing them with regular strings if required

User · Answer

Here is yet another version  which handles days also   function FormatSecondsAsDurationString  seconds         var s            var days   Math floor    seconds   3600     24        if   days  gt   1                 s    days toString       day        days    1           s                     seconds -  days   24   3600             var hours   Math floor  seconds   3600        s    GetPaddedIntString  hours toString    2              seconds -  hours   3600       var minutes   Math floor  seconds   60        s    GetPaddedIntString  minutes toString    2              seconds -  minutes   60       s    GetPaddedIntString  Math floor  seconds   toString    2         return s     function GetPaddedIntString  n  numDigits         var nPadded   n      for     nPadded length  lt  numDigits                   nPadded    0    nPadded             return nPadded

User · Answer

Here is a fairly simple solution that rounds to the nearest second    x000D   x000D  var returnElapsedTime   function epoch    x000D      We are assuming that the epoch is in seconds x000D    var hours   epoch   3600  x000D        minutes    hours   1    60  x000D        seconds    minutes   1    60  x000D    return Math floor hours          Math floor minutes          Math round seconds   x000D    x000D   x000D   x000D

User · Answer

secondsToTime                var t   wachttijd sec     your seconds             var hour   Math floor t 3600               if hour  lt  10                   hour    0  hour                            var time   hour       0  Math floor t 60  60  slice -2        0    t   60  slice -2                 would output  00 00 00  gt   100 00 00   keeps counten down even if more then 24 hours

User · Answer

Here is my vision of solution  You can try my snippet below    x000D   x000D  function secToHHMM sec    x000D    var d   new Date    x000D    d setHours 0   x000D    d setMinutes 0   x000D    d setSeconds 0   x000D    d   new Date d getTime     sec 1000   x000D    return d toLocaleString  en-GB   split      1   x000D     x000D   x000D  alert   One hour      secToHHMM 60 60         01 00 00  x000D  alert   One hour five minutes      secToHHMM 60 60   5 60         01 05 00  x000D  alert   One hour five minutes 23 seconds      secToHHMM 60 60   5 60   23         01 05 23  x000D   x000D   x000D

User · Answer

new Date   toString   split      4    result 15 08 03

User · Answer

I liked Webjins answer the most  so i extended it to display days with a d suffix  made display conditional and included a s suffix on plain seconds   function sec2str t       var d   Math floor t 86400           h     0  Math floor t 3600    24  slice -2           m     0  Math floor t 60  60  slice -2           s     0    t   60  slice -2       return  d gt 0 d  d        h gt 0 h          m gt 0 m          t gt 60 s s  s        returns  3d 16 32 12  or  16 32 12  or  32 12  or  12s

User · Answer

I like the first answer  There some optimisations    source data is a Number  additional calculations is not needed  much excess computing   Result code   Number prototype toHHMMSS   function          var seconds   Math floor this           hours   Math floor seconds   3600       seconds -  hours 3600      var minutes   Math floor seconds   60       seconds -  minutes 60       if  hours    lt  10   hours      0  hours       if  minutes  lt  10   minutes    0  minutes       if  seconds  lt  10   seconds    0  seconds       return hours     minutes     seconds

User · Answer

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    lt  10   hours      0  hours       if  minutes  lt  10   minutes    0  minutes       if  seconds  lt  10   seconds    0  seconds       return hours     minutes     seconds      You can use it now like   alert  5678  toHHMMSS       Working snippet    x000D   x000D  String prototype toHHMMSS   function      x000D      var sec num   parseInt this  10      don t forget the second param x000D      var hours     Math floor sec num   3600   x000D      var minutes   Math floor  sec num -  hours   3600     60   x000D      var seconds   sec num -  hours   3600  -  minutes   60   x000D   x000D      if  hours    lt  10   hours      0  hours   x000D      if  minutes  lt  10   minutes    0  minutes   x000D      if  seconds  lt  10   seconds    0  seconds   x000D      return hours         minutes         seconds  x000D    x000D       x000D  console log  5678  toHHMMSS     x000D   x000D   x000D

User · Answer

secToHHMM number  number        debugger      let hours   Math floor number   3600       let minutes   Math floor  number -  hours   3600     60       let seconds   number -  hours   3600  -  minutes   60       let H  M  S      if  hours  lt  10  H     0    hours       if  minutes  lt  10  M     0    minutes       if  seconds  lt  10  S     0    seconds       return  H    hours           M    minutes           S    seconds

User · Answer

Formats seconds  number  to H i s format     00 12 00       When  short  option is set to true  will return     0 50    2 00    12 00    1 00 24    10 00 00     export default function formatTimeHIS  seconds    short   false             const pad   num   gt  num  lt  10    0  num     num    const H   pad Math floor seconds   3600     const i   pad Math floor seconds   3600   60     const s   pad seconds   60     if  short        let result          if  H  gt  0  result        H        result       H  gt  0   i    i    s       return result     else       return    H    i    s

User · Answer

Here s my take on it   function formatTime seconds      const h   Math floor seconds   3600     const m   Math floor  seconds   3600    60     const s   Math round seconds   60     return       h      m  gt  9   m    h    0    m   m     0        s  gt  9   s    0    s     filter Boolean  join           Expected results   const expect   require  expect    expect formatTime 0   toEqual  0 00    expect formatTime 1   toEqual  0 01    expect formatTime 599   toEqual  9 59    expect formatTime 600   toEqual  10 00    expect formatTime 3600   toEqual  1 00 00    expect formatTime 360009   toEqual  100 00 09    expect formatTime 0 2   toEqual  0 00

User · Answer

It s pretty easy   function toTimeString seconds      return  new Date seconds   1000   toUTCString   match    d d  d d  d d    0

User · Answer

x000D   x000D  const secondsToTime    seconds  locale    gt    x000D      const date   new Date 0   x000D      date setHours 0  0  seconds  0   x000D      return date toLocaleTimeString locale   x000D    x000D  console log secondsToTime 3610   en     x000D   x000D   x000D    where the locale parameter   en    de   etc   is optional

User · Answer

I recommend ordinary javascript  using the Date object   For a shorter solution  using toTimeString  see the second code snippet   var seconds   9999     multiply by 1000 because Date   requires miliseconds var date   new Date seconds   1000   var hh   date getUTCHours    var mm   date getUTCMinutes    var ss   date getSeconds       If you were building a timestamp instead of a duration  you would uncomment the following line to get 12-hour  not 24  time    if  hh  gt  12   hh   hh   12      These lines ensure you have two-digits if  hh  lt  10   hh    quot 0 quot  hh   if  mm  lt  10   mm    quot 0 quot  mm   if  ss  lt  10   ss    quot 0 quot  ss      This formats your string to HH MM SS var t   hh  quot   quot  mm  quot   quot  ss  document write t     Of course  the Date object created will have an actual date associated with it  but that data is extraneous  so for these purposes  you don t have to worry about it    Edit  short solution   Make use of the toTimeString function and split on the whitespace  var seconds   9999     Some arbitrary value var date   new Date seconds   1000      multiply by 1000 because Date   requires miliseconds var timeStr   date toTimeString   split      0    toTimeString gives  16 54 58 GMT-0800  PST    and splitting on the first whitespace gives  16 54 58

User · Answer

This version of the accepted answer makes it a bit prettier if you are dealing with video lengths for example   1 37 40  1 hour   37 minutes   40 seconds   1 00  1 minute   2 20  2 minutes and 20 seconds   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      var hourSeparator          var minuteSeparator           if hours    0  hours      hourSeparator          if  minutes  lt  10  amp  amp  hours    0   minutes    0  minutes     if  seconds  lt  10   seconds    0  seconds     var time   hours hourSeparator minutes minuteSeparator seconds    return time

User · Answer

function formatTime seconds        return           parseInt seconds   60   60           parseInt seconds   60   60           parseInt seconds   60                 join               replace   b  d  b g   0 1

User · Answer

I think performance wise this is by far the fastest   var t   34236     your seconds var time     0  Math floor t 3600    24  slice -2        0  Math floor t 60  60  slice -2        0    t   60  slice -2    would output  09 30 36

User · Answer

This is one I wrote recently for MM SS  It s not exact to the question  but it s a different one-liner format   const time   60   2   35     2 minutes  35 seconds const str       time   60        padStart 2   0                time   60    1   60        padStart 2   0     str    02 35   Edit  This was added for variety  but the best solution here is https   stackoverflow com a 25279399 639679 below

User · Answer

I dislike adding properties to standard datatypes in JavaScript  so I would recommend something like this          Format a duration in seconds to a human readable format using the notion     h  mm ss   e g   4 40 78   Negative durations are preceeded by  -          param t Duration in seconds     return The formatted duration string     var readableDuration    function             Each unit is an object with a suffix s and divisor d     var units              s      d  1      Seconds          s       d  60      Minutes          s       d  60      Hours                Closure function     return function t            t   parseInt t      In order to use modulus         var trunc  n   Math abs t   i  out          out  list of strings to concat         for  i   0  i  lt  units length  i                  n   Math floor n   units i  d      Total number of this unit                Truncate e g  26h to 2h using modulus with next unit divisor             if  i 1  lt  units length     Tweak substr with two digits                 trunc     00   n   units i 1  d  substr -2  2         if not final unit             else                 trunc   n              out unshift     trunc   units i  s      Output                    t  lt  0    out unshift  -     null     Handle negative durations         return out join                     Usage   var str   readableDuration 3808       1 03 28    I also created a more generally usable version  The main difference is that it accepts milliseconds  which is kind of the standard time unit in JS  and the output format uses spaces instead

User · Answer

I loved Powtac s answer  but I wanted to use it in angular js  so I created a filter using his code     filter  HHMMSS      filter   function   filter        return function  input  decimals            var sec num   parseInt input  10               decimal   parseFloat input  - sec num              hours     Math floor sec num   3600               minutes   Math floor  sec num -  hours   3600     60               seconds   sec num -  hours   3600  -  minutes   60            if  hours    lt  10   hours      0  hours           if  minutes  lt  10   minutes    0  minutes           if  seconds  lt  10   seconds    0  seconds           var time      hours     minutes     seconds          if  decimals  gt  0                time           filter  number   decimal  decimals  substr 2                     return time               It s functionally identical  except that I added in an optional decimals field to display fractional seconds  Use it like you would any other filter      elapsedTime   HHMMSS    displays  01 23 45     elapsedTime   HHMMSS   3    displays  01 23 45 678

User · Answer

Using the amazing moment js library   function humanizeDuration input  units           units is a string with possible values of y  M  w  d  h  m  s  ms   var duration   moment   startOf  day   add units  input       format          if duration hour    gt  0   format     H  hours          if duration minute    gt  0   format     m  minutes          format      s  seconds       return duration format format       This allows you to specify any duration  be it hours  minutes  seconds  mills  and returns a human readable version

User · Answer

You can use the following function to convert time  in seconds  to HH MM SS format   var convertTime   function  input  separator        var pad   function input   return input  lt  10    quot 0 quot    input   input        return           pad Math floor input   3600            pad Math floor input   3600   60            pad Math floor input   60          join typeof separator      undefined     separator             Without passing a separator  it uses   as the  default  separator   time   convertTime 13551 9941351      -- gt  OUTPUT   03 45 51  If you want to use - as a separator  just pass it as the second parameter  time   convertTime 1126 5135155   -       -- gt  OUTPUT   00-18-46   Demo  x000D   x000D  var convertTime   function  input  separator        var pad   function input   return input  lt  10    0    input   input        return           pad Math floor input   3600            pad Math floor input   3600   60            pad Math floor input   60          join typeof separator      undefined     separator             document body innerHTML     lt pre gt     JSON stringify       5 3515555   convertTime 5 3515555       126 2344452   convertTime 126 2344452   -        1156 1535548   convertTime 1156 1535548            9178 1351559   convertTime 9178 1351559            13555 3515135   convertTime 13555 3515135          null    t        lt  pre gt    x000D   x000D   x000D   See also this Fiddle

User · Answer

You can manage to do this without any external JS library with the help of JS Date method like following    x000D   x000D  var date   new Date 0   x000D  date setSeconds 45      specify value for SECONDS here x000D  var timeString   date toISOString   substr 11  8   x000D  console log timeString  x000D   x000D   x000D

User · Answer

A Google search turned up this result   function secondsToTime secs        secs   Math round secs       var hours   Math floor secs    60   60         var divisor for minutes   secs    60   60       var minutes   Math floor divisor for minutes   60        var divisor for seconds   divisor for minutes   60      var seconds   Math ceil divisor for seconds        var obj              h   hours           m   minutes           s   seconds            return obj

User · Answer

Variation on a theme  Handles single digit seconds a little differently  seconds2time 0   - gt    0s   seconds2time 59  - gt   59s   seconds2time 60  - gt   1 00   seconds2time 1000  - gt   16 40   seconds2time 4000  - gt   1 06 40   function seconds2time  seconds        var hours     Math floor seconds   3600       var minutes   Math floor  seconds -  hours   3600     60       var seconds   seconds -  hours   3600  -  minutes   60       var time            if  hours    0          time   hours                if  minutes    0    time                 minutes    minutes  lt  10  amp  amp  time            0  minutes   String minutes         time    minutes                if  time                 time   seconds  s             else         time     seconds  lt  10     0  seconds   String seconds             return time

User · Answer

A regular expression can be used to match the time substring in the string returned from the toString   method of the Date object  which is formatted as follows   Thu Jul 05 2012 02 45 12 GMT 0100  GMT Daylight Time    Note that this solution uses the time since the epoch  midnight of January 1  1970  This solution can be a one-liner  though splitting it up makes it much easier to understand   function secondsToTime seconds        const start   new Date 1970  1  1  0  0  0  0  getTime        const end   new Date 1970  1  1  0  0  parseInt seconds   0  getTime        const duration   end - start       return new Date duration  toString   replace      d 2   d 2   d 2         1

User · Answer

To get the time part in the format hh MM ss  you can use this regular expression    This was mentioned above in same post by someone  thanks for that     x000D   x000D      var myDate   new Date   toTimeString   replace      d 2   d 2   d 2         1    x000D      console log myDate  x000D   x000D   x000D

User · Answer

function toHHMMSS seconds        var h  m  s  result            HOURs     h   Math floor seconds 3600       seconds -  h 3600      if h           result   h lt 10    0  h       h                   MINUTEs     m   Math floor seconds 60       seconds -  m 60      result    m lt 10    0  m       m             SECONDs     s seconds 60      result    s lt 10    0  s   s      return result      Examples       toHHMMSS 111         01 51       toHHMMSS 4444        01 14 04       toHHMMSS 33        00 33

User · Answer

Here s a one-liner updated for 2019     your date var someDate   new Date  Wed Jun 26 2019 09 38 02 GMT 0100     var result      String someDate getHours    padStart 2  0      String someDate getMinutes    padStart 2  0      String someDate getSeconds    padStart 2  0        result will be  09 38 02

User · Answer

Milliseconds to duration  the simple way        To have leading zero digits in strings  function pad num  size        var s   num           while  s length  lt  size  s    0    s      return s        ms to time duration msToDuration   function ms       var seconds   ms   1000      var hh   Math floor seconds   3600       mm   Math floor seconds   60    60      ss   Math floor seconds    60      mss   ms   1000      return pad hh 2      pad mm 2      pad ss 2      pad mss 3       It converts 327577 to 00 05 27 577   UPDATE  Another way for different scenario     toHHMMSS   function  n        var sep                n   parseFloat n           sss   parseInt  n   1  1000           hh   parseInt n   3600       n    3600      var mm   parseInt n   60           ss   parseInt n   60       return pad hh 2  sep pad mm 2  sep pad ss 2      pad sss 3       function pad num  size            var str   num               while  str length  lt  size  str    0    str          return str           toHHMMSS 6315 077     Return 01 45 15 077

User · Answer

Non-prototype version of toHHMMSS       function toHHMMSS seconds            var sec num   parseInt seconds           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    lt  10   hours      0  hours           if  minutes  lt  10   minutes    0  minutes           if  seconds  lt  10   seconds    0  seconds           var time      hours     minutes     seconds          return time

User · Answer

Here s how I did it   It seems to work fairly well  and it s extremely compact    It uses a lot of ternary operators  though   function formatTime seconds      var hh   Math floor seconds   3600       mm   Math floor seconds   60    60      ss   Math floor seconds    60    return  hh    hh  lt  10    0          hh                 mm  lt  10   amp  amp  hh    0          mm          ss  lt  10    0          ss        and for formatting strings     String prototype toHHMMSS   function       formatTime parseInt this  10

User · Answer

s2t function  t     return parseInt t 86400   d    new Date t 86400 1000   toUTCString   replace      d 2     d 2     d 2         1h  2m  3s       s2t 123456     result   1d 10h 17m 36s

User · Answer

Easiest way to do it  new Date sec   1000  toISOString   substr 11  8

User · Answer

There s a new method for strings on the block  padStart  const str    5   str padStart 2   0       05   Here is a sample use case  YouTube durations in 4 lines of JavaScript

[javascript] JavaScript seconds to time string with format hh:mm:ss

Examples related to javascript

Examples related to date

Examples related to time

Examples related to date-format

Examples related to time-format