From b11ad29876a7c60e3e3e36b4791f010985f38fa4 Mon Sep 17 00:00:00 2001
From: Humberto Alfonso Díaz <humberto.alfonso@asvito.es>
Date: Thu, 7 Nov 2019 18:38:21 +0100
Subject: FUNCT Add support to dinamically update header time

---
 src/index.html | 24 +++++++++++++-----------
 src/js/main.js |  2 ++
 src/js/time.js | 33 +++++++++++++++++++++++++++++++++
 3 files changed, 48 insertions(+), 11 deletions(-)
 create mode 100644 src/js/time.js

diff --git a/src/index.html b/src/index.html
index 1cd4732..90b9b19 100644
--- a/src/index.html
+++ b/src/index.html
@@ -32,17 +32,19 @@
                     </div>
                 </a>
             </script>
-            <div class="infoContainer">
-                <div class="infoItem day">
-                    TUESDAY
-                </div>
-                <div class="infoItem hour">
-                    7:26 AM
-                </div>
-                <div class="infoItem wheater">
-                    <span class="icon-rainy"></span>
-                    20ºC
-                </div>
+            <div class="infoContainer" id="timeContainer">
+                <script id="time-template" type="x-tmpl-mustache">
+                    <div class="infoItem day">
+                        {{ day }}
+                    </div>
+                    <div class="infoItem hour">
+                        {{ hour }}
+                    </div>
+                    <div class="infoItem wheater">
+                        <span class="icon-rainy"></span>
+                        20ºC
+                    </div>
+                </script>
             </div>
             <div class="statusContainer" id="networkStatusContainer">
                 <script id="network-status-template" type="x-tmpl-mustache">
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
-- 
cgit 1.2.3-korg