Add recently viewed train on homepage
This commit is contained in:
		
							parent
							
								
									a653e92e03
								
							
						
					
					
						commit
						7645effd5f
					
				
					 4 changed files with 86 additions and 3 deletions
				
			
		| 
						 | 
				
			
			@ -12,6 +12,8 @@
 | 
			
		|||
 | 
			
		||||
	<script src="/common/worker.js"></script>
 | 
			
		||||
	<script src="/common/items.js"></script>
 | 
			
		||||
	<script src="/common/trainId.js"></script>
 | 
			
		||||
	<script src="index.js"></script>
 | 
			
		||||
</head>
 | 
			
		||||
<body>
 | 
			
		||||
	<h1>InfoTren</h1>
 | 
			
		||||
| 
						 | 
				
			
			@ -19,8 +21,8 @@
 | 
			
		|||
	<div class="content">
 | 
			
		||||
		<ul>
 | 
			
		||||
			<li><a class="items disabled" href="">Train routes</a></li>
 | 
			
		||||
			<li><a class="items" href="train.html">My train</a></li>
 | 
			
		||||
			<li><a class="items" href="station.html">Station departures/arrivals</a></li>
 | 
			
		||||
			<li id="my-train-li"><a class="items" href="train.html">My train</a></li>
 | 
			
		||||
			<li id="station-arr-dep-li"><a class="items" href="station.html">Station departures/arrivals</a></li>
 | 
			
		||||
			<li><a class="items" href="about.html">About</a></li>
 | 
			
		||||
		</ul>
 | 
			
		||||
	</div>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
							
								
								
									
										58
									
								
								index.js
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										58
									
								
								index.js
									
										
									
									
									
										Normal file
									
								
							| 
						 | 
				
			
			@ -0,0 +1,58 @@
 | 
			
		|||
