summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorHumberto Alfonso Díaz <humberto.alfonso@asvito.es>2019-12-11 09:50:58 +0100
committerLorenzo Tilve <ltilve@igalia.com>2020-02-04 19:12:47 +0100
commit4c90b15118061f11d7041fd252934c951ca14eec (patch)
tree9acad6b00e98cf43de7e2453b96be71d252029e7
parent4ce65d8965bdebdf35e5f3a4272482c0f40ef2bd (diff)
FUNCT Improve time rendering
-rw-r--r--src/index.js2
-rw-r--r--src/js/time.js11
-rw-r--r--src/templates/time.template.html68
3 files changed, 50 insertions, 31 deletions
diff --git a/src/index.js b/src/index.js
index eb7b4ac..9d2cce0 100644
--- a/src/index.js
+++ b/src/index.js
@@ -21,7 +21,9 @@ import { api } from 'agl-js-api';
import * as app from './js/app';
import * as apps from './js/apps';
+import * as time from './js/time';
window.apps = apps;
+window.time = time;
api.init();
app.init(); \ No newline at end of file
diff --git a/src/js/time.js b/src/js/time.js
index d4c3aa3..3c22419 100644
--- a/src/js/time.js
+++ b/src/js/time.js
@@ -5,6 +5,7 @@ import { weather } from 'agl-js-api';
var template;
var root;
var counter = 0;
+var interval;
var updateTime = 10000;
var page = {
date: {
@@ -65,7 +66,8 @@ function update() {
}
function initInterval() {
- setInterval(update, updateTime);
+ clearInterval(interval);
+ interval = setInterval(update, updateTime);
}
export function init(node) {
@@ -78,4 +80,11 @@ export function init(node) {
}, function(error) {
console.error('ERRROR loading main template', error);
});
+}
+
+export function refresh() {
+ clearInterval();
+ counter = 0;
+ update();
+ initInterval();
} \ No newline at end of file
diff --git a/src/templates/time.template.html b/src/templates/time.template.html
index 5be8b5d..d107ae4 100644
--- a/src/templates/time.template.html
+++ b/src/templates/time.template.html
@@ -4,35 +4,43 @@
<div class="infoItem hour">
{{ date.hour }}
</div>
-<div class="infoItem wheater">
- {{ #showTemperature }}
- <div class="temperature weatherItem">
- <img src="http://openweathermap.org/img/wn/{{ weather.weather.0.icon }}.png">
- {{ weather.main.temp }}ºF
+<a class="infoItem wheater" href="#" onclick="time.refresh()">
+ {{ #weather }}
+ {{ #showTemperature }}
+ <div class="temperature weatherItem">
+ <img src="http://openweathermap.org/img/wn/{{ weather.weather.0.icon }}.png">
+ {{ weather.main.temp }}ºF
+ </div>
+ {{ /showTemperature }}
+ {{ #showWind }}
+ <div class="wind weatherItem">
+ <i class="fas fa-wind"></i>
+ {{ weather.wind.speed }}KMH
+ </div>
+ {{ /showWind }}
+ {{ #showPosition }}
+ <div class="position weatherItem">
+ <i class="fas fa-map-marker-alt"></i>
+ {{ weather.name }}
+ </div>
+ {{ /showPosition }}
+ {{ #showHumidity }}
+ <div class="humidity weatherItem">
+ <i class="fas fa-tint"></i>
+ {{ weather.main.humidity }}%
+ </div>
+ {{ /showHumidity }}
+ {{ #showDescription }}
+ <div class="description weatherItem">
+ <i class="fas fa-info-circle"></i>
+ {{ weather.weather.0.description }}
+ </div>
+ {{ /showDescription}}
+ {{ /weather }}
+ {{ ^weather }}
+ <div class="weatherItem">
+ <i class="fas fa-exclamation-circle"></i>
+ Weather no available
</div>
- {{ /showTemperature }}
- {{ #showWind }}
- <div class="wind weatherItem">
- <i class="fas fa-wind"></i>
- {{ weather.wind.speed }}KMH
- </div>
- {{ /showWind }}
- {{ #showPosition }}
- <div class="position weatherItem">
- <i class="fas fa-map-marker-alt"></i>
- {{ weather.name }}
- </div>
- {{ /showPosition }}
- {{ #showHumidity }}
- <div class="humidity weatherItem">
- <i class="fas fa-tint"></i>
- {{ weather.main.humidity }}%
- </div>
- {{ /showHumidity }}
- {{ #showDescription }}
- <div class="description weatherItem">
- <i class="fas fa-info-circle"></i>
- {{ weather.weather.0.description }}
- </div>
- {{ /showDescription}}
+ {{ /weather }}
</div> \ No newline at end of file