From d089d3d7166a16c34fe15256740c969d53aaa930 Mon Sep 17 00:00:00 2001
From: Edward Betts <edward@4angle.com>
Date: Sat, 4 Apr 2026 12:27:23 +0100
Subject: [PATCH] Add price emoji indicators and hover text to results table
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Show 💰 on total prices within £10 of the cheapest journey and 💸
within £10 of the most expensive, mirroring the ⚡/🐢 logic for journey
time. Only applied when more than one priced trip exists.

Add title attributes to ⚠️ ("Tight connection"), ⚡ ("Fastest journey"),
and 🐢 ("Slowest journey") for accessibility and discoverability.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 templates/results.html | 13 +++++++++----
 tests/test_app.py      |  4 ++--
 2 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/templates/results.html b/templates/results.html
index 999fe2a..12a2f97 100644
--- a/templates/results.html
+++ b/templates/results.html
@@ -116,6 +116,11 @@
       {% if trips %}
       {% set best_mins = trips | map(attribute='total_minutes') | min %}
       {% set worst_mins = trips | map(attribute='total_minutes') | max %}
+      {% set priced_trips = trips | selectattr('total_price') | list %}
+      {% if priced_trips | length > 1 %}
+        {% set min_price = priced_trips | map(attribute='total_price') | min %}
+        {% set max_price = priced_trips | map(attribute='total_price') | max %}
+      {% endif %}
       {% endif %}
       {% for row in result_rows %}
       {% if row.row_type == 'trip' and row.total_minutes <= best_mins + 5 and trips | length > 1 %}
@@ -144,7 +149,7 @@
           <br><span style="font-size:0.75rem;color:#718096">{{ row.ticket_name }}</span>
         </td>
         <td class="col-transfer" style="padding:0.6rem 0.8rem;color:#4a5568">
-          {{ row.connection_duration }}{% if row.connection_minutes < 80 %} ⚠️{% endif %}
+          {{ row.connection_duration }}{% if row.connection_minutes < 80 %} <span title="Tight connection">⚠️</span>{% endif %}
         </td>
         <td style="padding:0.6rem 0.8rem;font-weight:600">
           {{ row.depart_st_pancras }}
@@ -163,14 +168,14 @@
         </td>
         <td style="padding:0.6rem 0.8rem;font-weight:600;white-space:nowrap">
           {% if row.total_minutes <= best_mins + 5 and trips | length > 1 %}
-            <span style="color:#276749" title="Fastest option">{{ row.total_duration }} ⚡</span>
+            <span style="color:#276749" title="Fastest journey">{{ row.total_duration }} ⚡</span>
           {% elif row.total_minutes >= worst_mins - 5 and trips | length > 1 %}
-            <span style="color:#c53030" title="Slowest option">{{ row.total_duration }} 🐢</span>
+            <span style="color:#c53030" title="Slowest journey">{{ row.total_duration }} 🐢</span>
           {% else %}
             <span style="color:#00539f">{{ row.total_duration }}</span>
           {% endif %}
           {% if row.total_price is not none %}
-            <br><span style="font-size:0.8rem;font-weight:700;color:#276749">£{{ "%.2f"|format(row.total_price) }}</span>
+            <br><span style="font-size:0.8rem;font-weight:700;color:#276749">£{{ "%.2f"|format(row.total_price) }}{% if min_price is defined and max_price is defined %}{% if row.total_price <= min_price + 10 %} <span title="Cheapest journey">💰</span>{% elif row.total_price >= max_price - 10 %} <span title="Most expensive journey">💸</span>{% endif %}{% endif %}</span>
           {% endif %}
         </td>
         {% else %}
diff --git a/tests/test_app.py b/tests/test_app.py
index 937432f..d4de5c2 100644
--- a/tests/test_app.py
+++ b/tests/test_app.py
@@ -155,8 +155,8 @@ def test_results_marks_trips_within_five_minutes_of_fastest_and_slowest(monkeypa
     html = resp.get_data(as_text=True)
 
     assert resp.status_code == 200
-    assert html.count('title="Fastest option"') == 2
-    assert html.count('title="Slowest option"') == 2
+    assert html.count('title="Fastest journey"') == 2
+    assert html.count('title="Slowest journey"') == 2
     assert '4h 50m ⚡' in html
     assert '4h 55m ⚡' in html
     assert '5h 20m 🐢' in html