X-Git-Url: https://git.toastfreeware.priv.at/chrisu/seepark.git/blobdiff_plain/8e2b15c9ed5f03146cd999593b4d8515fde79858..1f77d735ef62bbc45e79f692976397dfc19bfbb1:/web/static/seepark_web.js?ds=inline diff --git a/web/static/seepark_web.js b/web/static/seepark_web.js index 63bca13..33fb82d 100644 --- a/web/static/seepark_web.js +++ b/web/static/seepark_web.js @@ -1,6 +1,42 @@ -var api_base_url = '/api/1/sensor/type/Wassertemperatur?mode=consolidated&format=c3'; +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'; -function dayschart(element, interval, days, xtickformat) { +function dayschart(element, title, days, xtickformat) { + var chartdata; + if (element.substr(0, 7) == 'chart_w') { + chartdata = { + url: api_base_url_sensors + beginend(days), + mimeType: 'json', + xs: { + '0316a2193bff': '0316a2193bff_x', + '0316a21383ff': '0316a21383ff_x' + }, + names: { + '0316a2193bff': 'Wassertemperatur in 4 m Tiefe', + '0316a21383ff': 'Wassertemperatur in 5 m Tiefe' + }, + xFormat: '%Y-%m-%d %H:%M:%S', + colors: { + '0316a2193bff': 'lightblue', + '0316a21383ff': 'darkblue' + } + }; + } else { + chartdata = { + url: api_base_url_weather + beginend(days), + mimeType: 'json', + xs: { + '3319578': '3319578_x' + }, + names: { + '3319578': 'Lufttemperatur in Obsteig' + }, + xFormat: '%Y-%m-%d %H:%M:%S', + colors: { + '3319578': 'red' + } + }; + }; var chart = c3.generate({ bindto: '#' + element, size: { @@ -10,25 +46,9 @@ function dayschart(element, interval, days, xtickformat) { duration: null }, title: { - text: 'Der See (' + interval + ')' - }, - data: { - url: api_base_url + beginend(days), - mimeType: 'json', - xs: { - '0316a2193bff': '0316a2193bff_x', - '0316a21383ff': '0316a21383ff_x' - }, - names: { - '0316a2193bff': 'Wassertemperatur in 4 m Tiefe', - '0316a21383ff': 'Wassertemperatur in 5 m Tiefe' - }, - xFormat: '%Y-%m-%d %H:%M:%S', - colors: { - '0316a2193bff': 'lightblue', - '0316a21383ff': 'darkblue' - } + text: title }, + data: chartdata, axis: { x: { type: 'timeseries', @@ -68,10 +88,17 @@ function dayschart(element, interval, days, xtickformat) { }, tooltip: { format: { + // TODO: maybe move to top name: function (name, ratio, id, index) { - var re = /\d m/; - var res = re.exec(name); - return res; + var prefix = ''; + if (element.substr(0, 7) == 'chart_w') { + var re = /\d m/; + prefix = 'Wasser '; + } else { + var re = /Luft/; + }; + var result = re.exec(name); + return prefix + result; }, value: function (value, ratio, id, index) { return value.toFixed(2) + '°'; @@ -94,23 +121,33 @@ function dayschart(element, interval, days, xtickformat) { {axis: 'y', start: 100, end: 999, class: 'region-boiling'} ] }); - }; +}; function loaddays(days) { chart.load({ - url: api_base_url + beginend(days), + url: api_base_url_sensors + beginend(days), mimeType: 'json' }); } function beginend(days) { var now = Date.now(); - var end = new Date(now).toISOString().substr(0, 19); // 2018-06-13T16:52:30.995Z - var begin = new Date(now - days * 60*60*24 * 1000).toISOString().substr(0, 19); + + // TODO: this timezone calculation relies on the browser being in Europe/Vienna + var refdate = new Date(now); + var offset = refdate.getTimezoneOffset(); // -120 for UTC+2 + + var end = new Date(now - offset * 60 * 1000).toISOString().substr(0, 19); // 2018-06-13T16:52:30.995Z + var begin = new Date(now - days * 60*60*24 * 1000 - offset * 60 * 1000).toISOString().substr(0, 19); return '&begin=' + begin + '&end=' + end; } -dayschart('chart1', 'Tag', 1, '%H:%M'); -dayschart('chart7', 'Woche', 7, '%a %d'); -dayschart('chart31', 'Monat', 31, 'Woche %V'); -dayschart('chart365', 'Jahr', 365, '%b %d'); +dayschart('chart_water_1', 'Der See (Tag)', 1, '%H:%M'); +dayschart('chart_water_7', 'Der See (Woche)', 7, '%a %d'); +dayschart('chart_water_31', 'Der See (Monat)', 31, 'Woche %V'); +dayschart('chart_water_365', 'Der See (Jahr)', 365, '%b %Y'); + +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, 'Woche %V'); +dayschart('chart_air_365', 'Die Luft (Jahr)', 365, '%b %Y');