Webleb - fragmentos de código

HTML CSS JS

<!DOCTYPE html>
<html lang="en">
	<head>
	  <base href="https://cdn.jsdelivr.net/gh/shayderrr/portsv4@ded90cd5eba24f3387a4b04c678ddf53caaa3a45/deadseat/">
		<meta charset="utf-8" />
		<meta
			name="viewport"
			content="width=device-width, user-scalable=no, initial-scale=1.0"
		/>
		<title>The Deadseat</title>
		<style>
			html,
			body,
			#canvas {
				margin: 0;
				padding: 0;
				border: 0;
			}

body {
				color: white;
				background-color: black;
				overflow: hidden;
				touch-action: none;
			}

#canvas {
				display: block;
			}

#canvas:focus {
				outline: none;
			}

#status,
			#status-splash,
			#status-progress {
				position: absolute;
				left: 0;
				right: 0;
			}

#status,
			#status-splash {
				top: 0;
				bottom: 0;
			}

#status {
				background-color: #242424;
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
				visibility: hidden;
			}

#status-splash {
				max-height: 100%;
				max-width: 100%;
				margin: auto;
			}

#status-progress,
			#status-notice {
				display: none;
			}

#status-progress {
				bottom: 10%;
				width: 50%;
				margin: 0 auto;
			}

#status-notice {
				background-color: #5b3943;
				border-radius: 0.5rem;
				border: 1px solid #9b3943;
				color: #e0e0e0;
				font-family: "Noto Sans", "Droid Sans", Arial, sans-serif;
				line-height: 1.3;
				margin: 0 2rem;
				overflow: hidden;
				padding: 1rem;
				text-align: center;
				z-index: 1;
			}
		</style>
		<link
			id="-gd-engine-icon"
			rel="icon"
			type="image/png"
			href="index.icon.png"
		/>
		<link rel="apple-touch-icon" href="index.apple-touch-icon.png" />
	</head>
	<body>
		<script src="loader.js"></script>
		<div
			id="loading-text"
			style="
				color: white;
				font-family: cursive;
				font-size: 48px;
				text-align: center;
				margin-top: 20px;
			"
		>
			LOADING...
		</div>
		<canvas id="canvas"> Your browser does not support the canvas tag. </canvas>

window.godotrunfunction = function () {
				const statusOverlay = document.getElementById("status");
				const statusProgress = document.getElementById("status-progress");
				const statusNotice = document.getElementById("status-notice");

let initializing = true;
				let statusMode = "";

const missing = Engine.getMissingFeatures({
					threads: GODOT_THREADS_ENABLED,
				});

if (missing.length !== 0) {
					if (
						GODOT_CONFIG["serviceWorker"] &&
						GODOT_CONFIG["ensureCrossOriginIsolationHeaders"] &&
						"serviceWorker" in navigator
					) {
						// There's a chance that installing the service worker would fix the issue
						Promise.race([
							navigator.serviceWorker
								.getRegistration()
								.then((registration) => {
									if (registration != null) {
										return Promise.reject(
											new Error("Service worker already exists.")
										);
									}
									return registration;
								})
								.then(() => engine.installServiceWorker()),
							// For some reason, `getRegistration()` can stall
							new Promise((resolve) => {
								setTimeout(() => resolve(), 2000);
							}),
						])
							.catch((err) => {
								console.error("Error while registering service worker:", err);
							})
							.then(() => {
								window.location.reload();
							});
					} else {
						// Display the message as usual
						const missingMsg =
							"Error\nThe following features required to run Godot projects on the Web are missing:\n";
						displayFailureNotice(missingMsg + missing.join("\n"));
					}
				} else {
					setStatusMode("progress");
					engine
						.startGame({
							onProgress: function (current, total) {
								if (current > 0 && total > 0) {
									statusProgress.value = current;
									statusProgress.max = total;
								} else {
									statusProgress.removeAttribute("value");
									statusProgress.removeAttribute("max");
								}
							},
						})
						.then(() => {
							setStatusMode("hidden");
						}, displayFailureNotice);
				}
			};
		</script>
	</body>
</html>

Preview

Open Advanced Editor Full Screen