You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
57 lines
1.3 KiB
57 lines
1.3 KiB
4 years ago
|
class TimeDate {
|
||
|
constructor() {
|
||
|
this._timeDateButton = document.querySelector("#time-date")
|
||
|
this._timeLabel = document.querySelector("#time-date #time-label")
|
||
|
this._dateLabel = document.querySelector("#time-date #date-label")
|
||
|
this._passForm = document.querySelector("#pass-form")
|
||
|
this._init()
|
||
|
}
|
||
|
|
||
|
_updateTimeDate() {
|
||
|
let date = theme_utils.get_current_localized_date()
|
||
|
let time = theme_utils.get_current_localized_time()
|
||
|
|
||
|
this._dateLabel.innerText = date
|
||
|
this._timeLabel.innerText = time
|
||
|
}
|
||
|
|
||
|
_setTimer() {
|
||
|
this._updateTimeDate()
|
||
|
setInterval(() => {
|
||
|
this._updateTimeDate()
|
||
|
}, 1000)
|
||
|
}
|
||
|
|
||
|
_setButtons() {
|
||
|
this._timeDateButton.addEventListener("click", (ev) => {
|
||
|
this.toggleTimeDate()
|
||
|
})
|
||
|
this._passForm.addEventListener("keydown", (ev) => {
|
||
|
if (ev.keyCode == 27) {
|
||
|
this.toggleTimeDate()
|
||
|
}
|
||
|
})
|
||
|
}
|
||
|
|
||
|
async toggleTimeDate() {
|
||
|
this._timeDateButton.blur()
|
||
|
this._passForm.blur()
|
||
|
if (this._timeDateButton.classList.contains("hide")) {
|
||
|
this._passForm.classList.add("hide")
|
||
|
await wait(300)
|
||
|
this._timeDateButton.classList.remove("hide")
|
||
|
await wait(100)
|
||
|
this._timeDateButton.focus()
|
||
|
} else {
|
||
|
this._timeDateButton.classList.add("hide")
|
||
|
await wait(300)
|
||
|
this._passForm.classList.remove("hide")
|
||
|
}
|
||
|
}
|
||
|
|
||
|
_init() {
|
||
|
this._setTimer()
|
||
|
this._setButtons()
|
||
|
}
|
||
|
}
|