WIP **** WIP

funktioniert nur teilweise: Umschaltung auf en geht seltsamerwesie nicht

public/javascripts/chart_utilities.js

@@ -162,9 +162,7 @@ export function calcDays(data, isyear) {
 };
 
 export async function addSensorID2chart(chart, sensor, width) {
-    console.log('widht: ',width);
     let indoor = sensor.indoor || false
-    console.log('indoor: ',indoor)
     let sens = chart.renderer.label(
         `Sensor: ${sensor.sid} ${indoor ? ' (indoor)' : ''}`,
         width / 2 - 100, 65,
@@ -184,6 +182,11 @@ export const showError = (err) => {
     myModal.show()
 }
 
+export const showReset = () => {
+    let myModal = new bootstrap.Modal(document.getElementById('dialogReset'))
+    myModal.show()
+}
+
 // remove the taps (if shownig the map)
 export const removeTabs = () => {
     document.querySelector('#navi').style.display = 'none'

public/javascripts/checklang.js

@@ -0,0 +1,11 @@
+// set correct language
+let currentLang
+const navLang = navigator.language.slice(0,2)
+const selectedLang =  localStorage.getItem('curlang')
+if (!selectedLang) {
+    currentLang = navLang
+} else {
+    currentLang = selectedLang
+}
+window.location.href = '/?lng=' + currentLang
+

public/javascripts/global.js

@@ -6,7 +6,7 @@ import * as dt from './datetime.js'
 import {logerror, logit} from './logit.js'
 import {tabtable, loadAll, showChart} from './showcharts.js'
 import { DateTime } from './luxon.min.js'
-
+import {showReset} from "./chart_utilities.js";
 
 (async () => {
 
@@ -26,30 +26,43 @@ import { DateTime } from './luxon.min.js'
         seldate: 'today',
         refresh: 0,
     }
+    let currentTab = ''
 
     // END global variables
 
+
+
+
     // Register events
     document.querySelector('#btnSave').addEventListener('click', async () => {
         const selDate = document.getElementById('startday').value
         let starttime
         if (selDate === 'today') {
             starttime = DateTime.now().toISO()
+            params.datetime = ''
         } else {
             starttime = DateTime.fromFormat(selDate, 'yyyy-MM-dd').toISO()
+            params.datetime = starttime
         }
         params.seldate = selDate
         const span = document.getElementById('nbrofdays').value
         const peak = document.getElementById('peaklim').value
         console.log(starttime, span, peak)
-        params.datetime = starttime
         if(span < 10) {
             params.span = span
         }
         if(peak < 130 ) {
             params.peak = peak
         }
-        await loadAll(params)
+        let newlng = document.querySelector('#sellan input:checked').id
+        let oldlng = localStorage.getItem('curlang')
+        localStorage.setItem('curlang', newlng)
+        if(newlng !== oldlng) {
+            location.reload()
+        }
+        if(params.sid !== undefined) {
+            await loadAll(params)
+        }
     })
 
 
@@ -66,10 +79,21 @@ import { DateTime } from './luxon.min.js'
         myModal.show()
     })
 
+
     // main function:
-    // show the map if calle w/o any parameter
+    // show the map if called w/o any parameter
     // if called with a sensor-ID, show the live chart for this sensor
     async function main() {
+        // set correct language
+        const currentLang =  localStorage.getItem('curlang')
+        if(currentLang === 'en') {
+            document.querySelector('#en').checked = true
+        } else {
+            document.querySelector('#de').checked = true
+        }
+        console.log(currentLang)
+        history.pushState({}, '', '/')
+
         // initialise tabs
         let triggerTabList = [].slice.call(document.querySelectorAll('.nav-link'))
         triggerTabList.forEach(function (triggerEl) {
@@ -78,6 +102,11 @@ import { DateTime } from './luxon.min.js'
             triggerEl.addEventListener('click', function (event) {
                 event.preventDefault()
                 tabTrigger.show()
+                currentTab = event.currentTarget.id
+                if (currentTab === 'maptab') {
+                    map.showMap(params)
+                    document.querySelector('#sellan').style.display = 'inline'
+                }
             })
         })
 
@@ -100,6 +129,7 @@ import { DateTime } from './luxon.min.js'
             }
         } else {
             // show the map
+            document.querySelector('#sellan').style.display = 'inline'
             map.showMap(params)
         }
     }

public/javascripts/map.js

@@ -12,10 +12,10 @@ let clickedcoords = {}
 
 const colorscale = ['#d53e4f', '#fc8d59', '#fee08b', '#e6f598', '#99d594', '#3288bd', '#808080'];
 const dba = [100, 80, 60, 40, 20, 0, -999];
+const APIURL = '/api/getmapdata?'
 
 export async function showMap(params) {
     utils.removeTabs()
-
     if(map && map.remove) {
         map.off();
         map.remove();
@@ -58,11 +58,14 @@ export async function showMap(params) {
             params.sid = clickedSensor
             let triggerEl = document.querySelector('#livetab')
             bootstrap.Tab.getInstance(triggerEl).show() // Select tab by name
+            localStorage.setItem('activeTab', 'livetab')
             let ok = await showChart(params, 'live', 'dlive')
             if (ok) {
                 await loadAll(params)
             }
-            map.setView([clickedcoords.lat, clickedcoords.lng]);
+            params.center = [clickedcoords.lat, clickedcoords.lng]
+//            map.setView([clickedcoords.lat, clickedcoords.lng]);
+            document.querySelector('#sellan').style.display = 'none'
         })
     })
 }
@@ -164,7 +167,7 @@ export async function buildMarkers() {
         west: bounds.getWest(), south: bounds.getSouth(),
         east: bounds.getEast(), north: bounds.getNorth()
     }
-    const url = `/api/getmapdata?type=noise&box=${bounds.toBBoxString()}`
+    const url = APIURL + `type=noise&box=${bounds.toBBoxString()}`
 
     let ret = await fetch(url)
         .catch(e => {
@@ -264,7 +267,7 @@ async function setCenter(adr) {
 
 // Show the last date below tha map grafics
 async function showLastDate(ld) {
-    const url = `/api/getmapdata?type=noise`
+    const url = APIURL + 'type=noise'
     let ret = await fetch(url)
         .catch(e => {
             console.log(e)

public/javascripts/showcharts.js

@@ -55,8 +55,8 @@ export async function showChart(params, typ, container) {
             return this.axis.defaultLabelFormatter.call(this);
         }
     }
-
-    const url = `/api/getsensordata?sensorid=${params.sid}&data=${typ}&span=${params.span}&datetime=${params.datetime.slice(0,-10)}&peak=${params.peak}`
+    const curlang = localStorage.getItem('curlang')
+    const url = `/api/getsensordata?sensorid=${params.sid}&data=${typ}&span=${params.span}&datetime=${params.datetime.slice(0,-10)}&peak=${params.peak}&lng=en`
     let ret = await fetch(url)
         .catch(e => {
             logerror(e)