From 3ba18f901985d05624ff718afa6b13736906e27c Mon Sep 17 00:00:00 2001
From: Edward Betts <edward@4angle.com>
Date: Thu, 23 Apr 2026 13:19:13 +0100
Subject: [PATCH] Hide map on trip page when there are no coordinates or routes

Closes #205

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 static/js/map.js         | 11 ++++++++++-
 templates/trip_page.html |  9 ++++++---
 2 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/static/js/map.js b/static/js/map.js
index a527585..7bd9a02 100644
--- a/static/js/map.js
+++ b/static/js/map.js
@@ -56,7 +56,16 @@ function emojiIcon(emoji, zoom) {
 
 
 function build_map(map_id, coordinates, routes) {
-    var map = L.map(map_id).fitBounds(coordinates.map(function(station) { return [station.latitude, station.longitude]; }));
+    var bounds = coordinates.map(function(station) { return [station.latitude, station.longitude]; });
+    if (bounds.length === 0) {
+        routes.forEach(function(r) {
+            if (r.from) bounds.push(r.from);
+            if (r.to) bounds.push(r.to);
+        });
+    }
+    var map = bounds.length > 0
+        ? L.map(map_id).fitBounds(bounds)
+        : L.map(map_id).setView([20, 0], 2);
 
     L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
         attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
diff --git a/templates/trip_page.html b/templates/trip_page.html
index 6b51dee..109449a 100644
--- a/templates/trip_page.html
+++ b/templates/trip_page.html
@@ -27,7 +27,7 @@
 
 {% block style %}
 
-{% if coordinates %}
+{% if coordinates or routes %}
  <link rel="stylesheet" href="{{ url_for("static", filename="leaflet/leaflet.css") }}">
 {% endif %}
  <link rel="stylesheet" href="{{ url_for("static", filename="css/trips.css") }}">
@@ -101,7 +101,7 @@
 
 {% block content %}
 <div class="row">
-  <div class="col-md-6 col-sm-12">
+  <div class="{% if coordinates or routes %}col-md-6{% else %}col-md-12{% endif %} col-sm-12">
     <div class="m-3">
     <div class="trip-prev-next">{{ next_and_previous() }}</div>
     <h1 class="trip-page-title">{{ trip.title }}</h1>
@@ -497,16 +497,18 @@
 
     </div>
   </div>
+{% if coordinates or routes %}
   <div class="col-md-6 col-sm-12">
     <button id="toggleMapSize" class="btn btn-primary mb-2">Toggle map size</button>
     <div id="map" class="half-map">
     </div>
   </div>
+{% endif %}
 </div>
 {% endblock %}
 
 {% block scripts %}
-
+{% if coordinates or routes %}
 <script src="{{ url_for("static", filename="leaflet/leaflet.js") }}"></script>
 <script src="{{ url_for("static", filename="leaflet-geodesic/leaflet.geodesic.umd.min.js") }}"></script>
 
@@ -519,4 +521,5 @@ var routes = {{ routes | tojson }};
 build_map("map", coordinates, routes);
 
 </script>
+{% endif %}
 {% endblock %}