diff --git a/webradar/index.html b/webradar/index.html index 4bd6f5e..a9ece3c 100644 --- a/webradar/index.html +++ b/webradar/index.html @@ -10,8 +10,14 @@
- - +
+ + +
+
+ + +
diff --git a/webradar/script.js b/webradar/script.js index efd2512..c8c386f 100644 --- a/webradar/script.js +++ b/webradar/script.js @@ -7,7 +7,7 @@ const textColor = "#d1d1d1" // Settings shouldZoom = true -drawStats = true +drawStats = false // Common canvas = null @@ -35,7 +35,7 @@ if (location.protocol == 'https:') { } else { websocketAddr = `ws://${window.location.host}/ws` } -//websocketAddr = "ws://192.168.0.235:8000/ws" +websocketAddr = "ws://192.168.0.235:8000/ws" // Util functions const clamp = (num, min, max) => Math.min(Math.max(num, min), max); @@ -520,6 +520,9 @@ function connect() { } addEventListener("DOMContentLoaded", (e) => { + document.getElementById("zoomCheck").checked = true; + + canvas = document.getElementById('canvas'); canvas.width = 1024; canvas.height = 1024; diff --git a/webradar/styles.css b/webradar/styles.css index 4dd06c5..d4842d2 100644 --- a/webradar/styles.css +++ b/webradar/styles.css @@ -9,11 +9,10 @@ body { } #canvasContainer { - aspect-ratio: 1 / 1; - height: 100vh; + width: 100vmin; + height: 100vmin; position: relative; overflow: hidden; - transition: width 0.5s ease; /* Smooth transition */ float: left; object-fit: contain; } @@ -37,6 +36,11 @@ canvas { } .settings { + display: flex; + flex-direction: column; + + font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; + color: white; visibility: visible; opacity: 0; padding: 10px;