JSFiddle - React, Tailwind, and code Playground

by Tech Savant

HTML

Offset<input type="text" id="offset" value="0">
ServerTime<input type="text" id="servertime" value=""><br><br>
Displaying Offset Time on Website <input type="text" id="serverplusoff" value=""> (server time + offset)

    <br><br>
Saved to Database <input type="text" id="savedb" value=""> (offset timestamp)
<br><br>
Retrieved from Databasae <input type="text" id="rdb" value=""> (saved timestamp, includes offset)
    <br><br>
Display Retreived Value on Website <input type="text" id="rval" value=""> (timestamp, no need to set offset)

JavaScript

(function($){

    $(function(){  
        
        function pad(num, size) {
            var s = num+"";
            while (s.length < size) s = "0" + s;
                return s;
        };
        
        
        function updateClock() {        
            var today = new Date();
            var thisdate = pad(today.getHours(), 2) + ':' + pad(today.getMinutes(), 2) + ':' + pad(today.getSeconds(), 2) + ' ' + today.toDateString();
            $("#servertime").val(thisdate);
            var offset = $("#offset").val() * 60000;
            var milli = today.getTime();          
            var comb = (parseInt(offset)) + (parseInt(milli));
            var offdate = new Date(comb);
            var thisoffdate = pad(offdate.getHours(), 2) + ':' + pad(offdate.getMinutes(), 2) + ':' + pad(offdate.getSeconds(), 2) + ' ' + offdate.toDateString();
            $("#serverplusoff").val(thisoffdate);
        };
        
        setInterval(function() {
            updateClock();
        }, 1000);
 });
 })(jQuery);