Revize bb2d43b5

Re #8159 - frontend bugfixes and refactoring

website/templates/heatmap.html.twig

@@ -8 +8 @@
   <link rel="stylesheet" href="{{ asset('css/bootstrap-datepicker3.css') }}">
 {% endblock %}
 
-
 {% block body %}
 
   <header class="map">
@@ -22 +21 @@
       </button>
 
       <div class="collapse navbar-collapse ml-auto" id="navigation">
-        
         {{ form_start(form, {'action': path('heatmap'), 'method': 'GET'}) }}
           <ul class="navbar-nav">
             <li class="nav-item">
               {{ form_label(form.date, 'Vyberte datum', {
                 label_attr: {class: 'font-weight-bold'}
               }) }}
-              {{
-                form_widget(form.date,
+              {{ form_widget(form.date,
                 {
                   'type' : 'text',
                   'id' : 'date',
@@ -46 +43 @@
             </li>
             <li class="nav-item">
               <label class="font-weight-bold">Vyberte čas</label>
-                <div class="dropdown">
-                <button class="btn dropdown-toggle" type="button_1" id="dropdownMenuButton-time" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+              <div class="dropdown">
+                <button type="button" class="btn dropdown-toggle" id="dropdownMenuButtonTime" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                   {{ current_time }}
                 </button>
-                <div id="dataset-dropdown-time" class="dropdown-menu" aria-labelledby="dropdownMenuButton-time">
-                {% for oneTime in form.time.children %}
+                <div id="dataset-dropdown-time" class="dropdown-menu" aria-labelledby="dropdownMenuButtonTime">
+                  {% for oneTime in form.time.children %}
                   <label class="dropdown-item custom-dropdown-item">
-                  {{ form_widget(oneTime, {
-                    attr: {class: 'd-none'}
-                  }) }}
-                  {{ form_label(oneTime, null) }}
-                </label>   
-                {% endfor %}
+                    {{ form_widget(oneTime, {attr: {class: 'd-none'}}) }}
+                    {{ form_label(oneTime, null) }}
+                  </label>
+                  {% endfor %}
+                </div>
               </div>
             </li>
             <li class="nav-item">
               <div class="dropdown">
-                <button class="btn dropdown-toggle font-weight-bold" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                <button type="button" class="btn dropdown-toggle font-weight-bold" id="dropdownMenuButtonDataset" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                   Vyberte datovou sadu
-              </button>
-              <div id="dataset-dropdown" class="dropdown-menu" aria-labelledby="dropdownMenuButton">
-              {% for oneType in form.type.children %}
-              <label class="dropdown-item custom-dropdown-item">
-              <div class="custom-control custom-checkbox custom-checkbox-{{oneType.vars.value}}">
-              {{ form_widget(oneType, {
-                attr: {
-                  'class': "custom-control-input custom-control-input-#{oneType.vars.value}",
-                  'data-dataset-display-name': "#{oneType.vars.label}"
-                  }
-              }) }}
-              {{ form_label(oneType, null, {
-                'label_attr': {'class': 'custom-control-label'}
-                }) }}
-              </div>
-              </label>
-              {% endfor %}
+                </button>
+                <div id="dataset-dropdown" class="dropdown-menu" aria-labelledby="dropdownMenuButtonDataset">
+                  {% for oneDataset in form.type.children %}
+                  <div class="dropdown-item custom-dropdown-item">
+                    <div class="custom-control custom-checkbox custom-checkbox-{{oneDataset.vars.value}}">
+                      {{ form_widget(oneDataset, {
+                        attr: {
+                          'class': "custom-control-input custom-control-input-#{oneDataset.vars.value}",
+                          'data-dataset-display-name': "#{oneDataset.vars.label}"
+                          }
+                      }) }}
+                      {{ form_label(oneDataset, null, {
+                        'label_attr': {'class': 'custom-control-label'}
+                      }) }}
+                    </div>
+                  </div>
+                  {% endfor %}
+                </div>
               </div>
-              </div>  
             </li>
-
             <li class="nav-item">
-              {{
-                form_widget(form.submit,
+              {{ form_widget(form.submit,
                 {
                   'name' : '',
                   'label' : '',
@@ -100 +94 @@
                 })
               }}
             </li>
-          </ul> 
-        
+          </ul>
         {{ form_end(form) }}
-
       </div>
     </nav>
   </header>
@@ -115 +107 @@
       <div class="circle"></div>
     </a>
     <div class="locations collapse" id="mapLocations">
-      <ul>
-        <li onclick="setMapView(49.7248, 13.3521, 17)">Kampus ZČU</li>
-        <li onclick="setMapView(49.7367263, 13.3709177, 18)">FPE &ndash; Pedagogická fakulta</li>
-        <li onclick="setMapView(49.7474950, 13.3748308, 18)">FPR &ndash; Právnická fakulta</li>
-        <li onclick="setMapView(49.7450169, 13.3702668, 18)">FZS &ndash; Fakulta zdravotnických studií</li>
-        <li onclick="setMapView(50.0762590, 12.3640213, 17)">FEK &ndash; pracoviště Cheb</li>
-        <li onclick="setMapView(49.7236785, 13.3353118, 18)">NTC &ndash; výzkumné centrum</li>
-        <li onclick="setMapView(49.9590236, 13.1597114, 18)">Zámek ZČU &ndash; Nečtiny</li>
-        <li onclick="setMapView(49.7345564, 13.3585038, 18)">Koleje Borská</li>
-        <li onclick="setMapView(49.7250373, 13.3696772, 18)">Koleje Bory</li>
-        <li onclick="setMapView(49.7600000, 13.3723463, 18)">Koleje Lochotín</li>
-        <li onclick="setMapView(49.7293726, 13.3589237, 15)">Oblast s&nbsp;koloběžkami</li>
-      </ul>
+      {% include 'heatmap-locations.html.twig' %}
     </div>
   </div>
 
@@ -191 +171 @@
         initDatepicker("{{ path('dates') }}");
         initLocationsMenu();
         initMap();        
-        $( document ).ready(function() {
+        $(document).ready(function() {
           onDocumentReady();
           checkDataSetsAvailability("{{ path('available') }}")
           {% if submitted %}
@@ -209 +189 @@
   <style>
     {% for key, item in dataset_colors %}
       .custom-control-input-{{key}}:focus~.custom-control-label::before {
-          border-color: {{item}} !important;
-          box-shadow: 0 0 0 0.2rem rgba(192,192,192, 0.4) !important;
+        border-color: {{item}} !important;
+        box-shadow: 0 0 0 0.2rem rgba(192,192,192, 0.4) !important;
       }
 
       .custom-control-input-{{key}}:checked~.custom-control-label::before {
-          border-color: {{item}} !important;
-          background-color: {{item}} !important;
+        border-color: {{item}} !important;
+        background-color: {{item}} !important;
       }
 
       .custom-control-input-{{key}}:focus:not(:checked)~.custom-control-label::before {
-          border-color: {{item}} !important;
+        border-color: {{item}} !important;
       }
 
       .custom-control-input-{{key}}:not(:disabled):active~.custom-control-label::before {
-          background-color: {{item}} !important;
-          border-color: {{item}} !important;
+        background-color: {{item}} !important;
+        border-color: {{item}} !important;
       }
 
-      .popup-{{key}} > .leaflet-popup-content-wrapper, .popup-{{key}} .leaflet-popup-tip{
+      .popup-{{key}} > .leaflet-popup-content-wrapper, .popup-{{key}} .leaflet-popup-tip {
         background-color: {{item}} !important;
       }
     {% endfor %}