Spaces:
Sleeping
Sleeping
| <html lang="en" > | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>Rome in Transit</title> | |
| <link rel="apple-touch-icon" sizes="180x180" href="https://cdn.holoviz.org/panel/1.1.0/dist/images/apple-touch-icon.png"> | |
| <link rel="icon" href="https://cdn.holoviz.org/panel/1.1.0/dist/images/favicon.ico" type=""><link rel="manifest" href="site.webmanifest"><meta name="name" content="Rome in Transit"> <style> | |
| html, body { | |
| display: flow-root; | |
| box-sizing: border-box; | |
| height: 100%; | |
| margin: 0; | |
| padding: 0; | |
| } | |
| </style> | |
| <style type="text/css"> | |
| :host(.pn-loading), | |
| .pn-loading { | |
| overflow: hidden; | |
| } | |
| :host(.pn-loading):before, | |
| .pn-loading:before { | |
| position: absolute; | |
| height: 100%; | |
| width: 100%; | |
| content: ''; | |
| z-index: 1000; | |
| background-color: rgb(255, 255, 255, 0.5); | |
| border-color: lightgray; | |
| background-repeat: no-repeat; | |
| background-position: center; | |
| background-size: auto 50%; | |
| border-width: 1px; | |
| cursor: progress; | |
| } | |
| :host(.pn-loading) .pn-loading-msg, | |
| .pn-loading .pn-loading-msg { | |
| position: absolute; | |
| top: 72%; | |
| font-size: 2em; | |
| color: black; | |
| width: 100%; | |
| text-align: center; | |
| } | |
| :host(.pn-loading.pn-arc):before, .pn-loading.pn-arc:before { | |
| background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHN0eWxlPSJtYXJnaW46IGF1dG87IGJhY2tncm91bmQ6IG5vbmU7IGRpc3BsYXk6IGJsb2NrOyBzaGFwZS1yZW5kZXJpbmc6IGF1dG87IiB2aWV3Qm94PSIwIDAgMTAwIDEwMCIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1pZFlNaWQiPiAgPGNpcmNsZSBjeD0iNTAiIGN5PSI1MCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjYzNjM2MzIiBzdHJva2Utd2lkdGg9IjEwIiByPSIzNSIgc3Ryb2tlLWRhc2hhcnJheT0iMTY0LjkzMzYxNDMxMzQ2NDE1IDU2Ljk3Nzg3MTQzNzgyMTM4Ij4gICAgPGFuaW1hdGVUcmFuc2Zvcm0gYXR0cmlidXRlTmFtZT0idHJhbnNmb3JtIiB0eXBlPSJyb3RhdGUiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBkdXI9IjFzIiB2YWx1ZXM9IjAgNTAgNTA7MzYwIDUwIDUwIiBrZXlUaW1lcz0iMDsxIj48L2FuaW1hdGVUcmFuc2Zvcm0+ICA8L2NpcmNsZT48L3N2Zz4="); | |
| background-size: auto calc(min(50%, 400px)); | |
| } | |
| </style> | |
| <script type="text/javascript"> | |
| if ('serviceWorker' in navigator) { | |
| navigator.serviceWorker.register('./serviceWorker.js').then(reg => { | |
| reg.onupdatefound = () => { | |
| const installingWorker = reg.installing; | |
| installingWorker.onstatechange = () => { | |
| if (installingWorker.state === 'installed' && | |
| navigator.serviceWorker.controller) { | |
| // Reload page if service worker is replaced | |
| location.reload(); | |
| } | |
| } | |
| } | |
| }) | |
| } | |
| </script> | |
| <script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-3.1.1.min.js"></script> | |
| <script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-gl-3.1.1.min.js"></script> | |
| <script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-widgets-3.1.1.min.js"></script> | |
| <script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-tables-3.1.1.min.js"></script> | |
| <script type="text/javascript" src="https://cdn.holoviz.org/panel/1.1.0/dist/panel.min.js"></script> | |
| <script type="text/javascript"> | |
| Bokeh.set_log_level("info"); | |
| </script><!-- Template CSS --> | |
| <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans"> | |
| <link rel="stylesheet" href="https://cdn.holoviz.org/panel/1.1.0/dist/bundled/theme/default.css"> | |
| <link rel="stylesheet" href="https://cdn.holoviz.org/panel/1.1.0/dist/bundled/fastbasetemplate/fast.css"> | |
| <link rel="stylesheet" href="https://cdn.holoviz.org/panel/1.1.0/dist/bundled/fastlisttemplate/fast_list_template.css"> | |
| <style type="text/css"> | |
| :host(.pn-loading.pn-arc):before, .pn-loading.pn-arc:before { | |
| background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHN0eWxlPSJtYXJnaW46IGF1dG87IGJhY2tncm91bmQ6IG5vbmU7IGRpc3BsYXk6IGJsb2NrOyBzaGFwZS1yZW5kZXJpbmc6IGF1dG87IiB2aWV3Qm94PSIwIDAgMTAwIDEwMCIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1pZFlNaWQiPiAgPGNpcmNsZSBjeD0iNTAiIGN5PSI1MCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjYzNjM2MzIiBzdHJva2Utd2lkdGg9IjEwIiByPSIzNSIgc3Ryb2tlLWRhc2hhcnJheT0iMTY0LjkzMzYxNDMxMzQ2NDE1IDU2Ljk3Nzg3MTQzNzgyMTM4Ij4gICAgPGFuaW1hdGVUcmFuc2Zvcm0gYXR0cmlidXRlTmFtZT0idHJhbnNmb3JtIiB0eXBlPSJyb3RhdGUiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBkdXI9IjFzIiB2YWx1ZXM9IjAgNTAgNTA7MzYwIDUwIDUwIiBrZXlUaW1lcz0iMDsxIj48L2FuaW1hdGVUcmFuc2Zvcm0+ICA8L2NpcmNsZT48L3N2Zz4="); | |
| background-size: auto calc(min(50%, 400px)); | |
| } | |
| </style> | |
| <link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Open+Sans" /> | |
| <style> | |
| :root { | |
| --background-color: #ffffff; | |
| --body-font: Open Sans, sans-serif; | |
| --corner-radius: 3; | |
| --header-background: #2F4F4F; | |
| --header-color: #ffffff; | |
| --sidebar-width: 330px; | |
| } | |
| body { | |
| color: #2B2B2B; | |
| background-color: var(--background-color); | |
| font-family: var(--body-font); | |
| } | |
| #header a { | |
| color: currentColor; | |
| } | |
| #header-design-provider { | |
| --neutral-fill-hover: var(--header-background); | |
| --neutral-fill-rest: var(--header-background); | |
| --neutral-foreground-rest: var(--header-color); | |
| background: var(--header-background); | |
| color: var(--header-color); | |
| } | |
| #sidebar { | |
| min-width: var(--sidebar-width); | |
| max-width: var(--sidebar-width); | |
| } | |
| </style> | |
| <!-- Template JS --> | |
| <script src="https://cdn.holoviz.org/panel/1.1.0/dist/bundled/fastbasetemplate/fast_template.js"></script> | |
| <script src="https://cdn.holoviz.org/panel/1.1.0/dist/bundled/@microsoft/fast-components@2.30.6/dist/fast-components.js" type="module"></script> | |
| <script src="https://cdn.holoviz.org/panel/1.1.0/dist/bundled/fast/js/fast_design.js" type="module"></script> | |
| <!-- Fast Script --> | |
| <script type="text/javascript"> | |
| document.addEventListener('DOMContentLoaded', (event) => { | |
| const header_design = new window.fastDesignProvider("#header-design-provider"); | |
| const body_design = window.bodyDesign = new window.fastDesignProvider("#body-design-provider"); | |
| body_design.setLuminance(1.0); | |
| body_design.setAccentColor("#0072B5") | |
| body_design.setNeutralColor("#000000"); | |
| header_design.setLuminance(1.0); | |
| header_design.setAccentColor("#ffffff"); | |
| header_design.setNeutralColor("#ffffff"); | |
| }); | |
| </script> | |
| </head> | |
| <body class="pn-loading pn-arc"> | |
| <fast-design-system-provider id="body-design-provider" use-defaults> | |
| <div id="container"> | |
| <fast-design-system-provider id="header-design-provider"> | |
| <nav id="header" class="shadow" > | |
| <div class="app-header"> | |
| <a class="navbar-brand app-logo" href="/"> | |
| <img src="https://raw.githubusercontent.com/ivandorte/Rome-in-transit/main/assets/train.svg" class="app-logo"> | |
| </a> | |
| <a class="title" href="" >Rome in Transit</a> | |
| </div> | |
| <div id="header-items"> | |
| </div> | |
| <div class="pn-busy-container" id="busy-container"> | |
| <div id="3c8075d0-fc3a-4514-8158-15e88fc0af92" data-root-id="p1018" style="display: contents;"></div> | |
| </div> | |
| <fast-tooltip anchor="busy-container" position="left"> | |
| Busy Indicator | |
| </fast-tooltip> | |
| </nav> | |
| </fast-design-system-provider> | |
| <div class="row" id="content"> | |
| <div class="main" id="main"> | |
| <div class="main-margin" style="max-width: 1100px;"> | |
| <div class="card-margin stretch_both"> | |
| <fast-card class="pn-wrapper"> | |
| <span class="fullscreen-button" onclick="toggleFullScreen(this)"> | |
| <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 18 18"> | |
| <path d="M4.5 11H3v4h4v-1.5H4.5V11zM3 7h1.5V4.5H7V3H3v4zm10.5 6.5H11V15h4v-4h-1.5v2.5zM11 3v1.5h2.5V7H15V3h-4z"/> | |
| </svg> | |
| </span> | |
| <div id="1d160653-c119-4eef-8d7d-c691a80469b5" data-root-id="p1019" style="display: contents;"></div> | |
| </fast-card> | |
| </div> | |
| </div> | |
| </div> | |
| <fast-dialog id="pn-Modal" hidden> | |
| <fast-button class="pn-modal-close" id="pn-closeModal">×</fast-button> | |
| <div> | |
| </div> | |
| </fast-dialog> | |
| </div> | |
| </div> | |
| </fast-design-system-provider> | |
| <script type="text/javascript"> | |
| </script> | |
| <script type="text/javascript"> | |
| function openNav() { | |
| document.getElementById("sidebar").classList.remove("hidden"); | |
| document.getElementById("sidebar-button").onclick = closeNav; | |
| } | |
| function closeNav() { | |
| document.getElementById("sidebar").classList.add("hidden"); | |
| document.getElementById("sidebar-button").onclick = openNav; | |
| } | |
| var modal = document.getElementById("pn-Modal"); | |
| var span = document.getElementById("pn-closeModal"); | |
| span.onclick = function() { | |
| modal.style.display = "none"; | |
| } | |
| window.onclick = function(event) { | |
| if (event.target == modal) { | |
| modal.style.display = "none"; | |
| } | |
| } | |
| </script> | |
| <div id="8f656b86-9fb1-4369-b81d-809f30f999c7" data-root-id="p1011" style="display: contents;"></div> | |
| <div id="3a051cc9-7607-4bab-9472-9293a52588a1" data-root-id="p1014" style="display: contents;"></div> | |
| <div id="1aec0642-5aba-42c1-a157-7aaced0f9889" data-root-id="p1004" style="display: contents;"></div> | |
| <div id="d12aeefc-3fa8-46ff-9b8c-dbea06c196c9" data-root-id="p1015" style="display: contents;"></div> | |
| <script type="text/javascript"> | |
| const pyodideWorker = new Worker("./app.js"); | |
| pyodideWorker.busy = false | |
| pyodideWorker.queue = [] | |
| function send_change(jsdoc, event) { | |
| if (event.setter_id != null && event.setter_id == 'py') { | |
| return | |
| } else if (pyodideWorker.busy && event.model && event.attr) { | |
| let events = [] | |
| for (const old_event of pyodideWorker.queue) { | |
| if (!(old_event.model === event.model && old_event.attr === event.attr)) { | |
| events.push(old_event) | |
| } | |
| } | |
| events.push(event) | |
| pyodideWorker.queue = events | |
| return | |
| } | |
| const patch = jsdoc.create_json_patch([event]) | |
| pyodideWorker.busy = true | |
| pyodideWorker.postMessage({type: 'patch', patch: patch}) | |
| } | |
| pyodideWorker.onmessage = async (event) => { | |
| const msg = event.data | |
| const body = document.getElementsByTagName('body')[0] | |
| const loading_msgs = document.getElementsByClassName('pn-loading-msg') | |
| if (msg.type === 'idle') { | |
| if (pyodideWorker.queue.length) { | |
| const patch = pyodideWorker.jsdoc.create_json_patch(pyodideWorker.queue) | |
| pyodideWorker.busy = true | |
| pyodideWorker.queue = [] | |
| pyodideWorker.postMessage({type: 'patch', patch: patch}) | |
| } else { | |
| pyodideWorker.busy = false | |
| } | |
| } else if (msg.type === 'status') { | |
| let loading_msg | |
| if (loading_msgs.length) { | |
| loading_msg = loading_msgs[0] | |
| } else if (body.classList.contains('pn-loading')) { | |
| loading_msg = document.createElement('div') | |
| loading_msg.classList.add('pn-loading-msg') | |
| body.appendChild(loading_msg) | |
| } | |
| if (loading_msg != null) { | |
| loading_msg.innerHTML = msg.msg | |
| } | |
| } else if (msg.type === 'render') { | |
| const docs_json = JSON.parse(msg.docs_json) | |
| const render_items = JSON.parse(msg.render_items) | |
| const root_ids = JSON.parse(msg.root_ids) | |
| // Remap roots in message to element IDs | |
| const root_els = document.querySelectorAll('[data-root-id]') | |
| const data_roots = [] | |
| for (const el of root_els) { | |
| el.innerHTML = '' | |
| data_roots.push([el.getAttribute('data-root-id'), el.id]) | |
| } | |
| data_roots.sort((a, b) => a[0]<b[0] ? -1: 1) | |
| const roots = {} | |
| for (let i=0; i<data_roots.length; i++) { | |
| roots[root_ids[i]] = data_roots[i][1] | |
| } | |
| render_items[0]['roots'] = roots | |
| render_items[0]['root_ids'] = root_ids | |
| // Embed content | |
| const [views] = await Bokeh.embed.embed_items(docs_json, render_items) | |
| // Remove loading spinner and message | |
| body.classList.remove("pn-loading", "arc") | |
| for (const loading_msg of loading_msgs) { | |
| loading_msg.remove() | |
| } | |
| // Setup bi-directional syncing | |
| pyodideWorker.jsdoc = jsdoc = [...views.roots.values()][0].model.document | |
| jsdoc.on_change(send_change.bind(null, jsdoc), false) | |
| pyodideWorker.postMessage({'type': 'rendered'}) | |
| pyodideWorker.postMessage({'type': 'location', location: JSON.stringify(window.location)}) | |
| } else if (msg.type === 'patch') { | |
| pyodideWorker.jsdoc.apply_json_patch(msg.patch, msg.buffers, setter_id='py') | |
| } | |
| }; | |
| </script> | |
| </body> | |
| </html> |