summaryrefslogtreecommitdiff
path: root/templates
diff options
context:
space:
mode:
Diffstat (limited to 'templates')
-rw-r--r--templates/_train_details.html.ep5
-rw-r--r--templates/layouts/app.html.ep4
-rw-r--r--templates/route_map.html.ep54
3 files changed, 63 insertions, 0 deletions
diff --git a/templates/_train_details.html.ep b/templates/_train_details.html.ep
index 44cf01d..444fe9a 100644
--- a/templates/_train_details.html.ep
+++ b/templates/_train_details.html.ep
@@ -78,6 +78,11 @@
<a href="/_wr/<%= $departure->{train_no} %>/<%= $departure->{wr_link} %>">Wagenreihung</a>
</div>
% }
+% if ($departure->{trip_id}) {
+ <div class="verbose">
+ <a href="/map/<%= $departure->{trip_id} %>/<%= $departure->{train_line} // 0 %>">Karte</a>
+ </div>
+% }
% }
% if ($departure->{moreinfo} and @{$departure->{moreinfo}}) {
diff --git a/templates/layouts/app.html.ep b/templates/layouts/app.html.ep
index bba3c32..2a596c0 100644
--- a/templates/layouts/app.html.ep
+++ b/templates/layouts/app.html.ep
@@ -28,6 +28,10 @@
% if (stash('with_geolocation')) {
%= javascript "/static/${av}/js/geolocation.min.js", defer => undef
% }
+ % if (stash('with_map')) {
+ %= stylesheet "/static/${av}/leaflet/leaflet.css"
+ %= javascript "/static/${av}/leaflet/leaflet.js"
+ % }
</head>
<body style="<%= (param('dark') ? 'background-color: #000000; color: #ffffff;' : q{}) %>">
diff --git a/templates/route_map.html.ep b/templates/route_map.html.ep
new file mode 100644
index 0000000..505cddb
--- /dev/null
+++ b/templates/route_map.html.ep
@@ -0,0 +1,54 @@
+% if (0) {
+ <div class="container">
+ <div class="error">
+ <strong>Fehler!</strong>
+ Baz
+ </div>
+ </div>
+% }
+% else {
+ <div class="container">
+ <div id="map" style="height: 500px;">
+ </div>
+ </div>
+
+<script>
+var map = L.map('map').setView([51.306, 9.712], 6);
+
+L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
+ attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
+}).addTo(map);
+var stations = [
+% for my $station ( @{stash('station_coordinates') // [] } ) {
+[[<%= $station->[0][0] %>,<%= $station->[0][1] %>],'<%= $station->[1] %>'],
+% }
+];
+
+var routes = [];
+var pl;
+% for my $line_group ( @{ stash('polyline_groups') // [] } ) {
+ routes = [
+ % for my $pair ( @{$line_group->{polylines} // []} ) {
+ [[<%= $pair->[0][0] %>,<%= $pair->[0][1] %>],[<%= $pair->[1][0] %>,<%= $pair->[1][1] %>]],
+ % }
+ ];
+ pl = L.polyline(routes, {color: '<%= $line_group->{color} %>', opacity: <%= $line_group->{opacity} %>}).addTo(map);
+ % if ($line_group->{fit_bounds}) {
+ if (routes.length) {
+ map.fitBounds(pl.getBounds());
+ }
+ % }
+% }
+
+for (var station_id in stations) {
+ L.circle(stations[station_id][0], {
+ color: '#f03',
+ opacity: 0.7,
+ fillColor: '#f03',
+ fillOpacity: 0.5,
+ radius: 250
+ }).bindPopup(stations[station_id][1]).addTo(map);
+}
+
+</script>
+% }