You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
252 lines
6.8 KiB
252 lines
6.8 KiB
var station |
|
var date |
|
|
|
var stationData = null |
|
var lastSuccessfulFetch = null |
|
|
|
function onStationData(data) { |
|
if (!data) { |
|
return |
|
} |
|
|
|
var title = document.getElementById('title') |
|
title.textContent = data.stationName |
|
|
|
document.getElementById('date').textContent = data.date |
|
|
|
document.getElementById('loading').classList.add('hidden') |
|
|
|
/** |
|
* @param {HTMLElement} elem |
|
* @param {any[]} trains |
|
*/ |
|
function addTrains(elem, trains) { |
|
while (elem.childNodes.length > 0) { |
|
elem.childNodes[0].remove() |
|
} |
|
|
|
var trainsList = document.createElement('ul') |
|
elem.appendChild(trainsList) |
|
|
|
trains.forEach(function (train, tIdx) { |
|
var trainItem = document.createElement('li') |
|
trainsList.appendChild(trainItem) |
|
trainItem.classList.add('train-item') |
|
if (train.status && train.status.cancelled) { |
|
trainItem.classList.add('cancelled') |
|
} |
|
|
|
var timeDiv = document.createElement('p') |
|
trainItem.appendChild(timeDiv) |
|
timeDiv.classList.add('pri', 'time') |
|
var timeDivPre = document.createElement('pre') |
|
timeDiv.appendChild(timeDivPre) |
|
timeDivPre.textContent = new Date(train.time).toLocaleTimeString([], { 'hour': '2-digit', 'minute': '2-digit' }) |
|
|
|
if (train.status && train.status.delay != 0) { |
|
var delayDiv = document.createElement('p') |
|
trainItem.appendChild(delayDiv) |
|
delayDiv.classList.add('thi', 'delay') |
|
delayDiv.textContent = `${train.status.delay} min ` |
|
// delayDiv.appendChild(document.createElement('br')) |
|
var descSpan = document.createElement('span') |
|
delayDiv.appendChild(descSpan) |
|
if (train.status.delay > 0) { |
|
descSpan.classList.add('late') |
|
descSpan.textContent = 'late' |
|
} |
|
else { |
|
descSpan.classList.add('early') |
|
descSpan.textContent = 'early' |
|
} |
|
} |
|
|
|
var rankDiv = document.createElement('p') |
|
trainItem.appendChild(rankDiv) |
|
rankDiv.classList.add('sec', 'rank', train.train.rank) |
|
var rankDivPre = document.createElement('pre') |
|
rankDiv.appendChild(rankDivPre) |
|
rankDivPre.textContent = train.train.rank |
|
|
|
var trainDiv = document.createElement('p') |
|
trainItem.appendChild(trainDiv) |
|
trainDiv.classList.add('pri', 'train') |
|
var trainDivHref = document.createElement('a') |
|
trainDiv.appendChild(trainDivHref) |
|
trainDivHref.classList.add('no-a-custom') |
|
var trainUrl = new URL('/view-train.html', window.location.origin) |
|
trainUrl.searchParams.append('train', train.train.number) |
|
trainUrl.searchParams.append('date', train.train.departureDate) |
|
trainDivHref.href = trainUrl.toString() |
|
var trainDivHrefPre = document.createElement('pre') |
|
trainDivHref.appendChild(trainDivHrefPre) |
|
trainDivHrefPre.textContent = train.train.number |
|
|
|
var terminusDiv = document.createElement('p') |
|
trainItem.appendChild(terminusDiv) |
|
terminusDiv.classList.add('pri', 'terminus') |
|
terminusDiv.textContent = train.train.terminus |
|
|
|
if (train.status && train.status.platform) { |
|
var platformDiv = document.createElement('div') |
|
trainItem.appendChild(platformDiv) |
|
platformDiv.classList.add('thi', 'platform') |
|
var platformDivPre = document.createElement('pre') |
|
platformDiv.appendChild(platformDivPre) |
|
platformDivPre.textContent = train.status.platform |
|
} |
|
|
|
if (train.status && train.status.cancelled) { |
|
var statusDiv = document.createElement('p') |
|
trainItem.appendChild(statusDiv) |
|
statusDiv.classList.add('sec', 'status') |
|
statusDiv.textContent = 'This train is cancelled' |
|
} |
|
}) |
|
} |
|
addTrains(document.getElementById('arrivals'), data.arrivals) |
|
addTrains(document.getElementById('departures'), data.departures) |
|
} |
|
|
|
var refreshStopToken = null |
|
function refresh() { |
|
function reschedule(timeout) { |
|
if (refreshStopToken != null) { |
|
clearTimeout(refreshStopToken) |
|
} |
|
refreshStopToken = setTimeout(function () { |
|
refresh() |
|
}, timeout || 90000) |
|
} |
|
var reqDate = new Date(date.valueOf()) |
|
reqDate.setMinutes(0, 0, 0) |
|
return fetch( |
|
`https://scraper.infotren.dcdev.ro/v3/stations/${station}?date=${reqDate.toISOString()}`, |
|
{ |
|
cache: 'no-store', |
|
}, |
|
).then(function (response) { |
|
if (!response.ok) { |
|
// Check in 10 seconds if server returned error |
|
reschedule(10000) |
|
return |
|
} |
|
var cacheDate = response.headers.get('SW-Cached-At') |
|
return response.json().then(function (data) { |
|
data['$cacheDate'] = cacheDate |
|
return data |
|
}) |
|
}).then(function (response) { |
|
if (!response) { |
|
return |
|
} |
|
var cacheDate = response['$cacheDate'] |
|
if (cacheDate) { |
|
cacheDate = new Date(cacheDate) |
|
} |
|
var success = !cacheDate |
|
stationData = response |
|
onStationData(response) |
|
// Check in 1 seconds if network error |
|
reschedule(success ? undefined : 1000) |
|
return success |
|
}).catch(function (e) { |
|
// Check in 1 second if network error |
|
reschedule(1000) |
|
throw e |
|
}) |
|
} |
|
|
|
window.addEventListener('unload', function (e) { |
|
if (refreshStopToken != null) { |
|
clearTimeout(refreshStopToken) |
|
} |
|
}) |
|
|
|
function rsk() { |
|
function changeRskText(newText) { |
|
document.querySelectorAll('.rsk').forEach(function (elem) { |
|
elem.textContent = newText |
|
}) |
|
} |
|
|
|
changeRskText('Refreshing...') |
|
refresh().catch(function () { return false}).then(function (success) { |
|
if (!success) { |
|
changeRskText('Refreshing failed') |
|
setTimeout(function (_) { |
|
changeRskText('Refresh') |
|
}, 3000) |
|
} |
|
else { |
|
changeRskText('Refresh') |
|
} |
|
}) |
|
} |
|
|
|
window.addEventListener('load', function (e) { |
|
if (!new URL(window.location.href).searchParams.has('station')) { |
|
window.history.back() |
|
this.setTimeout(function () { |
|
var url = new URL(window.location.href) |
|
url.pathname = 'station.html' |
|
window.location.href = url.toString() |
|
}, 100) |
|
} |
|
|
|
var sp = new URL(window.location.href).searchParams |
|
|
|
station = sp.get('station') |
|
date = sp.has('date') ? new Date(sp.get('date')) : new Date() |
|
|
|
// View departures first |
|
selectedTab = 1 |
|
selectTab(selectedTab) |
|
|
|
document.querySelectorAll('.rsk').forEach(function (rskElem) { |
|
rskElem.addEventListener('click', function (e) { |
|
rsk() |
|
}) |
|
}) |
|
|
|
if (navigator.canShare && navigator.canShare({ url: '' })) { |
|
document.getElementById('title').addEventListener('click', function () { |
|
navigator.share({ url: '' }); |
|
}) |
|
} |
|
|
|
refresh() |
|
|
|
setInterval(function () { |
|
if (!lastSuccessfulFetch) { |
|
return |
|
} |
|
var millis = new Date() - lastSuccessfulFetch |
|
var secs = Math.floor(millis / 1000) |
|
|
|
var timeStr = '' |
|
if (secs / 3600 >= 1) { |
|
timeStr += `${Math.floor(secs / 3600)}h` |
|
secs = secs % 3600 |
|
} |
|
if (secs / 60 >= 1) { |
|
timeStr += `${Math.floor(secs / 60)}m` |
|
secs = secs % 60 |
|
} |
|
if (secs >= 1) { |
|
timeStr += `${Math.floor(secs)}s` |
|
} |
|
if (!timeStr) { |
|
document.querySelectorAll('.lsk').forEach(function (elem) { |
|
elem.textContent = 'Last refreshed now' |
|
elem.classList.add('last-refreshed') |
|
}) |
|
} |
|
else { |
|
document.querySelectorAll('.lsk').forEach(function (elem) { |
|
elem.textContent = `Last refreshed ${timeStr} ago` |
|
elem.classList.add('last-refreshed') |
|
}) |
|
} |
|
}, 500) |
|
})
|
|
|