window.addEventListener('load', function (e) {
 | 
			
		||||
    if (window.localStorage) {
 | 
			
		||||
        var recentViewTrain = localStorage.getItem('recent/view-train')
 | 
			
		||||
        if (recentViewTrain) {
 | 
			
		||||
            /**
 | 
			
		||||
             * @property {string} trainNumber
 | 
			
		||||
             * @property {string} date
 | 
			
		||||
             * @property {string} $addDate
 | 
			
		||||
             * @property {string | undefined} groupIndex
 | 
			
		||||
             */
 | 
			
		||||
            recentViewTrain = JSON.parse(recentViewTrain)
 | 
			
		||||
            var addDate = new Date(recentViewTrain.$addDate)
 | 
			
		||||
            addDate.setHours(addDate.getHours() + 2) // store recents for 2 hours
 | 
			
		||||
            if (addDate.getTime() > Date.now()) {
 | 
			
		||||
                var recentViewTrainLi = document.createElement('li')
 | 
			
		||||
                var recentViewTrainLink = document.createElement('a')
 | 
			
		||||
                recentViewTrainLi.appendChild(recentViewTrainLink)
 | 
			
		||||
                var recentViewTrainLinkUrl = new URL('/view-train.html', window.location.origin)
 | 
			
		||||
                recentViewTrainLinkUrl.searchParams.append('train', recentViewTrain.trainNumber)
 | 
			
		||||
                recentViewTrainLinkUrl.searchParams.append('date', recentViewTrain.date)
 | 
			
		||||
                if (recentViewTrain.groupIndex) {
 | 
			
		||||
                    recentViewTrainLinkUrl.searchParams.append('groupIndex', recentViewTrain.groupIndex)
 | 
			
		||||
                }
 | 
			
		||||
                recentViewTrainLink.href = recentViewTrainLinkUrl.toString()
 | 
			
		||||
                recentViewTrainLink.classList.add('items')
 | 
			
		||||
                recentViewTrainLink.innerText = `Recent train: ${recentViewTrain.trainNumber}`
 | 
			
		||||
 | 
			
		||||
                fetch(`https://scraper.infotren.dcdev.ro/v3/trains/${recentViewTrain.trainNumber}?date=${recentViewTrain.date}`)
 | 
			
		||||
                    .then(function (result) {
 | 
			
		||||
                        if (result.ok) {
 | 
			
		||||
                            return result.json()
 | 
			
		||||
                        }
 | 
			
		||||
                    })
 | 
			
		||||
                    .then(function (result) {
 | 
			
		||||
                        recentViewTrainLink.innerText = 'Recent train: '
 | 
			
		||||
                        trainIdSpan(result.rank, result.number, recentViewTrainLink)
 | 
			
		||||
                        if (recentViewTrain.groupIndex !== undefined || result.groups.length === 1) {
 | 
			
		||||
                            var group = result.groups[recentViewTrain.groupIndex || 0]
 | 
			
		||||
                            if (group.status) {
 | 
			
		||||
                                if (group.status.delay === 0) {
 | 
			
		||||
                                    recentViewTrainLink.appendChild(document.createTextNode(" (on time)"))
 | 
			
		||||
                                }
 | 
			
		||||
                                else if (group.status.delay > 0) {
 | 
			
		||||
                                    recentViewTrainLink.appendChild(document.createTextNode(` (${group.status.delay} min late)`))
 | 
			
		||||
                                }
 | 
			
		||||
                                else {
 | 
			
		||||
                                    recentViewTrainLink.appendChild(document.createTextNode(` (${-group.status.delay} min early)`))
 | 
			
		||||
                                }
 | 
			
		||||
                            }
 | 
			
		||||
                        }
 | 
			
		||||
                    })
 | 
			
		||||
 | 
			
		||||
                var myTrainLi = document.getElementById("my-train-li")
 | 
			
		||||
                myTrainLi.parentNode.insertBefore(recentViewTrainLi, myTrainLi.nextSibling)
 | 
			
		||||
            }
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
})
 | 
			
		||||
							
								
								
									
										4
									
								
								sw.js
									
										
									
									
									
								
							
							
						
						
									
										4
									
								
								sw.js
									
										
									
									
									
								
							| 
						 | 
				
			
			@ -1,4 +1,4 @@
 | 
			
		|||
const VERSION = 'v23'
 | 
			
		||||
const VERSION = 'v24'
 | 
			
		||||
const API_ORIGIN = 'https://scraper.infotren.dcdev.ro/'
 | 
			
		||||
const API_TRAINS = `${API_ORIGIN}v3/trains`
 | 
			
		||||
const API_STATIONS = `${API_ORIGIN}v3/stations`
 | 
			
		||||
| 
						 | 
				
			
			@ -22,8 +22,10 @@ const CACHE_FIRST = [
 | 
			
		|||
 | 
			
		||||
	// Pages
 | 
			
		||||
	'/index.html',
 | 
			
		||||
	'/index.js',
 | 
			
		||||
 | 
			
		||||
	'/about.html',
 | 
			
		||||
	'/about.js',
 | 
			
		||||
 | 
			
		||||
	'/train.html',
 | 
			
		||||
	'/train.js',
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -129,6 +129,14 @@ function onTrainData(data, fetchDate) {
 | 
			
		|||
				function onAction(e) {
 | 
			
		||||
					var url = new URL(window.location.toString())
 | 
			
		||||
					groupIndex = i
 | 
			
		||||
					if (window.localStorage) {
 | 
			
		||||
						localStorage.setItem('recent/view-train', JSON.stringify({
 | 
			
		||||
							trainNumber: trainNumber,
 | 
			
		||||
							date: date.toISOString(),
 | 
			
		||||
							groupIndex: groupIndex,
 | 
			
		||||
							$addDate: new Date().toISOString(),
 | 
			
		||||
						}))
 | 
			
		||||
					}
 | 
			
		||||
					url.searchParams.append('groupIndex', groupIndex)
 | 
			
		||||
					window.history.pushState({'groupIndex': groupIndex}, '', url.toString( ))
 | 
			
		||||
					onTrainData(data)
 | 
			
		||||
| 
						 | 
				
			
			@ -512,6 +520,19 @@ window.addEventListener('load', function (e) {
 | 
			
		|||
	date = sp.has('date') ? new Date(sp.get('date')) : new Date()
 | 
			
		||||
	groupIndex = sp.has('groupIndex') ? parseInt(sp.get('groupIndex')) : null
 | 
			
		||||
 | 
			
		||||
	if (window.localStorage) {
 | 
			
		||||
		var oldRecent = localStorage.getItem('recent/view-train')
 | 
			
		||||
		if (oldRecent) {
 | 
			
		||||
			oldRecent = JSON.parse(oldRecent)
 | 
			
		||||
		}
 | 
			
		||||
		localStorage.setItem('recent/view-train', JSON.stringify({
 | 
			
		||||
			trainNumber: trainNumber,
 | 
			
		||||
			date: date.toISOString(),
 | 
			
		||||
			groupIndex: oldRecent && oldRecent.trainNumber === trainNumber ? oldRecent.groupIndex : undefined,
 | 
			
		||||
			$addDate: new Date().toISOString(),
 | 
			
		||||
		}))
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	document.querySelectorAll('.rsk').forEach(function (rskElem) {
 | 
			
		||||
		rskElem.addEventListener('click', function (e) {
 | 
			
		||||
			rsk()
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		
		Reference in a new issue