extends layout

block content
    script.
        var selName='#{name}';
        var startday='#{stday}';
        var csid = '#{csensor}';
        var fzoom = '#{zoom}';
        const curversion = '#{version}'
        const splash = '#{splash}';
        const city = '#{city}';


    header
    nav.navbar.navbar-expand-sm.navbar-light.navbg
        button.navbar-toggler(type="button" data-toggle="collapse" data-target="#navbarSupportContent")
            span.navbar-toggler-icon
        #navbarSupportContent.collapse.navbar-collapse
            ul.navbar-nav.mr-auto
                .btn-group#zrohr
                    button.btn.btn-success.mybuttons  Zählrohre
                    button.btn.btn-success.mybuttons.dropdown-toggle.dropdown-toggle-split(type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false")
                        span.sr-only Zählrohre
                    .dropdown-menu(aria-labelledby="dropdownMenu2")
                        .dropdown-header Zählrohre
                            .custom-control.custom-radio.ml-3
                                input.custom-control-input.btnrohr#btnall(type="radio" value="all" name="rohre" checked)
                                label.custom-control-label(for="btnall") Alle Zählrohre anzeigen
                            .custom-control.custom-radio.ml-3
                                input.custom-control-input.btnrohr#btnsig(type="radio" value="sig" name="rohre")
                                label.custom-control-label(for="btnsig") nur Si22G anzeigen

                    .btn-group#kraftw
                        button.btn.btn-success.mybuttons  AKWs/Anlagen
                        button.btn.btn-success.mybuttons.dropdown-toggle.dropdown-toggle-split(type="button" id="dropdownMenu3" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false")
                            span.sr-only AKWs/Anlagen
                        .dropdown-menu(aria-labelledby="dropdownMenu3")
                            .dropdown-header Kraftwerke anzeigen
                                .custom-control.custom-checkbox.ml-3
                                    input.custom-control-input.btnakw#btnakwact(type="checkbox" checked)
                                    label.custom-control-label(for="btnakwact") aktive
                                .custom-control.custom-checkbox.ml-3
                                    input.custom-control-input.btnakw#btnakwstill(type="checkbox" checked)
                                    label.custom-control-label(for="btnakwstill") stillgelegte
                                .custom-control.custom-checkbox.ml-3
                                    input.custom-control-input.btnakw#btnakwrest(type="checkbox" checked)
                                    label.custom-control-label(for="btnakwrest") sonstige Anlagen

                        .btn-group#togwind
                            button.btn.btn-success.mybuttons  Wind
                            button.btn.btn-success.mybuttons.dropdown-toggle.dropdown-toggle-split(type="button" id="dropdownMenu4" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false")
                                span.sr-only Wind
                            .dropdown-menu(aria-labelledby="dropdownMenu4")
                                .dropdown-header Wind-Layer
                                    .custom-control.custom-checkbox.ml-3
                                        input.custom-control-input.btnakw#btnwind(type="checkbox")
                                        label.custom-control-label(for="btnwind") Wind anzeigen

            ul.navbar-nav
                    button.btn.btn-success.mybuttons#btnlegende Legende
                    .input-wrapper.mr-3
                        input.form-control#newmapcenter(type="search" placeholder="Sensor suchen" aria_label="Suche")
                        label.fas.fa-search.input-icon(for="newmapcenter")
                    button.btn.btn-success.mybuttons#btninfo Info
    #map
        #legendcontainer
            .legend#legendcpm
                #legend-inner-cpm
                    .gradient
                    .labels
                        .label(style="bottom: 100%;") >= 5 µSv/h
                        .label(style="bottom: 86%;") 2
                        .label(style="bottom: 72%;") 1
                        .label(style="bottom: 58%;") 0.5
                        .label(style="bottom: 44%;") 0.2
                        .label(style="bottom: 30%;") 0.1
                        .label(style="bottom: 17%;") 0.05
                        .label1(style="bottom: 10%;") offline
                        .label1(style="bottom: 2%;") indoor

    #overlay
        nav.navbar.navbar-expand.navbar-light.navbg
            button.navbar-toggler(type="button" data-toggle="collapse" data-target="#navbarOverlayContent")
                span.navbar-toggler-icon
            #navbarOverlayContent.collapse.navbar-collapse
                ul.navbar-nav.mr-auto
                    button.btn.btn-success#btnmo(value="month") 30 d
                    button.btn.btn-success#btnwe(value="week") 7 d
                    button.btn.btn-success#btnda(autofocus="true",value="day") 24 h
                ul.navbar-nav
                    button.btn.btn-success#btnset(value='set') Einstellung
                    button.btn.btn-success#btnend(value='map') Ende
        #loading Lade die Daten ...
        #placeholderFS_1
        #placeholderBME
        #dialogWinSet
    #author
        #mailadr
            a(href="mailto:multigeiger@ecocurious.de") mailto:multigeiger@ecocurious.de
        #versn Version: #{version} vom #{date}


    #dialogCenter.dialog
    #dialogWinHelp
    #page-mask

    <!-- Modal Dialog -->
    #myModal.modal.fade(role="dialog")
        .modal-dialog.modal-lg(role="document")
            <!-- Modal content-->
            .modal-content
                .modal-header
                    h4#modalTitle.modal-title
                    button.close(type="button" data-dismiss="modal") &times;
                .modal-body
                .modal-footer
                    button.btn.btn-default(type="button" data-dismiss="modal") Schließen

    <!-- Modal Dialog -->
    #splashModal.modal.fade(role="dialog")
        .modal-dialog.modal-lg(role="document")
            <!-- Modal content-->
            .modal-content
                .modal-header
                    h4#spmodalTitle.modal-title
                    button.close(type="button" data-dismiss="modal") &times;
                .modal-body
                .modal-footer
                    input#splashCheck(type="checkbox")
                    label#splashChecklabel(for='splashCheck') Nicht mehr anzeigen
                    button.btn.btn-default(type="button" data-dismiss="modal") Schließen