X-Git-Url: https://git.toastfreeware.priv.at/chrisu/seepark.git/blobdiff_plain/1cbe9b42e992ed53c21afc0a5e03167cc0df8f00..e80e0dbc0d2e6ae22d749e595fe633d3395f8ebb:/web/static/seepark_web.js diff --git a/web/static/seepark_web.js b/web/static/seepark_web.js index 721c586..bc0f8c3 100644 --- a/web/static/seepark_web.js +++ b/web/static/seepark_web.js @@ -1,5 +1,8 @@ var api_base_url_sensors = '/api/1/sensor/type/Wassertemperatur?mode=consolidated&format=c3'; var api_base_url_weather = '/api/1/openweathermap/city/3319578?mode=consolidated&format=c3'; +var api_url_currentair = '/api/1/currentairtemperature'; +var api_url_currentwater = '/api/1/currentwatertemperature'; +var refresh_interval = 10 * 60 * 1000; function dayschart(element, title, days, xtickformat) { var chartdata; @@ -27,6 +30,7 @@ function dayschart(element, title, days, xtickformat) { '0416a1bab9ff': 'mediumblue', '0316a2193bff': 'midnightblue' }, + type: 'line', // default /* xSort: false, order: function (a, b) { @@ -52,7 +56,8 @@ function dayschart(element, title, days, xtickformat) { xFormat: '%Y-%m-%d %H:%M:%S', colors: { '3319578': 'red' - } + }, + type: 'spline', }; }; var chart = c3.generate({ @@ -64,7 +69,6 @@ function dayschart(element, title, days, xtickformat) { chart.resize({ width: getwidth(element) }); - // chart.flush(); }, transition: { duration: null @@ -146,6 +150,9 @@ function dayschart(element, title, days, xtickformat) { grid: { y: { show: true + }, + x: { + show: true } }, regions: [ @@ -155,8 +162,17 @@ function dayschart(element, title, days, xtickformat) { {axis: 'y', start: 100, end: 999, class: 'region-boiling'} ] }); - // woraround for unrendered dots + + // workaround for unrendered dots setTimeout(function () { chart.flush(); }, 5000); + + // reload data in charts + setInterval( + function() { + loaddays(chart, element, days); + }, + refresh_interval + ); }; function loaddays(chart, element, days) { @@ -164,14 +180,17 @@ function loaddays(chart, element, days) { if (element.substr(0, 7) == 'chart_w') { chart.load({ url: api_base_url_sensors + beginend(days), - mimeType: 'json' + mimeType: 'json', + unload: true }); } else { chart.load({ url: api_base_url_weather + beginend(days), - mimeType: 'json' + mimeType: 'json', + unload: true }); - } + }; + setTimeout(function () { chart.flush(); }, 5000); } function beginend(days) { @@ -199,3 +218,40 @@ dayschart('chart_air_1', 'Die Luft (Tag)', 1, '%H:%M'); dayschart('chart_air_7', 'Die Luft (Woche)', 7, '%a %d'); dayschart('chart_air_31', 'Die Luft (Monat)', 31, '%Y-%m-%d'); dayschart('chart_air_365', 'Die Luft (Jahr)', 365, '%b %Y'); + +// reload current values + owm script +setInterval( + function() { + var airvalue = document.getElementById('currentairvalue'); + var airtime = document.getElementById('currentairtime'); + var watervalue = document.getElementById('currentwatervalue'); + var watertime = document.getElementById('currentwatertime'); + fetch(api_url_currentair) + .then((resp) => resp.json()) + .then(function(data) { + airvalue.innerText = data['value'].toFixed(1); + airtime.innerText = strftime('%Y-%m-%d %H:%M', new Date(data['timestamp'])); + }) + .catch(function(error) { + console.log(error); + }); + fetch(api_url_currentwater) + .then((resp) => resp.json()) + .then(function(data) { + watervalue.innerText = data['value'].toFixed(1); + watertime.innerText = strftime('%Y-%m-%d %H:%M', new Date(data['timestamp'])); + }) + .catch(function(error) { + console.log(error); + }); + + var owmwidget = document.getElementById('openweathermap-widget-15'); + owmwidget.removeChild(owmwidget.childNodes[0]); + var owmscript = document.head.lastElementChild; + document.head.removeChild(owmscript); + var newowmscript = document.createElement('script'); + newowmscript.src = '//openweathermap.org/themes/openweathermap/assets/vendor/owm/js/weather-widget-generator.js'; + document.head.appendChild(newowmscript); + }, + refresh_interval +);