kristoferssolo/maze-ascension
1
0
Fork 0
mirror of https://github.com/kristoferssolo/maze-ascension.git synced 2026-03-22 00:26:29 +00:00
Code Issues Packages Projects Releases 5 Wiki Activity

Initial commit

Browse Source
This commit is contained in:
Kristofers Solo
2024-09-17 20:19:16 +03:00
commit f79be932a3
53 changed files with 7589 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
web/index.html Normal file
View File

@@ -0,0 +1,38 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="description"
content="Maze exploration game built using the Bevy engine">
<meta name="keywords" content="game, bevy">
<title>Maze Ascension: The Labyrinth of Echoes</title>
<link data-trunk rel="copy-dir" href="../assets" />
<link data-trunk rel="inline" href="style.css" />
<link data-trunk rel="inline" type="module" href="restart-audio-context.js" />
<link data-trunk
rel="rust"
data-cargo-no-default-features
data-wasm-opt="s"
href="../" />
</head>
<body>
<div id="game" class="center">
<div id="loading-screen" class="center">
<span class="spinner"></span>
</div>
<canvas id="bevy"> Javascript and canvas support is required </canvas>
</div>
<script type="module">
// Hide loading screen when the game starts.
const loading_screen = document.getElementById("loading-screen");
const bevy = document.getElementById("bevy");
const observer = new MutationObserver(() => {
if (bevy.height > 1) {
loading_screen.style.display = "none";
observer.disconnect();
}
});
observer.observe(bevy, { attributeFilter: ["height"] });
</script>
</body>
</html>

57
web/restart-audio-context.js Normal file
View File

@@ -0,0 +1,57 @@
// taken from https://developer.chrome.com/blog/web-audio-autoplay/#moving-forward
(() => {
// An array of all contexts to resume on the page
const audioContextList = [];
// An array of various user interaction events we should listen for
const userInputEventNames = [
"click",
"contextmenu",
"auxclick",
"dblclick",
"mousedown",
"mouseup",
"pointerup",
"touchend",
"keydown",
"keyup",
];
// A proxy object to intercept AudioContexts and
// add them to the array for tracking and resuming later
self.AudioContext = new Proxy(self.AudioContext, {
construct(target, args) {
const result = new target(...args);
audioContextList.push(result);
return result;
},
});
// To resume all AudioContexts being tracked
function resumeAllContexts(_) {
let count = 0;
for (const context of audioContextList) {
if (context.state !== "running") {
context.resume();
} else {
count++;
}
}
// If all the AudioContexts have now resumed then we
// unbind all the event listeners from the page to prevent
// unnecessary resume attempts
if (count === audioContextList.length) {
for (const eventName of userInputEventNames) {
document.removeEventListener(eventName, resumeAllContexts);
}
}
}
// We bind the resume function for each user interaction
// event on the page
for (const eventName of userInputEventNames) {
document.addEventListener(eventName, resumeAllContexts);
}
})();

56
web/style.css Normal file
View File

@@ -0,0 +1,56 @@
:root {
/* Consider adjusting this color to match your splash screen! */
--loading-screen-bg-color: #282828;
}
* {
margin: 0;
padding: 0;
border: 0;
}
html,
body {
width: 100%;
height: 100%;
}
.center {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
#loading-screen {
background-color: var(--loading-screen-bg-color);
}
.spinner {
width: 128px;
height: 128px;
border: 64px solid transparent;
border-bottom-color: #ececec;
border-right-color: #b2b2b2;
border-top-color: #787878;
border-radius: 50%;
box-sizing: border-box;
animation: spin 1.2s linear infinite;
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
#bevy {
/* Hide Bevy app before it loads */
height: 0;
}