Thu, 06 Dec 2018 19:35:38 +0200
bus live information
{% from "macros.html" import route_rep %} <html> <head> <link rel="icon" type="image/png" href="../static/favicon.png" /> <link rel="stylesheet" type="text/css" href="../static/style.css" /> <meta charset='UTF-8' /> <title>{{name}}</title> <meta http-equiv='refresh' content='60'> <style> .sarake-määränpää { text-align: left; } .dataentry { display: none; } .sarake-aika { width: 150pt; } .gone { background-color: #666; color: silver; font-style: italic; display: none; } tbody tr:nth-child(even).gone { background-color: #585858; } </style> <script> var getJSON = function(url, callback) { var xhr = new XMLHttpRequest(); xhr.open('GET', url, true); xhr.responseType = 'json'; xhr.onload = function() { var status = xhr.status; if (status === 200) { callback(xhr.response); } }; xhr.send(); }; var getUuid = function(blockref, originaimeddeparturetime, data, callback) { var xhr = new XMLHttpRequest(); var url = "../find_halt/{{ref}}/" + blockref + "/" + originaimeddeparturetime.toString(); xhr.open('GET', url, true); xhr.responseType = 'json'; xhr.onload = function() { var status = xhr.status; if (status === 200) { callback(xhr.response['id'], data); } }; xhr.send(); }; function timeConverter(UNIX_timestamp){ var a = new Date(UNIX_timestamp * 1000); var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec']; var year = a.getFullYear(); var month = months[a.getMonth()]; var date = a.getDate(); var hour = a.getHours(); var min = a.getMinutes(); var sec = a.getSeconds(); var time = hour + ':' + (min < 10 ? '0' : '') + min; return time; } function updateTime(uuid, time) { const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone; const d = new Date(); const now = (d.getTime() + d.getTimezoneOffset()) / 1000; row = document.getElementById(uuid); timeCell = document.getElementById(uuid + '-time'); t0 = parseInt(document.getElementById(uuid + '-stamp').innerHTML); if (Math.abs(time - t0) > 90) { oldTime = timeConverter(t0); newTime = timeConverter(time); timeCell.innerHTML = '<s style="color:gray">' + oldTime + '</s> ⟶ <b>' + newTime + '</b>'; } if (time + 15 > now) row.classList.remove('gone'); else row.classList.add('gone'); } </script> </head> <body> <table class='aikataulu service-{{service}}' cellspacing="0"> <thead> <tr> <th colspan='4' class='primary-heading'> <span><img src="../static/{{typename}}.png" height="96" /> {{name}}</span> </th> </tr> <tr class='headings'> <th class='sarake-aika'>{{tr('time', 'headings')}}</th> <th class='sarake-linja'>{{tr('route', 'headings')}}</th> <th class='sarake-määränpää'>{{tr('destination', 'headings')}}</th> <th> <span class='actions'> <a class="pysäkki-sijainti" href="{{link_to_map}}" target="_blank">📌</a> {% if cluster %} <a href="../stop_cluster/{{cluster}}">🞊</a> {% endif %} <a href='../stop_week/{{ref}}'>▤</a> </th> </tr> </thead> <tbody id='departures-table'> {% for halt in schedule %} <tr class="{% if halt['night'] %} yö {% endif %}{% if halt['gone'] %}gone{% endif %}" id="{{halt['id']}}"> <td class='sarake-aika'> <!-- {% if halt['imminent'] %} <span class='imminent-leave'>●</span> {% endif %} --> <span id="{{halt['id']}}-time"></span> <span class='dataentry' id="{{halt['id']}}-stamp">{{halt['timestamp']}}</span> <!--{{halt['time']}}--></td> <td class='sarake-linja linja'> <a href="../trip/{{halt['trip']}}">{{route_rep(halt['route-splice'])}}</a> </td> <td class='sarake-määränpää' colspan='2'> <a href="../trip/{{halt['trip']}}">{{halt['sign']}}</a> </td> </tr> {% endfor %} </tbody> </table> <script> var list = document.getElementById('departures-table').children; for (var i = 0; i < list.length; i += 1) { id = list[i].id; timestamp = parseInt(document.getElementById(id + '-stamp').innerHTML); document.getElementById(id + '-time').innerHTML = timeConverter(timestamp); } //updateTime('fbf6f367-069c-4f8d-831b-bd36cd643f3b', 1544092500); getJSON('http://data.foli.fi/siri/sm/{{ref}}', function(data){ var arrayLength = data['result'].length; for (var i = 0; i < arrayLength; i++) { var blockref = data['result'][i]['blockref']; var originaimeddeparturetime = data['result'][i]['originaimeddeparturetime']; var expecteddeparturetime = data['result'][i]['expecteddeparturetime']; getUuid(blockref, originaimeddeparturetime, expecteddeparturetime, function(id, expecteddeparturetime) { updateTime(id, expecteddeparturetime); }); } }); </script> </body> </html>