42 lines
1.3 KiB
JavaScript
42 lines
1.3 KiB
JavaScript
class Clock {
|
|
constructor(options) {
|
|
this._el = $.el("#clock");
|
|
this._delimiter = options.delimiter;
|
|
this._twentyFourHourClock = options.twentyFourHourClock;
|
|
this._setDate = this._setDate.bind(this);
|
|
this._el.addEventListener("click", options.toggleHelp);
|
|
this._start();
|
|
}
|
|
|
|
_setDate() {
|
|
const now = new Date();
|
|
let hour = now.getHours();
|
|
if (!this._twentyFourHourClock && hour > 12) {
|
|
hour -= 12;
|
|
}
|
|
let minute = now.getMinutes();
|
|
let second = now.getSeconds();
|
|
|
|
let month = now.getMonth() + 1; // getMonth returns a value between 0 and 11, so add 1 to get the actual month number
|
|
let day = now.getDate();
|
|
let year = now.getFullYear().toString().slice(-2); // Get last two digits of the full year
|
|
|
|
const formattedHour = $.pad(hour);
|
|
const formattedMinute = $.pad(minute);
|
|
const formattedSecond = $.pad(second);
|
|
const formattedMonth = $.pad(month);
|
|
const formattedDay = $.pad(day);
|
|
|
|
this._el.innerHTML = `${formattedMonth}${this._delimiter}${formattedDay}${this._delimiter}${year} ${formattedHour}:${formattedMinute}:${formattedSecond}`;
|
|
this._el.setAttribute(
|
|
"datetime",
|
|
`${year}-${formattedMonth}-${formattedDay}T${formattedHour}:${formattedMinute}:${formattedSecond}`
|
|
);
|
|
}
|
|
|
|
_start() {
|
|
this._setDate();
|
|
setInterval(this._setDate, 1000);
|
|
}
|
|
}
|