FUNCT Add support to dinamically update header time

2 files changed, 35 insertions, 0 deletions

diff --git a/src/js/main.js b/src/js/main.js
index d26f701..f07c210 100644
--- a/src/js/main.js
+++ b/src/js/main.js
@@ -1,9 +1,11 @@
 import { init as init_apps } from './apps';
 import { init as init_weather } from './weather';
 import { init as init_network } from './network';
+import { init as init_time } from './time';
 
 export function init() {
     init_apps();
     init_weather();
     init_network();
+    init_time();
 }
\ No newline at end of file
diff --git a/src/js/time.js b/src/js/time.js
new file mode 100644
index 0000000..55165c7
--- /dev/null
+++ b/src/js/time.js
@@ -0,0 +1,33 @@
+import Mustache from 'mustache';
+
+var template;
+
+var days = ['SUNDAY', 'MONDAY', 'TUESDAY', 'WEDNESDAY', 'THURSDAY', 'FRIDAY', 'SATURDAY'];
+
+function formatAMPM(date) {
+    var hours = date.getHours();
+    var minutes = date.getMinutes();
+    var ampm = hours >= 12 ? 'PM' : 'AM';
+    hours = hours % 12;
+    hours = hours ? hours : 12;
+    minutes = minutes < 10 ? '0'+minutes : minutes;
+    var strTime = hours + ':' + minutes + ' ' + ampm;
+    return strTime;
+  }
+
+function initInterval() {
+    setInterval(function() {
+        var date = new Date();
+        document.getElementById('timeContainer').innerHTML = Mustache.render(template, {
+            day: days[date.getDay()],
+            hour: formatAMPM(date)
+        });
+    }, 1000);
+}
+
+export function init() {
+    template = document.getElementById('time-template').innerHTML;
+    Mustache.parse(template);
+
+    initInterval();
+}
\ No newline at end of file