50 lines
2.5 KiB
JavaScript
50 lines
2.5 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function() {
|
|
const liveStationForm = document.getElementById('live-station-form');
|
|
|
|
if (liveStationForm) {
|
|
liveStationForm.addEventListener('submit', function(e) {
|
|
e.preventDefault();
|
|
|
|
const stationCode = document.getElementById('station-code').value;
|
|
const hours = document.getElementById('hours').value;
|
|
const resultDiv = document.getElementById('live-station-result');
|
|
|
|
resultDiv.innerHTML = '<div class="text-center"><div class="spinner-border text-primary" role="status"><span class="visually-hidden">Loading...</span></div></div>';
|
|
|
|
fetch(`api/live_station_handler.php?station_code=${stationCode}&hours=${hours}`)
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if(data.ResponseCode == 200 && data.Trains.length > 0) {
|
|
let trainsHtml = '';
|
|
data.Trains.forEach(train => {
|
|
trainsHtml += `<tr>
|
|
<td>${train.TrainNo}</td>
|
|
<td>${train.TrainName}</td>
|
|
<td>${train.Source}</td>
|
|
<td>${train.Destination}</td>
|
|
<td>${train.ExpectedArrival}</td>
|
|
<td>${train.Platform}</td>
|
|
</tr>`;
|
|
});
|
|
|
|
resultDiv.innerHTML = `
|
|
<h5 class="text-primary">Trains arriving at ${data.Station.StationName}</h5>
|
|
<table class="table table-dark table-striped">
|
|
<thead>
|
|
<tr><th>Train No</th><th>Train Name</th><th>From</th><th>To</th><th>ETA</th><th>Platform</th></tr>
|
|
</thead>
|
|
<tbody>${trainsHtml}</tbody>
|
|
</table>
|
|
`;
|
|
|
|
} else {
|
|
resultDiv.innerHTML = `<div class="alert alert-warning">${data.Message || 'No trains found for this station in the selected time frame.'}</div>`;
|
|
}
|
|
})
|
|
.catch(err => {
|
|
console.error('Error:', err);
|
|
resultDiv.innerHTML = `<div class="alert alert-danger">An error occurred.</div>`;
|
|
});
|
|
});
|
|
}
|
|
}); |