87 lines
3.5 KiB
HTML
87 lines
3.5 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}{% if journey_type == 'inbound' %}{{ destination }} to {{ departure_station_name }} via Eurostar{% elif journey_type == 'return' %}{{ departure_station_name }} to {{ destination }} return via Eurostar{% else %}{{ departure_station_name }} to {{ destination }} via Eurostar{% endif %}{% endblock %}
|
|
{% block og_title %}{{ self.title()|trim }}{% endblock %}
|
|
{% block og_description %}Train options from {{ departure_station_name }} to {{ destination }} via Paddington, St Pancras, and Eurostar.{% endblock %}
|
|
{% block twitter_title %}{{ self.title()|trim }}{% endblock %}
|
|
{% block twitter_description %}Train options from {{ departure_station_name }} to {{ destination }} via Paddington, St Pancras, and Eurostar.{% endblock %}
|
|
{% block content %}
|
|
|
|
<p class="back-link">
|
|
<a href="{{ index_url }}">← New search</a>
|
|
</p>
|
|
|
|
<div class="card" style="margin-bottom:1.5rem">
|
|
<h2>
|
|
{% if journey_type == 'inbound' %}
|
|
{{ destination }} → {{ departure_station_name }}
|
|
{% elif journey_type == 'return' %}
|
|
{{ departure_station_name }} ↔ {{ destination }}
|
|
{% else %}
|
|
{{ departure_station_name }} → {{ destination }}
|
|
{% endif %}
|
|
</h2>
|
|
<p class="card-meta">
|
|
{{ travel_date_display }}{% if return_date_display %} to {{ return_date_display }}{% endif %}
|
|
</p>
|
|
<div class="loading-panel" role="status" aria-live="polite">
|
|
<span class="spinner" aria-hidden="true"></span>
|
|
<div>
|
|
<strong>Loading train times and fares</strong>
|
|
<p class="text-muted text-sm">Fetching National Rail, Eurostar, and fare data. Results will appear here as soon as they are ready.</p>
|
|
</div>
|
|
</div>
|
|
<noscript>
|
|
<p><a href="{{ full_results_url }}">Load results</a></p>
|
|
</noscript>
|
|
</div>
|
|
|
|
<script>
|
|
(function() {
|
|
var attempts = 0;
|
|
|
|
function runScripts(root) {
|
|
root.querySelectorAll('script').forEach(function(oldScript) {
|
|
var script = document.createElement('script');
|
|
for (var i = 0; i < oldScript.attributes.length; i++) {
|
|
var attr = oldScript.attributes[i];
|
|
script.setAttribute(attr.name, attr.value);
|
|
}
|
|
script.text = oldScript.text;
|
|
oldScript.parentNode.replaceChild(script, oldScript);
|
|
});
|
|
}
|
|
|
|
function loadResults() {
|
|
attempts += 1;
|
|
fetch({{ full_results_url|tojson }}, {headers: {'X-Requested-With': 'fetch'}})
|
|
.then(function(response) {
|
|
if (!response.ok) throw new Error('Could not load results');
|
|
return response.text();
|
|
})
|
|
.then(function(html) {
|
|
var doc = new DOMParser().parseFromString(html, 'text/html');
|
|
document.title = doc.title;
|
|
var nextMain = doc.querySelector('main');
|
|
var currentMain = document.querySelector('main');
|
|
if (!nextMain || !currentMain) throw new Error('Results page was incomplete');
|
|
currentMain.innerHTML = nextMain.innerHTML;
|
|
runScripts(currentMain);
|
|
history.replaceState(null, '', window.location.href);
|
|
})
|
|
.catch(function() {
|
|
if (attempts < 3) {
|
|
window.setTimeout(loadResults, attempts * 2000);
|
|
return;
|
|
}
|
|
var panel = document.querySelector('.loading-panel');
|
|
if (panel) {
|
|
panel.innerHTML = '<div><strong>Could not load results</strong><p class="text-muted text-sm"><a href="{{ full_results_url }}">Try loading the full results page</a>.</p></div>';
|
|
}
|
|
});
|
|
}
|
|
|
|
loadResults();
|
|
})();
|
|
</script>
|
|
|
|
{% endblock %}
|