Add option to set tombstone opacity per #63

boltgolt · Sep 11, 2024 · e06812f · e06812f
1 parent 57e8383
commit e06812f
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 7 deletions.
diff --git a/src/config/config.json5 b/src/config/config.json5
@@ -4,7 +4,7 @@
 // without making changes here. This makes your config a lot more portable.
 
 {
-	"_version": "1.3.0",
+	"_version": "1.5.1",
 
 	// Settings related to the Boltobserv window
 	"window": {
@@ -99,6 +99,8 @@
 		"playerSmoothing": 13,
 		// Frames to smooth out flying projectile movement
 		"projectileSmoothing": 5,
+		// Opacity between 0 and 1 of the dead player crosses, set to 0 to fully hide
+		"tombstoneOpacity": 0.4,
 
 		// Amount of scaling to apply to player dots on the radar
 		// Values above 1 might be blurry

diff --git a/src/css/map.css b/src/css/map.css
@@ -1,3 +1,8 @@
+:root {
+	--config-tombstone-opacity: .4;
+	--config-bomb-dot-scale: .7;
+}
+
 body {
 	overflow: hidden;
 }
@@ -120,11 +125,11 @@ div.dot.flashed.active {
 }
 
 div.dot.dead {
-	opacity: .4;
 	color: transparent;
 	text-shadow: none;
 	border-radius: 0;
 	clip-path: polygon(20% 0%, 0% 20%, 30% 50%, 0% 80%, 20% 100%, 50% 70%, 80% 100%, 100% 80%, 70% 50%, 100% 20%, 80% 0%, 50% 30%);
+	opacity: var(--config-tombstone-opacity);
 	z-index: 13 !important;
 	filter: none;
 }
@@ -186,7 +191,7 @@ div.label span {
 	width: 2.2vmin;
 	bottom: -30%;
 	left: -30%;
-	transform: translate(-50%, 50%);
+	transform: scale(var(--config-bomb-dot-scale)) translate(-50%, 50%);
 	transform-origin: bottom left;
 }
 

diff --git a/src/renderers/_init.js b/src/renderers/_init.js
@@ -52,11 +52,13 @@ socket.element.addEventListener("welcome", event => {
 		}
 	}
 
-	// Do the same for the bomb icon
-	document.getElementById("bomb").style.transform = `scale(${event.data.config.radar.bombDotScale}) translate(-50%, 50%)`
+	// Insert stylesheet into head to apply some CSS setings from config
+	document.documentElement.style.setProperty("--config-tombstone-opacity", event.data.config.radar.tombstoneOpacity)
+	document.documentElement.style.setProperty("--config-bomb-dot-scale", event.data.config.radar.bombDotScale)
 })
-if(socket.native && socket.native.readyNumber === 1){
-	socket.native.send("requestWelcome");
+
+if (socket.native && socket.native.readyNumber === 1) {
+	socket.native.send("requestWelcome")
 }
 
 window.addEventListener("DOMContentLoaded", () => {