earjhew

2026-04-10 09:19:21 +01:00 · 2026-04-10 09:19:21 +01:00 · 385dbcd6e5
commit 385dbcd6e5
parent 23dfccda04
3 changed files with 37 additions and 2 deletions
--- a/public/css/launcher.css
+++ b/public/css/launcher.css
@ -99,8 +99,8 @@ body {
  padding: 0;
  background: #0a0603;
  overflow: hidden;
-  width: 100vw;
-  height: 100vh;
+  width: 100%;        /* nicht 100vw – Firefox zieht Scrollbar ab */
+  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
@ -113,6 +113,7 @@ body {
  width: 2037px;
  height: 1018px;
  flex-shrink: 0;
+  transform-origin: center center;
  will-change: transform;
 }

--- a/public/js/map-scale.js
+++ b/public/js/map-scale.js
@ -0,0 +1,33 @@
+/* ================================================
+   map-scale.js  –  Skaliert die Worldmap auf den
+   Viewport (cross-browser: Chrome, Firefox, Safari)
+================================================ */
+
+(function () {
+  const MAP_W = 2037;
+  const MAP_H = 1018;
+
+  function scaleMap() {
+    const map = document.querySelector(".worldmap");
+    if (!map) return;
+
+    // window.innerWidth/Height = Viewport ohne Scrollbars, konsistent in
+    // Chrome, Firefox und Safari
+    const scale = Math.min(
+      window.innerWidth  / MAP_W,
+      window.innerHeight / MAP_H
+    );
+
+    map.style.transform = `scale(${scale})`;
+  }
+
+  // Beim Laden
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", scaleMap);
+  } else {
+    scaleMap();
+  }
+
+  // Bei Größenänderung (z.B. Zoom-Level-Wechsel im Browser)
+  window.addEventListener("resize", scaleMap);
+})();
--- a/views/launcher.ejs
+++ b/views/launcher.ejs
@ -96,6 +96,7 @@
    <link rel="stylesheet" href="/css/hud.css" />
    <link rel="stylesheet" href="/css/mine.css" />
    <script src="/js/heartbeat.js"></script>
+    <script src="/js/map-scale.js"></script>
  </head>

  <body>