diff --git a/charts/preparecharts.js b/charts/preparecharts.js index d488051..d9e37b4 100644 --- a/charts/preparecharts.js +++ b/charts/preparecharts.js @@ -229,14 +229,14 @@ export const havgData = (params, values) => { ] options.series = [ { - name: 'Mean value LAeq', + name: `${trans('MeanValueLAeq')}`, data: series1, color: utils.colors.eq, type: 'column', zIndex: 2, yAxis: 0 }, { - name: 'Peaks', + name: `${trans('Peaks')}`, data: series2, color: utils.colors.peaks, type: 'column', @@ -328,14 +328,14 @@ export const davgData = (params, values) => { options.series = [ { - name: 'Mean value LAeq', + name: `${trans('MeanValueLAeq')}`, data: series1, color: utils.colors.eq, type: 'column', zIndex: 2, yAxis: 0 },{ - name: 'Peaks', + name: `${trans('Peaks')}`, data: series2, color: utils.colors.peaks, type: 'column', @@ -409,14 +409,14 @@ export const dayNightData = (params, values) => { } options.series = [ { - name: 'Day', + name: `${trans('Day')}`, data: series1, color: utils.colors.eq, type: 'column', zIndex: 2, }, { - name: 'Night', + name: `${trans('Night')}`, data: series2, color: utils.colors.max, type: 'column', @@ -491,7 +491,7 @@ export const ldenData = (params, values) => { } options.series = [ { - name: 'lden', + name: 'Lden', data: series1, color: utils.colors.eq, type: 'column', diff --git a/charts/utilities.js b/charts/utilities.js index f7593f9..63fb1e4 100644 --- a/charts/utilities.js +++ b/charts/utilities.js @@ -6,6 +6,7 @@ let language = 'en' export const colors = {'eq': '#0000FF', 'max': '#FF0000', 'min': '#008000', 'peaks': '#DAA520'}; export const noise_ymin = 30; +export const noise_ymax = 120; export function createGlobObtions() { // Options, die für alle Plots identisch sind diff --git a/locales/de/translation.json b/locales/de/translation.json index b32ac82..aa8c0d6 100644 --- a/locales/de/translation.json +++ b/locales/de/translation.json @@ -1,5 +1,5 @@ { - "NoiseMeasurement": "Lärm-Messung", + "NoiseMeasurement": "Lärm-Messung", "Settings": "Einstellungen", "Info": "Info", "StartDate": "Start Datum", @@ -43,5 +43,9 @@ "RemoveFromMap": "Sensoren nicht anzeigen, die nicht gesendet haben seit", "weeks": "Wochen", "ESYSCALL": "Fehler vom Serveraufruf: ", - "Error": "Fehler" + "Error": "Fehler", + "MeanValueLAeq": "Mittelwert LAeq", + "Peaks": "Spitzen", + "Day": "Tag", + "Night": "Nacht" } \ No newline at end of file diff --git a/locales/en/translation.json b/locales/en/translation.json index 80aa3eb..ddfa388 100644 --- a/locales/en/translation.json +++ b/locales/en/translation.json @@ -43,5 +43,9 @@ "RemoveFromMap": "Don't show sensors that have not sent for", "weeks": "weeks", "ESYSCALL": "Error from Syscall: ", - "Error": "Error" + "Error": "Error", + "MeanValueLAeq": "Mean value LAeq", + "Peaks": "Peaks", + "Day": "Day", + "Night": "Night" } \ No newline at end of file diff --git a/public/javascripts/chart_utilities.js b/public/javascripts/chart_utilities.js index 7b26ee3..420f6a6 100644 --- a/public/javascripts/chart_utilities.js +++ b/public/javascripts/chart_utilities.js @@ -162,8 +162,9 @@ export function calcDays(data, isyear) { export async function addSensorID2chart(chart, sensor, width) { let indoor = sensor.indoor || false + let addr = await addAddress(sensor.sid) let sens = chart.renderer.label( - `Sensor: ${sensor.sid} ${indoor ? ' (indoor)' : ''}`, + `Sensor: ${sensor.sid} ${indoor ? ' (indoor)' : ''}    ${addr}`, width / 2 - 100, 65, 'text', 0, 0, true) .css({ @@ -212,4 +213,14 @@ export const fetchfromserver = async (url) => { // return await ret.json() let x = await ret.json() return x -} \ No newline at end of file +} + +export const addAddress = async (sid) => { + let url = `/api/getaddress?sensorid=${sid}` + let erg = await fetchfromserver(url) + if (!erg.err) { + return erg.address + } else { + return "no address" + } +} diff --git a/public/javascripts/datetime.js b/public/javascripts/datetime.js index 07a7f3b..ba0bbc3 100644 --- a/public/javascripts/datetime.js +++ b/public/javascripts/datetime.js @@ -21,31 +21,6 @@ export const showDate = (sofort, params) => { } } -/* ToDo: - // Alle Minute die ktuelle Urzeit anzeigen und - // den Plot für Tages - und Wochendaten updaten. - // Alle 'refreshRate' plus 15sec die Grafiken neu zeichnen - // Die Funktion wird alle Sekunde aufgerufen ! - // -function showUhrzeit(sofort) { - var d = moment() // akt. Zeit holen - if (sofort || (d.second() == 0)) { // Wenn Minute grade um - $('#h1uhr').html(d.format('HH:mm')); - $('#subtitle').html(d.format('YYYY-MM-DD')); // dann zeit anzeigen - } - if (((d.minute() % refreshRate) == 0) && (d.second() == 15)) { // alle ganzen refreshRate Minuten, 15sec danach - console.log(refreshRate, 'Minuten um, Grafik wird erneuert'); - if ((aktsensorid != 'map') && (doUpdate == true)) { // Wenn nicht die Karte, dann - doPlot('oneday',startDay); // Tages- und - doPlot('oneweek',startDay); // Wochenplot erneuern - } - else { - fetchAktualData(); - } - } -} - -*/ export const formatJSDate = (d) => { return DateTime.fromJSDate(d).toFormat('yyyy-LL-dd HH:mm:ss') } diff --git a/public/javascripts/global.js b/public/javascripts/global.js index 8282c74..7f28ce8 100644 --- a/public/javascripts/global.js +++ b/public/javascripts/global.js @@ -22,7 +22,7 @@ import {setCurrentTab, getCurrentTab, showError, fetchfromserver} from "./chart_ weeks: 4, datetime: '', seldate: '', - refreshRate: 1, + refreshRate: 5, sid: -1 } @@ -81,7 +81,7 @@ import {setCurrentTab, getCurrentTab, showError, fetchfromserver} from "./chart_ const elem = document.querySelector('#startday') const datepicker = new Datepicker(elem, { buttonClass: 'btn', - autoHide: true, + autohide: true, format: 'yyyy-mm-dd', language: lang, maxDate: new Date(), diff --git a/public/javascripts/map.js b/public/javascripts/map.js index 97a408a..8fd6e99 100644 --- a/public/javascripts/map.js +++ b/public/javascripts/map.js @@ -3,7 +3,7 @@ import * as dt from './datetime.js' import * as utils from "./chart_utilities.js" import { showChart, loadAll } from './showcharts.js' -import {fetchfromserver} from "./chart_utilities.js"; +import {fetchfromserver, addAddress} from "./chart_utilities.js"; let map = null let bounds @@ -51,28 +51,6 @@ export async function showMap(params) { let lastdate = await buildMarkers(params) showLastDate(lastdate); - - // map.on('popupopen', function () { - // let link = document.querySelector('.speciallink') - // link.addEventListener('click', async function (ev) { - // console.log(`Event clicked: ${clickedSensor}`) - // utils.showTabs() - // document.querySelector('#odth').style.display = 'none' - // document.querySelector('#nbday').style.display = 'inline' - // params.sid = clickedSensor - // let triggerEl = document.querySelector('#livetab') - // bootstrap.Tab.getInstance(triggerEl).show() // Select tab by name - // localStorage.setItem('activeTab', 'livetab') - // utils.setCurrentTab('livetab') - // let ok = await showChart(params, 'live', 'dlive') - // if (ok) { - // await loadAll(params) - // } - // params.center = [clickedcoords.lat, clickedcoords.lng] - // map.setView([clickedcoords.lat, clickedcoords.lng]); - // ev.preventDefault() - // }) - // }) } @@ -208,7 +186,6 @@ export async function buildMarkers(params) { indoor: x.indoor }) .on('click', e => onMarkerClick(e, true, sensors.popuptxt, params)) // define click- and - .bindPopup(popuptext); // and bind the popup text markers.addLayer(marker); } map.addLayer(markers); @@ -246,42 +223,26 @@ return popuptext async function onMarkerClick(e, click, txts, params) { let item = e.target.options; - let popup = e.target.getPopup(); let popuptext = await bauPopupText(item, txts) - popup.setContent(popuptext); // set text into popup - e.target.openPopup(); // show the popup - - - let link = document.querySelector('.speciallink') - link.addEventListener('click', async function (ev) { - console.log(`Event clicked: ${clickedSensor}`) - params.sid = item.name - let ok = await showChart(params, 'live', 'dlive') - if (ok) { - params.center = [clickedcoords.lat, clickedcoords.lng] - map.setView([clickedcoords.lat, clickedcoords.lng]); - ev.preventDefault() - await loadAll(params) - } - }) - - - -// if (click == true) { // if we clicked -// e.target.closePopup(); // show the popup -// } + e.target.bindPopup(popuptext).openPopup(); // show the popup + let link = document.querySelector('.speciallink') + link.addEventListener('click', async function (ev) { + console.log(`Event clicked: ${clickedSensor}`) + params.sid = item.name + let ok = await showChart(params, 'live', 'dlive') + if (ok) { + let triggerEl = document.querySelector(`#livetab`) + bootstrap.Tab.getInstance(triggerEl).show() // Select tab by name + utils.setCurrentTab('livetab') + params.center = [e.latlng.lat, e.latlng.lng] + map.setView([e.latlng.lat, e.latlng.lng]); + ev.preventDefault() + await loadAll(params) + } + }) } // add address to PopUp -async function addAddress(sid) { - let url = `/api/getaddress?sensorid=${sid}` - let erg = await fetchfromserver(url) - if (!erg.err) { - return erg.address - } else { - return "no address" - } -} /* async function getCoords(city) { let url = NOMINATIM_URL + city; diff --git a/public/javascripts/showcharts.js b/public/javascripts/showcharts.js index 15a63fb..746fbb9 100644 --- a/public/javascripts/showcharts.js +++ b/public/javascripts/showcharts.js @@ -63,22 +63,9 @@ export async function showChart(params, typ, container) { } let erg = await fetchfromserver(url) if (!erg.err) { - let tabt = "" - for (let x of tabtable) { - if(x.type === typ) { - tabt = x.id - break - } - } utils.showTabs() document.querySelector('#odth').style.display = 'none' document.querySelector('#nbday').style.display = 'inline' - let triggerEl = document.querySelector(`#${tabt}`) - bootstrap.Tab.getInstance(triggerEl).show() // Select tab by name - localStorage.setItem('activeTab', tabt) - utils.setCurrentTab(tabt) - - erg.options.xAxis.labels.formatter = xformat erg.options.tooltip.formatter = form let chart = Highcharts.chart(container, erg.options, function (chart) { @@ -119,7 +106,6 @@ export const loadAll = async (params, start = 2) => { start++ } if (params.sid !== -1) { - utils.showTabs() for (let i = start; i < tabtable.length; i++) { let ok = await showChart(params, tabtable[i].type, tabtable[i].container) if (!ok) { diff --git a/public/stylesheets/style.css b/public/stylesheets/style.css index 2e69399..368a1e5 100644 --- a/public/stylesheets/style.css +++ b/public/stylesheets/style.css @@ -260,4 +260,9 @@ footer #author #versn { margin-bottom: 10px; } +.bigger { + font-size: 120%; + font-weight: bold; +} + /*# sourceMappingURL=style.css.map */ diff --git a/public/stylesheets/style.css.map b/public/stylesheets/style.css.map index c4c6c5c..5dd787f 100644 --- a/public/stylesheets/style.css.map +++ b/public/stylesheets/style.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["style.sass"],"names":[],"mappings":"AAYA;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAEF;EACE;EACA;EACA;EAEA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE,kBA9BoB;;AAgCpB;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;;;AAEJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEF;EACE;EACA;;AACA;EACE;;;AAEN;EACE;EAEA;EACA;EACA,eA5Ec;EA6Ed;EACA;EACA;;AAEA;EACE;EACA;EACA;;AACF;EACE;EACA;;;AAEJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AACF;EACE;EACA;;;AAEJ;EACE,kBAhGoB;;AAkGpB;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEF;EACE;;;AAGN;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;EACE;;;AAEF;EACE;EACA;;;AAGF;EAEE;;;AAGF;EACE;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;IACE;;;AAEJ;EACE,kBAnNa;EAoNb;;;AAEF;EACE,OAvNa;EAwNb;;;AAGF;EACE;;;AAKF;EACE;EACA;EACA;EACA;;;AAEF;EACE;EACA","file":"style.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["style.sass"],"names":[],"mappings":"AAYA;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAEF;EACE;EACA;EACA;EAEA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE,kBA9BoB;;AAgCpB;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;;;AAEJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEF;EACE;EACA;;AACA;EACE;;;AAEN;EACE;EAEA;EACA;EACA,eA5Ec;EA6Ed;EACA;EACA;;AAEA;EACE;EACA;EACA;;AACF;EACE;EACA;;;AAEJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AACF;EACE;EACA;;;AAEJ;EACE,kBAhGoB;;AAkGpB;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEF;EACE;;;AAGN;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;EACE;;;AAEF;EACE;EACA;;;AAGF;EAEE;;;AAGF;EACE;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;IACE;;;AAEJ;EACE,kBAnNa;EAoNb;;;AAEF;EACE,OAvNa;EAwNb;;;AAGF;EACE;;;AAKF;EACE;EACA;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA","file":"style.css"} \ No newline at end of file diff --git a/public/stylesheets/style.sass b/public/stylesheets/style.sass index 5528605..fb5b045 100644 --- a/public/stylesheets/style.sass +++ b/public/stylesheets/style.sass @@ -241,4 +241,8 @@ footer .addr font-weight: bold - margin-bottom: 10px \ No newline at end of file + margin-bottom: 10px + +.bigger + font-size: 120% + font-weight: bold diff --git a/views/index.pug b/views/index.pug index 27f7540..4fe0fdf 100644 --- a/views/index.pug +++ b/views/index.pug @@ -81,7 +81,7 @@ block content .column#nbday label.thelabels(for='nbrofdays') | #{t("NumberOfDays")}:
- span.klein (#{t("Only_for_live_chart")}) + // span.klein (#{t("Only_for_live_chart")}) input.theInputs#nbrofdays(type = 'number' name = 'nbrofdays', min="1", max="10") span.klein   (max. 10) .column#pklim diff --git a/views/layout.pug b/views/layout.pug index 55ce07d..7ae28a1 100644 --- a/views/layout.pug +++ b/views/layout.pug @@ -10,7 +10,7 @@ html integrity="sha256-kLaT2GOSpHechhsozzB+flnD+zUyjE2LlfWPgU04xyI=" crossorigin="") link(rel='stylesheet', href='/stylesheets/MarkerCluster.css') - link(rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr@4.6.13/dist/flatpickr.min.css") + // link(rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr@4.6.13/dist/flatpickr.min.css") link(rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vanillajs-datepicker@1.3.1/dist/css/datepicker.min.css") link(rel='stylesheet', href='/stylesheets/style.css') @@ -21,18 +21,6 @@ html csid: '#{csensor}' } - let urlParams = { - // drawlines: '#{drawlines}' === 'true', - // starttime: '#{starttime}', - // endtime: '#{endtime}', - // nbrentries: '#{nbrentries}', - // device: '#{device}', - // coordinates: '#{coordinates}' === 'true', - // center: JSON.parse('#{center}'), - // zoom: '#{zoom}', - // refresh: '#{refresh}' - } - body #wrapper block content