converting time in seconds to format HH:MM:SS

Pocho

I am new at datatable and javascript in general but I am currently trying build a call monitor. The data is received via a json file and then it is displayed using datatables. The duration for one of the columns has to be a calculation between the last time the field was updated (data.since) in the json and the current time. I have been able to do the calculation and make it display on the table, however the result is on seconds and I would like to display it on the HH:MM:SS format. The HTML for the table is as follows, where "Time" is the column that will display the calculated column. The time from the Json file comes as "since": "2019-02-20 12:12:00" and there can be up to 50 rows. Looking around I found the some code (toHHMMSS) which does the transformation correctly when the lapseTime is a define time in seconds but not when it is passed through the calculation. At this point I am stuck on this part, please let me know if anyone can help me with this, as I said I have been learning as I go, so the below code may not be the most efficient but it is working, I would take any suggestions on that part too

<table id="myTable" class="display" style="width:100%">
    <thead>
        <tr>
            <th>Queue</th>
            <th>Current</th>
            <th>Calls</th>
            <th>Agents</th>
            <th>Time</th>
        </tr>
    </thead>                
</table>

        $('#myTable').DataTable( {              
                    ajax: "data1.json",                 
                    paging: false,
                    stateSave: true,
                    dom: 'lrtip',
                    columns: [  
                        {"data": "skill"},             
                        {"data": "current", "class": "dt-body-center"},          
                        {"data": "calls", "class": "dt-body-center"},
                        {"data": "agents", "class": "dt-body-center"},
                        {"data": null,
                            "render": function(data,type,row){
                                var startTime = new Date (data["since"]);
                                startTime = startTime.getTime();

                                var endTime = new Date();
                                endTime = endTime.getTime();

                                var timeDiff = endTime - startTime; //in ms
                                        timeDiff /= 1000;

                                  var lapseTime = Math.round(timeDiff);
                                  console.log(lapseTime);
                                 return ((lapseTime).toHHMMSS());
                                }}
                    ],

                    rowCallback: function(row, data, index) {       
                        if (data.current >= "00:02:30") {
                            $("td:eq(1)", row).css("background-color","##FFFF33");   
                        if (data.current >= "00:05:00")
                            $("td:eq(1)", row).css("background-color","##FF0000");   
                        }
                    },                  
                } );

    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;
    } 

colin

Hi @Pocho ,

Yep, columns.render is the place to do it. The best bet with all time related operations is to use Moment.js - you'll find it trivial using that.

Cheers,

Colin

Pocho

colin,

Thank you for your answer. I got it working with the javascript I had below the code for the function that got this working in case anyone needs/uses it in the future

    function toHHMMSS(value) {
        var sec_num = value; // 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;
    }