Merge pull request #28 from boltgolt/dev

Version 0.2.1

.github/FUNDING.yml

@@ -1,2 +1,3 @@
 # These are supported funding model platforms
-ko_fi: boltgolt
+github: boltgolt
+custom: https://www.buymeacoffee.com/boltgolt

.gitignore

@@ -1,3 +1,6 @@
 node_modules
+
 config.override.json5
+keybinds.override.json5
+
 libraryfolders.vdf

README.md

@@ -72,7 +72,7 @@ Thanks to [Inygon](https://inygon.com/) for supporting open source development o
 
 [![Inygon](https://i.imgur.com/bQjz86D.png)](https://inygon.com/)
 
-If you want to support development on specific functionality, don't hesitate to contact me. Sending a onetime donation through [ko-fi](https://ko-fi.com/boltgolt) is also very appreciated.
+If you want to support development on specific functionality, don't hesitate to contact me. Supporting me through [Github Sponsors](https://github.com/sponsors/boltgolt/) is also very appreciated.
 
 ## License
 

config.json5 → config/config.json5

@@ -4,6 +4,8 @@
 // without making changes here. This makes your config a lot more portable.
 
 {
+	"_version": "0.2.1",
+
 	// Sends information about the grenades thrown this round to a server
 	// This information in only used to train a model to predict grenade
 	// landings, no personal information is send or logged.
@@ -12,6 +14,9 @@
 
 	// Settings related to the Boltobserv window
 	"window": {
+		// Don't show radar in a window, only a small status window will open
+		"disable": false,
+
 		// Always show the window as the top application
 		"alwaysOnTop": false,
 
@@ -44,6 +49,9 @@
 
 	// Settings related to remote browser access to the radar
 	"browser": {
+		// Prevents a background from being set in the browser, for OBS capture
+		"transparent": false,
+
 		"ports": {
 			// Serves static files, such as HTML. Use this one in your browser
 			"static": 36364,
@@ -61,7 +69,8 @@
 		"playerSmoothing": 13,
 
 		// Amount of scaling to apply to player dots on the radar
-		"playerDotScale": 1
+		// Values above 1 might be blurry
+		"playerDotScale": 0.7
 	},
 
 	// Settings related to the CSGO game
@@ -96,6 +105,10 @@
 	// Settings that should not be used in normal operation, but help to find issues
 	"debug": {
 		// Print the loaded config into the console
-		"printConfig": false
+		"printConfig": false,
+
+		// Don't open any electron window, just start the server
+		// Do NOT execute Boltobserv outside a terminal with this enabled, could become a zombie process
+		"terminalOnly": false
 	}
 }

config/keybinds.json5

@@ -0,0 +1,3 @@
+{
+	"Control+Alt+R": "functions.reload()"
+}

css/custom.css

@@ -0,0 +1,37 @@
+/*
+ * Use this file to apply custom styles to the radar image
+ */
+
+/* Any player dot */
+div.dot {}
+
+/* Players that are CT or T */
+div.dot.CT {}
+div.dot.T {}
+
+/* The player with the bomb */
+div.dot.bomb{}
+
+/* The player currently being observed */
+div.dot.active {}
+
+/* A dead player */
+div.dot.dead {}
+
+/* The number on a player dot */
+div.label {}
+
+/* The number on the dot being spectated */
+div.label.active {}
+
+/* The dropped or planted bomb on the map */
+#bomb {}
+
+/* Smoke circles on the map */
+#smokes > div {}
+
+/* Inferno circles on the map */
+.inferno > div {}
+
+/* The advisory on screen */
+#advisory {}

css/map.css

@@ -13,6 +13,11 @@ body {
 	bottom: 0;
 	left: 0;
 	z-index: 1;
+	transform: scale(1) translate(0%, 0%);
+
+	will-change: transform;
+	outline: .1vmin solid transparent
+	-webkit-backface-visibility: hidden;
 }
 
 #smokes, #entities {
@@ -31,7 +36,7 @@ body {
 	opacity: .8;
 	background: #9F9D9D;
 	box-sizing: border-box;
-	border: #D7D7D7 solid 4px;
+	border: #D7D7D7 solid .6vmin;
 	transform: translate(-50%, -50%);
 	transition: opacity .3s;
 }
@@ -69,7 +74,7 @@ body {
 	opacity: .75;
 	background: #ff4848;
 	box-sizing: border-box;
-	border: #ce3f00 solid 3px;
+	border: #ce3f00 solid .2vmin;
 	transform: translate(-50%, -50%);
 	transition: opacity .3s;
 }
@@ -85,15 +90,17 @@ body {
 	position: absolute;
 	background-image: url("../img/bomb-dropped.png");
 	background-size: contain;
-	height: 12px;
-	width: 12px;
+	height: 2.2vmin;
+	width: 2.2vmin;
 	bottom: -30%;
 	left: -30%;
+	transform: translate(-50%, -50%);
+	transform-origin: top left;
 }
 
 #bomb.defused {
 	background-image: url("../img/bomb-defused.png");
-	filter: drop-shadow(0 0 4px rgba(0, 255, 0, .3));
+	filter: drop-shadow(0 0 .4vmin rgba(0, 255, 0, .3));
 }
 
 #bomb.planted {
@@ -103,75 +110,88 @@ body {
 
 @keyframes beep {
 	0% {
-		filter: drop-shadow(0 0 0px rgba(255, 0, 0, 1));
+		filter: drop-shadow(0 0 0 rgba(255, 0, 0, 1));
 		background-color: rgba(255, 0, 0, 0);
 	}
 	10% {
-		filter: drop-shadow(0 0 6px rgba(255, 0, 0, 1));
-		background-color: rgba(255, 0, 0, 0.1);
+		filter: drop-shadow(0 0 1vmin rgba(255, 0, 0, 1));
+		background-color: rgba(255, 0, 0, 0.2);
 	}
 	20% {
-		filter: drop-shadow(0 0 14px rgba(255, 0, 0, 0));
+		filter: drop-shadow(0 0 1.8vmin rgba(255, 0, 0, 0));
 		background-color: rgba(255, 0, 0, 0);
 	}
 }
 
-div.player {
+div.dot, div.label {
 	position: absolute;
-	height: 16px;
-	width: 16px;
+	height: 5.6vmin;
+	width: 5.6vmin;
 	left: -100vw;
 	bottom: -100vh;
 	display: block;
 	background: #f00;
-	transform: translate(-8px, -8px);
-	transform-origin: center center;
-	text-align: center;
-	line-height: 16px;
-	border-radius: 100%;
-	color: black;
-	font-weight: bold;
-	text-shadow: 0px 0px 4px rgba(255,255,255,.2);
-	box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, .2);
-	font-size: 14px;
+	transform: translate(-50%, -50%);
+	transform-origin: top left;
+	border-radius: 100% .2vmin 100% 100%;
+	box-shadow: 0 0 1.6vmin .8vmin rgba(0, 0, 0, .2);
 	opacity: 1;
 	z-index: 15;
-	will-change: bottom, left;
+
+	will-change: bottom, left, transform;
+	outline: .1vmin solid transparent;
+	-webkit-backface-visibility: hidden;
+	backface-visibility: initial;
 }
 
-div.player.CT {
+div.dot.CT {
 	background: #5ab8f4;
 }
 
-div.player.T {
+div.dot.T {
 	background: #f0c941;
 }
 
-div.player.nade {
-	padding-top: 2px;
-	transform: translate(-8px, -9px);
-	clip-path: polygon(0 100%, 100% 100%, 100% 38%, 51% 0, 0 37%);
-	border-radius: 2px 2px 12px 12px;;
-}
-
-div.player.bomb {
-	border-radius: 2px;
+div.dot.bomb {
+	border-radius: 2vmin .4vmin 2vmin 2.4vmin;
 	background: #FF8200;
 }
 
-div.player.active {
-	filter: drop-shadow(0 0 0 #FFF) drop-shadow(0 0 0 #FFF) drop-shadow(0 0 0 #FFF);
+div.dot.active {
+	z-index: 16;
+	box-shadow: 0 0 0 .2vmin rgba(0, 0, 0, .9), 0 0 0 1vmin rgba(255, 255, 255, .9), 0 0 2.4vmin 1.2vmin rgba(255, 255, 255, .2);
 }
 
-div.player.dead {
+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%);
 	z-index: 13;
 	filter: none;
 }
 
+div.label {
+	background: none;
+	text-align: center;
+	color: black;
+	font-weight: bold;
+	text-shadow: 0 0 1.2vmin rgba(255, 255, 255, .2);
+	box-shadow: none;
+	line-height: 5.6vmin;
+	font-size: 4.8vmin;
+}
+
+div.label.active {
+	z-index: 16;
+	font-size: 5vmin;
+}
+
+div.label.dead {
+	display: none;
+}
+
 #advisory {
 	position: absolute;
 	width: 14%;

css/status.css

@@ -0,0 +1,54 @@
+body {
+	overflow: hidden;
+	cursor: inherit;
+}
+
+#game {
+	width: 100vw;
+	max-width: 100vw;
+}
+
+img {
+	height: 30px;
+	margin-right: 10px;
+	animation: none;
+}
+
+#text {
+	position: absolute;
+	top: 72px;
+	width: 100vw;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+}
+
+#text > div {
+	display: inline;
+	opacity: .8;
+}
+
+#text span {
+	text-decoration: underline;
+	cursor: pointer;
+	position: relative;
+	z-index: 2000;
+	-webkit-app-region: no-drag;
+}
+
+#text span:hover {
+	cursor: pointer;
+	-webkit-app-region: no-drag;
+}
+
+#dragarea {
+	-webkit-app-region: drag;
+	height: 100vh;
+	width: 100vw;
+	top: 0;
+	left: 0;
+}
+
+#version {
+	bottom: 14px;
+}

css/waiting.css

@@ -82,19 +82,19 @@ img {
 
 @keyframes beat {
 	40% {
-		transform: rotate(0deg);
+		transform: scale(1) rotate(0deg);
 	}
 
 	60% {
-		transform: rotate(190deg);
+		transform: scale(1.1) rotate(190deg);
 	}
 
 	70% {
-		transform: rotate(180deg);
+		transform: scale(1) rotate(180deg);
 	}
 
 	100% {
-		transform: rotate(180deg);
+		transform: scale(1) rotate(180deg);
 	}
 }
 

detectcfg.js

@@ -60,10 +60,9 @@ module.exports = {
 		}
 	},
 
-	install: (path) => {
-		// Need to reimport path because of electron shenanigans
-		let template = require("path").join(__dirname, "gamestate_integration_boltobserv.cfg")
-		let dest = require("path").join(path, "csgo", "cfg", "gamestate_integration_boltobserv.cfg")
+	install: (target) => {
+		let template = path.join(__dirname, "gamestate_integration_boltobserv.cfg")
+		let dest = path.join(target, "csgo", "cfg", "gamestate_integration_boltobserv.cfg")
 		fs.copyFileSync(template, dest)
 
 		console.info("Installed config file as", dest)