Merge pull request #269 from nhubbard/v2-beta

clockBold's Re-Incarnation
This commit is contained in:
Michael Teeuw 2016-04-29 18:55:55 +02:00
commit e572d544ef
2 changed files with 23 additions and 23 deletions

View File

@ -47,14 +47,21 @@ The following properties can be configured:
</tr>
<tr>
<td><code>showPeriod</code></td>
<td>Show the period (am/pm) with 12 hour format<br>
<td>Show the period (am/pm) with 12 hour format.<br>
<br><b>Possible values:</b> <code>true</code> or <code>false</code>
<br><b>Default value:</b> <code>true</code>
</td>
</tr>
<tr>
<td><code>showPeriodUpper</code></td>
<td>Show the period (AM/PM) with 12 hour format as uppercase<br>
<td>Show the period (AM/PM) with 12 hour format as uppercase.<br>
<br><b>Possible values:</b> <code>true</code> or <code>false</code>
<br><b>Default value:</b> <code>false</code>
</td>
</tr>
<tr>
<td><code>clockBold</code></td>
<td>Remove the colon and bold the minutes to make a more modern look.<br>
<br><b>Possible values:</b> <code>true</code> or <code>false</code>
<br><b>Default value:</b> <code>false</code>
</td>

View File

@ -1,41 +1,34 @@
/* global Log, Module, moment, config */
/* Magic Mirror
* Module: Clock
*
* By Michael Teeuw http://michaelteeuw.nl
* MIT Licensed.
*/
Module.register("clock",{
// Module config defaults.
defaults: {
timeFormat: config.timeFormat,
displaySeconds: true,
showPeriod: true,
showPeriodUpper: false,
clockBold: false
},
// Define required scripts.
getScripts: function() {
return ["moment.js"];
},
// Define start sequence.
start: function() {
Log.info("Starting module: " + this.name);
// Schedule update interval.
var self = this;
setInterval(function() {
self.updateDom();
}, 1000);
// Set locale.
moment.locale(config.language);
},
// Override dom generator.
getDom: function() {
// Create wrappers.
@ -44,35 +37,36 @@ Module.register("clock",{
var timeWrapper = document.createElement("div");
var secondsWrapper = document.createElement("sup");
var periodWrapper = document.createElement("span");
// Style Wrappers
dateWrapper.className = "date normal medium";
timeWrapper.className = "time bright large light";
secondsWrapper.className = "dimmed";
// Set content of wrappers.
// The moment().format('h') method has a bug on the Raspberry Pi.
// The moment().format("h") method has a bug on the Raspberry Pi.
// So we need to generate the timestring manually.
// See issue: https://github.com/MichMich/MagicMirror/issues/181
var timeString = moment().format('HH:mm');
if (this.config.clockBold === true) {
var timeString = moment().format("HH[<span class=\"bold\">]mm[</span>]");
} else {
var timeString = moment().format("HH:mm");
}
if (this.config.timeFormat !== 24) {
var now = new Date();
var hours = now.getHours() % 12 || 12;
timeString = hours + moment().format(':mm');
if (this.config.clockBold === true) {
timeString = hours + moment().format("[<span class=\"bold\">]mm[</span>]");
} else {
timeString = hours + moment().format(":mm");
}
}
dateWrapper.innerHTML = moment().format("dddd, LL");
timeWrapper.innerHTML = timeString;
secondsWrapper.innerHTML = moment().format("ss");
if (this.config.showPeriodUpper) {
periodWrapper.innerHTML = moment().format('A');
periodWrapper.innerHTML = moment().format("A");
} else {
periodWrapper.innerHTML = moment().format('a');
periodWrapper.innerHTML = moment().format("a");
}
// Combine wrappers.
wrapper.appendChild(dateWrapper);
wrapper.appendChild(timeWrapper);
@ -82,7 +76,6 @@ Module.register("clock",{
if (this.config.showPeriod && this.config.timeFormat !== 24) {
timeWrapper.appendChild(periodWrapper);
}
// Return the wrapper to the dom.
return wrapper;
}