abstreet/game/prefetch.html

34 lines
959 B
HTML

<!DOCTYPE html>
<!-- This is an example of having a "normal" page load A/B Street in the
background. When the user clicks a button on the page, swap the visible
layers and suddenly it's running! -->
<html>
<head>
<script type="module">
import { default as init } from './game.js';
async function run() {
await init('./game_bg.wasm');
}
run();
</script>
<script type="text/javascript">
function show_wasm() {
document.getElementById('widgetry-canvas').style.display = 'inline';
document.getElementById('normal_page').style.display = 'none';
}
</script>
</head>
<body>
<div id="normal_page">
<h1>This is the normal webpage. A/B Street is being loaded in the background.</h1>
<p>Can you feel the lag?</p>
<button type="button" onclick="show_wasm()">Switch to WASM app</button>
</div>
<div id="widgetry-canvas" style="display: none">
<h1>Loading...</h1>
</div>
</body>
<html>