From: Elias Fleckenstein <eliasfleckenstein@web.de>
Date: Mon, 28 Jun 2021 09:11:46 +0000 (+0200)
Subject: Scale splash texts based on text length
X-Git-Url: https://git.lizzy.rs/?a=commitdiff_plain;h=ce8865ec152cefd2b2ef55af4a4578920958e247;p=dragonblocks.git

Scale splash texts based on text length
---

diff --git a/engine/mainmenu.js b/engine/mainmenu.js
index 5498ae3..0451588 100644
--- a/engine/mainmenu.js
+++ b/engine/mainmenu.js
@@ -33,7 +33,9 @@
 	logo.src = "textures/logo-mainmenu.png";
 
 	let splash = mainmenu.appendChild(document.createElement("div"));
-	splash.style.position = "absolute";
+	splash.style.position = "fixed";
+	splash.style.overflow = "hidden";
+	splash.style.whiteSpace = "nowrap";
 	splash.style.transform = "rotate(-15deg)";
 	splash.style.color = "yellow";
 	splash.style.fontSize = "30px";
@@ -434,11 +436,13 @@
 		mainmenu.style.visibility = "visible";
 
 		splash.innerHTML = splashes[Math.floor(Math.random() * splashes.length)];
+		let fontSize = Math.min(parseInt(10000 / splash.clientWidth), 30);
+		splash.style.fontSize = fontSize + "px";
 		updateSplash();
 
 		let counter = 0;
 		setInterval(_ => {
-			splash.style.fontSize = Math.sin(counter++ / 100 * Math.PI) * 5 + 30 + "px";
+			splash.style.fontSize = Math.sin(counter++ / 100 * Math.PI) * fontSize / 6 + fontSize + "px";
 			updateSplash();
 		});