52 lines
1.8 KiB
HTML
52 lines
1.8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="user-scalable=no, height=device-height, width=device-width, initial-scale=1.0">
|
|
<title>Platformer</title>
|
|
|
|
<link rel="stylesheet" href="styles.css" />
|
|
<script type="module" defer src="main.js"></script>
|
|
</head>
|
|
|
|
<body>
|
|
<noscript>This page contains WebAssembly and JavaScript content, please enable JavaScript in your browser.</noscript>
|
|
<div class="lds-default" style="display: none;"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
|
|
|
|
<main id="main">
|
|
<button class="button-3d" id="button-start" type="button" role="button" onclick="preloaderEnable()">
|
|
Start
|
|
</button>
|
|
</main>
|
|
</body>
|
|
<script>
|
|
function preloaderEnable() {
|
|
document.querySelector('.lds-default').style = null;
|
|
}
|
|
|
|
const intervalId = setInterval(function() {
|
|
if (document.querySelector('canvas') !== null) {
|
|
document.querySelector('canvas');
|
|
clearInterval(intervalId);
|
|
resize(document.querySelector('canvas'));
|
|
}
|
|
}, 1000);
|
|
new ResizeObserver(() => {
|
|
const canvasObj = document.querySelector('canvas')
|
|
if (canvasObj == null) {
|
|
return;
|
|
}
|
|
resize(canvasObj);
|
|
}).observe(document.body);
|
|
|
|
function resize(canvasObj) {
|
|
document.querySelector('.lds-default').style.display = "none";
|
|
canvasObj.style = null;
|
|
canvasObj.width = window.screen.width * window.devicePixelRatio;
|
|
canvasObj.height = window.screen.height * window.devicePixelRatio;
|
|
canvasObj.style.width = window.screen.width + "px";
|
|
canvasObj.style.height = window.screen.widheightth + "px";
|
|
}
|
|
</script>
|
|
</html>
|