extends layout

block content
  script.
    function chglang(x) {
      // localStorage.setItem('curlang', x.slice(-2))
      // location.href = x
      // history.pushState({}, '', '/')
    }

  header
    #hline1
      #h1name #{t("NoiseMeasurement")}
      #buttonsRight
        button.btn.btn-primary#btnSet(value='set') #{t("Settings")}
        button.btn.btn-primary#btnHelp(value='help') #{t("Info")}
        #h1datum

  #fenster
    #navi
      ul.nav.nav-tabs#tablist
        li.nav-item(role='presentation')
          button.nav-link.active#maptab(data-bs-toggle="tab" data-bs-target="#t_map" type="button" role="tab" aria-controls="map" aria-selected="true") #{t("Map")}
        li.nav-item(role='presentation')
          button.nav-link#livetab(data-bs-toggle="tab" data-bs-target="#t_live" type="button" role="tab" aria-controls="live" aria-selected="true") #{t("Live")}
        li.nav-item(role='presentation')
          button.nav-link#houravgtab(data-bs-toggle="tab" data-bs-target="#t_houravg" type="button" role="tab" aria-controls="houravg" aria-selected="true") #{t("Hour_AVG")}
        li.nav-item(role='presentation')
          button.nav-link#dayavgtab(data-bs-toggle="tab" data-bs-target="#t_dayavg" type="button" role="tab" aria-controls="dayavg" aria-selected="true") #{t("Day_AVG")}
        li.nav-item(role='presentation')
          button.nav-link#daynighttab(data-bs-toggle="tab" data-bs-target="#t_daynight" type="button" role="tab" aria-controls="daynight" aria-selected="true") #{t("Day_Night")}
        li.nav-item(role='presentation')
          button.nav-link#ldentab(data-bs-toggle="tab" data-bs-target="#t_lden" type="button" role="tab" aria-controls="lden" aria-selected="true") L<sub>DEN</sub>-Index
    .tab-content#thetabs
      .tab-pane.fade.show.active#t_map(role="tabpanel" aria-labelledby="map-tab")
        #map
        #mapdateactsens
          #actsensors
          #mapdate
      .tab-pane.fade#t_live(role="tabpanel" aria-labelledby="live-tab")
        #dlive
      .tab-pane.fade#t_houravg(role="tabpanel" aria-labelledby="map-tab")
        #dhour
      .tab-pane.fade#t_dayavg(role="tabpanel" aria-labelledby="map-tab")
        #dday
      .tab-pane.fade#t_daynight(role="tabpanel" aria-labelledby="map-tab")
        #ddaynight  DayNightTAB
      .tab-pane.fade#t_lden(role="tabpanel" aria-labelledby="map-tab")
        #dlden


  // Error-Dialog
  .modal.fade#dialogError(tabindex="-1" role="dialog" aria-labelledby="Error" aria-hidden="true")
    .modal-dialog.modal-dialog-centered(role="document")
      .modal-content
        .modal-header
          h5.modal-title.dialogErrorTitle #{t("Error")}
          button(type="button" class="close" data-bs-dismiss="modal" aria-label="Close")
            span(aria-hidden="true") &times;
        .modal-body
        .modal-footer
          //button(type="button" class="btn btn-secondary" data-bs-dismiss="modal") Close
          // button(type="button" class="btn btn-primary") Save changes


  // Settings-Dialog
  .modal.fade#dialogSettings(tabindex="-1" role="dialog" aria-labelledby="Settings" aria-hidden="true")
    .modal-dialog.modal-dialog-centered(role="document")
      .modal-content
        .modal-header
          h5.modal-title.dialogErrorTitle #{t("Settings")}
          button(type="button" class="close" data-bs-dismiss="modal" aria-label="Close")
            span(aria-hidden="true") &times;
        .modal-body.settings
          .rows
            .column#stday
              label.thelabels(for='startday') #{t("StartDate")}:
              input.theInputs#startday(name='startday' )
            .column
            .column#nbday
              label.thelabels(for='nbrofdays')
                | #{t("NumberOfDays")}:<br />
                // span.klein (#{t("Only_for_live_chart")})
              input.theInputs#nbrofdays(type = 'number' name = 'nbrofdays', min="1", max="10")
              span.klein &nbsp;&nbsp;(max. 10)
            .column#pklim
              label.thelabels(for='peaklim')
                | #{t("Count_peaks_over")}
              input.theInputs#peaklim(type = 'number' name = 'peaklim', min="10", max="130")
              | &nbsp;&nbsp;dbA
              span.klein &nbsp;&nbsp;(max. 130)
            .column#odth
              label.thelabels(for='olderthan')
                | #{t("RemoveFromMap")}
              input.theInputs#olderthan(type = 'number' name = 'olderthan', min="0", max="52")
              | &nbsp;&nbsp;#{t("weeks")}
              span.klein &nbsp;&nbsp;(max. 52)
            .column
            .column#sellan
              label.thelabels
                | #{t("Language")}:
              .form-check.form-check-inline
                input#de.form-check-input(type="radio" name="lanbut")
                label.form-check-label(for='de') Deutsch
              .form-check.form-check-inline
                input#en.form-check-input(type="radio" name="lanbut", checked)
                label.form-check-label(for="en") English
        .modal-footer
          button.btn.btn-secondary(type="button" data-bs-dismiss="modal") #{t("Close")}
          button#btnSave.btn.btn-primary(type="button" data-bs-dismiss="modal") #{t("Save_changes")}


  // Error-Dialog
  .modal.fade#dialogReset(tabindex="-1" role="dialog" aria-labelledby="Error" aria-hidden="true")
    .modal-dialog.modal-dialog-centered(role="document")
      .modal-content
        .modal-header
          h5.modal-title.dialogErrorTitle Info
          button(type="button" class="close" data-bs-dismiss="modal" aria-label="Close")
            span(aria-hidden="true") &times;
        .modal-body
        .modal-footer
          //button(type="button" class="btn btn-secondary" data-bs-dismiss="modal") Close
          button(type="button" class="btn btn-primary" data-bs-dismiss="modal") OK