1 |
3fc08f2d
|
vastja
|
{% extends 'base.html.twig' %}
|
2 |
c6708024
|
vastja
|
|
3 |
3c909967
|
Martin Sebela
|
{% block title %}Heatmap.ZČU{% endblock %}
|
4 |
3fc08f2d
|
vastja
|
{% block stylesheets %}
|
5 |
c883131e
|
Martin Sebela
|
<link rel="stylesheet" href="{{ asset('css/leaflet.css') }}">
|
6 |
|
|
<link rel="stylesheet" href="{{ asset('css/bootstrap.min.css') }}">
|
7 |
3c909967
|
Martin Sebela
|
<link rel="stylesheet" href="{{ asset('css/style.css') }}">
|
8 |
c883131e
|
Martin Sebela
|
<link rel="stylesheet" href="{{ asset('css/bootstrap-datepicker3.css') }}">
|
9 |
3fc08f2d
|
vastja
|
{% endblock %}
|
10 |
|
|
|
11 |
c6708024
|
vastja
|
|
12 |
3fc08f2d
|
vastja
|
{% block body %}
|
13 |
|
|
|
14 |
c6708024
|
vastja
|
<header class="map">
|
15 |
3fc22d29
|
Martin Sebela
|
<nav class="navbar navbar-expand-lg ml-auto">
|
16 |
|
|
<a href="{{ path('home') }}" class="navbar-brand">
|
17 |
c6708024
|
vastja
|
<h1>Heatmap.ZČU</h1>
|
18 |
|
|
</a>
|
19 |
|
|
|
20 |
|
|
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#navigation" aria-controls="navigation" aria-expanded="false" aria-label="Toggle navigation">
|
21 |
|
|
<span class="navbar-toggler-icon"></span>
|
22 |
|
|
</button>
|
23 |
|
|
|
24 |
3fc22d29
|
Martin Sebela
|
<div class="collapse navbar-collapse ml-auto" id="navigation">
|
25 |
03c02899
|
vastja
|
|
26 |
896f0d9c
|
vastja
|
{{ form_start(form, {'action': path('heatmap'), 'method': 'GET'}) }}
|
27 |
03c02899
|
vastja
|
|
28 |
c6708024
|
vastja
|
<ul class="navbar-nav">
|
29 |
|
|
<li class="nav-item">
|
30 |
03c02899
|
vastja
|
{{ form_label(form.date, 'Vyberte datum') }}
|
31 |
|
|
{{
|
32 |
|
|
form_widget(form.date,
|
33 |
|
|
{
|
34 |
c883131e
|
Martin Sebela
|
'type' : 'text',
|
35 |
03c02899
|
vastja
|
'id' : 'date',
|
36 |
|
|
'attr' : {
|
37 |
0a828a5a
|
Martin Sebela
|
'class' : 'form-control',
|
38 |
a7e04778
|
Martin Sebela
|
'maxlength' : '10',
|
39 |
|
|
'placeholder' : 'YYYY-MM-DD',
|
40 |
63cd0d07
|
Martin Sebela
|
'autocomplete' : 'off',
|
41 |
03c02899
|
vastja
|
'onChange' : 'checkDataSetsAvailability("' ~ path('available') ~ '")'
|
42 |
|
|
}
|
43 |
|
|
})
|
44 |
|
|
}}
|
45 |
c6708024
|
vastja
|
</li>
|
46 |
|
|
|
47 |
|
|
<li class="nav-item">
|
48 |
4cc90563
|
vastja
|
{{ form_label(form.time, 'Vyberte čas') }}
|
49 |
03c02899
|
vastja
|
{{
|
50 |
|
|
form_widget(form.time, {
|
51 |
64bc2934
|
vastja
|
'id' : 'time',
|
52 |
03c02899
|
vastja
|
'attr' : {
|
53 |
0a828a5a
|
Martin Sebela
|
'class' : 'custom-select'
|
54 |
2f227a6c
|
ballakt
|
},
|
55 |
03c02899
|
vastja
|
})
|
56 |
|
|
}}
|
57 |
c6708024
|
vastja
|
</li>
|
58 |
3fc08f2d
|
vastja
|
|
59 |
c6708024
|
vastja
|
<li class="nav-item">
|
60 |
2f227a6c
|
ballakt
|
<div class="dropdown">
|
61 |
|
|
{# {{ form_label(form.type, 'Vyberte datovou sadu') }} #}
|
62 |
|
|
<button class="btn dropdown-toggle text-white font-weight-bold" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
63 |
|
|
Vyberte datovou sadu
|
64 |
|
|
</button>
|
65 |
|
|
<div id="dataset-dropdown" class="dropdown-menu" aria-labelledby="dropdownMenuButton">
|
66 |
|
|
{% for oneType in form.type.children %}
|
67 |
|
|
<label class="dropdown-item custom-dropdown-item">
|
68 |
|
|
<div class="custom-control custom-checkbox custom-checkbox-{{oneType.vars.value}}">
|
69 |
|
|
{{ form_widget(oneType, {
|
70 |
|
|
attr: {'class': "custom-control-input custom-control-input-#{oneType.vars.value}"}
|
71 |
|
|
}) }}
|
72 |
|
|
{{ form_label(oneType, null, {
|
73 |
|
|
'label_attr': {'class': 'custom-control-label'}
|
74 |
|
|
}) }}
|
75 |
|
|
</div>
|
76 |
|
|
</label>
|
77 |
|
|
{% endfor %}
|
78 |
|
|
</div>
|
79 |
|
|
</div>
|
80 |
c6708024
|
vastja
|
</li>
|
81 |
3fc08f2d
|
vastja
|
|
82 |
c6708024
|
vastja
|
<li class="nav-item">
|
83 |
03c02899
|
vastja
|
{{
|
84 |
|
|
form_widget(form.submit,
|
85 |
|
|
{
|
86 |
2f227a6c
|
ballakt
|
'name' : '',
|
87 |
03c02899
|
vastja
|
'label' : 'Potvrdit výběr',
|
88 |
|
|
'type' : 'submit',
|
89 |
dfe43218
|
vastja
|
'id' : 'submit-btn',
|
90 |
03c02899
|
vastja
|
'attr' : {
|
91 |
|
|
'class': 'btn btn-secondary'
|
92 |
|
|
}
|
93 |
|
|
})
|
94 |
|
|
}}
|
95 |
c6708024
|
vastja
|
</li>
|
96 |
03c02899
|
vastja
|
</ul>
|
97 |
|
|
|
98 |
|
|
{{ form_end(form) }}
|
99 |
|
|
|
100 |
c6708024
|
vastja
|
</div>
|
101 |
|
|
</nav>
|
102 |
|
|
</header>
|
103 |
3fc08f2d
|
vastja
|
|
104 |
c236b33a
|
msebela
|
<div class="map-locations">
|
105 |
351696d5
|
Martin Sebela
|
<a class="menu" data-toggle="collapse" href="#mapLocations" role="button" aria-expanded="false" aria-controls="mapLocations">
|
106 |
dd652e61
|
Martin Sebela
|
<span class="desktop">Prohlédněte si jednotlivé oblasti</span>
|
107 |
|
|
<span class="mobile">Jednotlivé oblasti</span>
|
108 |
c236b33a
|
msebela
|
<div class="circle"></div>
|
109 |
351696d5
|
Martin Sebela
|
</a>
|
110 |
dd652e61
|
Martin Sebela
|
<div class="locations collapse" id="mapLocations">
|
111 |
c236b33a
|
msebela
|
<ul>
|
112 |
72a438f3
|
vastja
|
<li onclick="setMapView(49.7248, 13.3521, 17)">Kampus ZČU</li>
|
113 |
4e8c0e5b
|
Martin Sebela
|
<li onclick="setMapView(49.7367263, 13.3709177, 18)">FPE – Pedagogická fakulta</li>
|
114 |
|
|
<li onclick="setMapView(49.7474950, 13.3748308, 18)">FPR – Právnická fakulta</li>
|
115 |
|
|
<li onclick="setMapView(49.7450169, 13.3702668, 18)">FZS – Fakulta zdravotnických studií</li>
|
116 |
dd652e61
|
Martin Sebela
|
<li onclick="setMapView(50.0762590, 12.3640213, 17)">FEK – pracoviště Cheb</li>
|
117 |
c236b33a
|
msebela
|
<li onclick="setMapView(49.7236785, 13.3353118, 18)">NTC – výzkumné centrum</li>
|
118 |
4e8c0e5b
|
Martin Sebela
|
<li onclick="setMapView(49.9590236, 13.1597114, 18)">Zámek ZČU – Nečtiny</li>
|
119 |
|
|
<li onclick="setMapView(49.7345564, 13.3585038, 18)">Koleje Borská</li>
|
120 |
|
|
<li onclick="setMapView(49.7250373, 13.3696772, 18)">Koleje Bory</li>
|
121 |
|
|
<li onclick="setMapView(49.7600000, 13.3723463, 18)">Koleje Lochotín</li>
|
122 |
|
|
<li onclick="setMapView(49.7293726, 13.3589237, 15)">Oblast s koloběžkami</li>
|
123 |
c236b33a
|
msebela
|
</ul>
|
124 |
|
|
</div>
|
125 |
|
|
</div>
|
126 |
|
|
|
127 |
|
|
<div class="player">
|
128 |
a48642fb
|
vastja
|
<div class="prev" onclick="previous()"></div>
|
129 |
|
|
<div class="play" id="play-pause" onclick="changeAnimationState()"></div>
|
130 |
|
|
<div class="next" onclick="next()"></div>
|
131 |
351696d5
|
Martin Sebela
|
|
132 |
4e003182
|
Martin Sebela
|
<div class="datetime">
|
133 |
bc0a7bfd
|
Martin Sebela
|
|
134 |
|
|
{% if form.vars.value.date %}
|
135 |
|
|
<div class="date" onclick="openDatepicker()">{{ form.vars.value.date|date('j. n. Y') }}</div>
|
136 |
|
|
{% endif %}
|
137 |
4e003182
|
Martin Sebela
|
|
138 |
351696d5
|
Martin Sebela
|
<div class="timeline">
|
139 |
a48642fb
|
vastja
|
<div class="time hour-0" id="timeline">0:00</div>
|
140 |
351696d5
|
Martin Sebela
|
|
141 |
|
|
<div class="hour"></div>
|
142 |
|
|
<div class="hour"></div>
|
143 |
|
|
<div class="hour"></div>
|
144 |
|
|
<div class="hour"></div>
|
145 |
|
|
<div class="hour"></div>
|
146 |
|
|
<div class="hour"></div>
|
147 |
|
|
<div class="hour"></div>
|
148 |
|
|
<div class="hour"></div>
|
149 |
|
|
<div class="hour"></div>
|
150 |
|
|
<div class="hour"></div>
|
151 |
|
|
<div class="hour"></div>
|
152 |
|
|
<div class="hour"></div>
|
153 |
|
|
<div class="hour"></div>
|
154 |
|
|
<div class="hour"></div>
|
155 |
|
|
<div class="hour"></div>
|
156 |
|
|
<div class="hour"></div>
|
157 |
|
|
<div class="hour"></div>
|
158 |
|
|
<div class="hour"></div>
|
159 |
|
|
<div class="hour"></div>
|
160 |
|
|
<div class="hour"></div>
|
161 |
|
|
<div class="hour"></div>
|
162 |
|
|
<div class="hour"></div>
|
163 |
|
|
<div class="hour"></div>
|
164 |
|
|
<div class="hour"></div>
|
165 |
|
|
<div class="end-dot"></div>
|
166 |
4e003182
|
Martin Sebela
|
</div>
|
167 |
351696d5
|
Martin Sebela
|
</div>
|
168 |
c236b33a
|
msebela
|
</div>
|
169 |
|
|
|
170 |
c6708024
|
vastja
|
<div id="heatmap"></div>
|
171 |
|
|
|
172 |
3fc08f2d
|
vastja
|
{% endblock %}
|
173 |
|
|
|
174 |
|
|
{% block javascripts %}
|
175 |
|
|
|
176 |
8feb1753
|
ballakt
|
<script src="{{ asset('js/vendor/jquery-3.4.1.min.js') }}"></script>
|
177 |
|
|
<script src="{{ asset('js/vendor/bootstrap.min.js') }}"></script>
|
178 |
|
|
<script src="{{ asset('js/vendor/bootstrap-datepicker.min.js') }}"></script>
|
179 |
|
|
<script src="{{ asset('js/vendor/bootstrap-datepicker.cs.min.js') }}" charset="UTF-8"></script>
|
180 |
|
|
<script src="{{ asset('js/vendor/leaflet.js') }}"></script>
|
181 |
|
|
<script src="{{ asset('js/vendor/leaflet-heat.js') }}"></script>
|
182 |
03c02899
|
vastja
|
<script src="{{ asset('js/zcu-heatmap.js') }}"></script>
|
183 |
|
|
<script>
|
184 |
0a828a5a
|
Martin Sebela
|
initDatepicker("{{ path('dates') }}");
|
185 |
dd652e61
|
Martin Sebela
|
initLocationsMenu();
|
186 |
2f227a6c
|
ballakt
|
initMap();
|
187 |
|
|
$( document ).ready(function() {
|
188 |
|
|
onDocumentReady();
|
189 |
|
|
checkDataSetsAvailability("{{ path('available') }}")
|
190 |
|
|
{% if submitted %}
|
191 |
|
|
loadCurrentTimeHeatmap("{{ path('opendata') }}", "{{ path('positions') }}");
|
192 |
|
|
{% endif %}
|
193 |
|
|
});
|
194 |
dd652e61
|
Martin Sebela
|
$(window).resize(function() {
|
195 |
|
|
initLocationsMenu();
|
196 |
|
|
});
|
197 |
c883131e
|
Martin Sebela
|
</script>
|
198 |
3fc08f2d
|
vastja
|
|
199 |
2f227a6c
|
ballakt
|
{% endblock %}
|
200 |
|
|
|
201 |
|
|
{% block style %}
|
202 |
|
|
<style>
|
203 |
|
|
{% for key, item in dataset_colors %}
|
204 |
|
|
.custom-control-input-{{key}}:focus~.custom-control-label::before {
|
205 |
|
|
border-color: {{item}} !important;
|
206 |
|
|
box-shadow: 0 0 0 0.2rem rgba(192,192,192, 0.4) !important;
|
207 |
|
|
}
|
208 |
|
|
|
209 |
|
|
.custom-control-input-{{key}}:checked~.custom-control-label::before {
|
210 |
|
|
border-color: {{item}} !important;
|
211 |
|
|
background-color: {{item}} !important;
|
212 |
|
|
}
|
213 |
|
|
|
214 |
|
|
.custom-control-input-{{key}}:focus:not(:checked)~.custom-control-label::before {
|
215 |
|
|
border-color: {{item}} !important;
|
216 |
|
|
}
|
217 |
|
|
|
218 |
|
|
.custom-control-input-{{key}}:not(:disabled):active~.custom-control-label::before {
|
219 |
|
|
background-color: {{item}} !important;
|
220 |
|
|
border-color: {{item}} !important;
|
221 |
|
|
}
|
222 |
|
|
|
223 |
|
|
.popup-{{key}} > .leaflet-popup-content-wrapper, .popup-{{key}} .leaflet-popup-tip{
|
224 |
|
|
background-color: {{item}} !important;
|
225 |
|
|
}
|
226 |
|
|
{% endfor %}
|
227 |
|
|
</style>
|
228 |
3fc08f2d
|
vastja
|
{% endblock %}
|