JSFiddle - React, Tailwind, and code Playground

by jakie8

HTML

<h1 id="time"></h1>

JavaScript

function calcDate(){
    var ONE_DAY = 1000 * 60 * 60 * 24;
    var ONE_HOUR = 1000 * 60 * 60;
    var ONE_MINUTE = 1000 * 60;
    var ONE_SECOND = 1000 ;

    // Convert both dates to milliseconds
    var n = new Date();
    var now = n.getTime();
    
    var t = new Date(2012, 4, 19, 16);
    var target = t.getTime()

    // Calculate the difference in milliseconds
    var difference_ms = Math.abs(now-target);
    
    var data = {};
    
    data.days = Math.round(difference_ms/ONE_DAY);
    difference_ms -= data.days*ONE_DAY;
    
    data.hours = Math.round(difference_ms/ONE_HOUR);
    difference_ms -= data.hours*ONE_HOUR;
    
    data.minutes = Math.round(difference_ms/ONE_MINUTE);
    difference_ms -= data.minutes*ONE_MINUTE;
    
    data.seconds = Math.round(difference_ms/ONE_SECOND);
    difference_ms -= data.seconds*ONE_SECOND;
    
    return data;
}
        
function doDate(data){
    var text = data.days+' days, '+data.hours+' hours, '+data.minutes+' minutes, '+data.seconds+' seconds';
    document.getElementById('time').innerHTML=text;
}

var work = setInterval(function(){
    doDate(calcDate());
}, 1000);