diff options
Diffstat (limited to 'templates/route_map.html.ep')
| -rw-r--r-- | templates/route_map.html.ep | 61 |
1 files changed, 55 insertions, 6 deletions
diff --git a/templates/route_map.html.ep b/templates/route_map.html.ep index 4ba5917..e1c4642 100644 --- a/templates/route_map.html.ep +++ b/templates/route_map.html.ep @@ -1,10 +1,9 @@ -<div class="container" style="margin-top: 1ex; margin-bottom: 1ex;"> -Fahrt von <strong><%= $origin->{name} %></strong> -nach <strong><%= $destination->{name} %></strong> -</div> +% if (stash('origin') and stash('destination')) { + %= include '_map_infobox' +% } <div class="container"> - <div id="map" style="height: 500px;"> + <div id="map" style="height: 70vh;"> </div> </div> @@ -42,8 +41,58 @@ for (var station_id in stations) { opacity: 0.7, fillColor: '#f03', fillOpacity: 0.5, - radius: 250 + radius: <%= stash('station_radius') || 250 %> }).bindPopup(stations[station_id][1].join('<br/>')).addTo(map); } +var greenIcon = new L.Icon({ + iconUrl: '/static/leaflet/images/marker-icon-2x-green.png', + shadowUrl: '/static/leaflet/images/marker-shadow.png', + iconSize: [25, 41], + iconAnchor: [12, 41], + popupAnchor: [1, -34], + shadowSize: [41, 41] +}); + +var goldIcon = new L.Icon({ + iconUrl: '/static/leaflet/images/marker-icon-2x-gold.png', + shadowUrl: '/static/leaflet/images/marker-shadow.png', + iconSize: [25, 41], + iconAnchor: [12, 41], + popupAnchor: [1, -34], + shadowSize: [41, 41] +}); + +var marker; +% for my $marker (@{stash('markers') // [] } ) { + % if ($marker->{icon}) { + marker = L.marker([<%= $marker->{lat} %>,<%= $marker->{lon} %>], {icon: <%= $marker->{icon} %>}).addTo(map); + % } + % else { + marker = L.marker([<%= $marker->{lat} %>,<%= $marker->{lon} %>]).addTo(map); + % } + % if ($marker->{title}) { + marker.bindPopup('<%= $marker->{title} %>'); + % } +% } + </script> + +<div class="container" style="margin-top: 1ex; margin-bottom: 1ex; color: #555;"> +<p> +Die eingezeichnete Route stammt aus dem angefragten Backend und stimmt nicht +notwendigerweise mit der Realität überein. +Die Fahrzeugposition auf der Karte ist eine DBF-eigene Schätzung und kann +erheblich von den tatsächlichen Gegebenheiten abweichen. +% if (stash('intersection')) { +<br/>In dieser Ansicht sind Live-Updates der Zug- und Begegnungspositionen noch +nicht implementiert. +% } +</p> +</div> + +% if (my $op = stash('operator')) { +<div class="container" style="margin-top: 1ex; margin-bottom: 1ex; color: #555;"> +<p>Betrieb: <%= $op %></p> +</div> +% } |