JSFiddle - React, Tailwind, and code Playground

by Emre Erkan

HTML

<div id="serverClockTime"></div>

JavaScript

var serverTime = {
  _diff: 0,
  _control: $("#serverClockTime"),
  _interval: null,
  _render: function () {
    var b = new Date();
    var a = new Date(b.setMilliseconds(b.getMilliseconds() - serverTime._diff));
    serverTime._control.html("Sistem Saati : " + formatDateTime(a))
  },
  start: function (b) {
    if (this._interval) {
      clearInterval(this._interval);
      this._diff = 0
    }
    var a = parseDate(b);
    var c = new Date();
    this._diff = c - a;
    this._control.html("Sistem Saati : " + formatDateTime(a)).show();
    this._interval = setInterval(this._render, 1000)
  },
  stop: function () {
    clearInterval(this._interval)
  }
};

function parseDate(d){if(d!=undefined){var t,x=[0,0,0];if(d.toString().indexOf(' ')>-1){var p=d.toString().split(' ');t=p[0].split('-');x=p[1].split(':');if(x.length<3)x.push(0)}else t=d.toString().split('-');return new Date(t[0],t[1]-1,t[2],x[0],x[1],x[2])}}

function formatDateTime(dt){return(dt.getDate()<10?'0':'')+dt.getDate()+'.'+(dt.getMonth()+1<10?'0':'')+(dt.getMonth()+1)+'.'+dt.getFullYear()+' '+(dt.getHours()<10?'0':'')+dt.getHours()+':'+(dt.getMinutes()<10?'0':'')+dt.getMinutes()+':'+(dt.getSeconds()<10?'0':'')+dt.getSeconds()}

serverTime.start('2011-04-07 14:54:04');