Merge pull request #19 from Kirpal/12hour

Added 12 hour clock support
This commit is contained in:
Cade Scroggins 2018-09-10 11:38:22 -07:00 committed by GitHub
commit dc586460e3

View file

@ -85,6 +85,9 @@
// the delimiter between the hours and minutes in the clock
clockDelimiter: ' ',
// change clock to twelve hour format
twelveHour: false,
// note: you can pass in your search query via the q query param
// e.g. going to file:///path/to/tilde/index.html?q=hamsters is equivalent
// to typing "hamsters" and pressing enter
@ -155,9 +158,15 @@
display: block;
margin-top: -.06em;
font-size: 6rem;
text-align: center;
letter-spacing: .05em;
cursor: pointer;
}
#am-pm {
font-size: 2rem;
margin-left: 0.3rem;
}
#search-form {
padding: 1em;
@ -419,6 +428,7 @@
this._el = $.el('#clock');
this._delimiter = options.delimiter;
this._form = options.form;
this._twelveHour = options.twelveHour;
this._setTime = this._setTime.bind(this);
this._registerEvents();
this._start();
@ -434,9 +444,15 @@
_setTime() {
const date = new Date();
const hours = this._pad(date.getHours());
let hours = this._pad(date.getHours());
let amPm = '';
if (this._twelveHour) {
hours = (date.getHours() > 12) ? date.getHours() - 12 : (date.getHours() === 0) ? 12 : date.getHours();
amPm = (date.getHours() > 12) ? 'PM' : 'AM';
}
const minutes = this._pad(date.getMinutes());
this._el.innerHTML = hours + this._delimiter + minutes;
this._el.innerHTML = hours + this._delimiter + minutes + '<span id="am-pm">' + amPm + '</span>';
this._el.setAttribute('datetime', date.toTimeString());
}
_start() {
@ -1052,6 +1068,7 @@
};
new Clock({
twelveHour: CONFIG.twelveHour,
delimiter: CONFIG.clockDelimiter,
form: getForm(),
});