barf: some more fixes

ops/nixos/etheroute-lon01/default.nix

@@ -7,6 +7,7 @@
   imports = [
     ../lib/bgp.nix
     ../lib/zfs.nix
+    ../totoro/barf.nix  # eww
   ];
 
   boot.initrd = {
@@ -263,6 +264,7 @@
     };
   in [
     (bindMountSvc "/var/lib/tailscale" "tailscaled.service")
+    (bindMountSvcDynamic "barf-fe" "barf-fe.service")
   ];
 
   services.redis.servers."" = {
@@ -322,6 +324,7 @@
           allowed_domains = null;
         } // extraConfig;
       in [
+        (service "localhost:12001" "barf.lukegb.com" (public {}))
         (service "cofractal-ams01.int.as205479.net" "int.lukegb.com" {})
         (service "cofractal-ams01.int.as205479.net" "logged-out.int.lukegb.com" (public {}))
         (service "cofractal-ams01.int.as205479.net" "sonarr.int.lukegb.com" {})

ops/nixos/totoro/barf.nix

@@ -8,10 +8,38 @@
   systemd.targets.barf = {
     wantedBy = [ "multi-user.target" ];
   };
+  systemd.services.barf-fe = {
+    wantedBy = [ "barf.target" ];
+    serviceConfig = {
+      ExecStart = "${depot.web.barf.frontend}/bin/frontend -serve=:12001 -sam_backend=http://127.0.0.1:11316 -db_path=/var/lib/barf-fe/db.db";
+      StateDirectory = "barf-fe";
+      User = "barf-fe";
+      PrivateTmp = true;
+      PrivateDevices = true;
+      RestrictNamespaces = true;
+      RestrictRealtime = true;
+      ProtectKernelLogs = true;
+      ProtectControlGroups = true;
+      ProtectHostname = true;
+      ProtectHome = true;
+      ProtectProc = "invisible";
+      ProcSubset = "pid";
+      ProtectKernelTunables = true;
+      ProtectKernelModules = true;
+      ProtectClock = true;
+      CapabilityBoundingSet = "";
+      LockPersonality = true;
+      PrivateUsers = true;
+      RestrictAddressFamilies = "AF_UNIX AF_INET AF_INET6 AF_NETLINK";
+
+      DynamicUser = true;
+      Restart = "always";
+    };
+  };
   systemd.services.barf-sapid = {
     wantedBy = [ "barf.target" ];
     serviceConfig = {
-      ExecStart = "${depot.web.barf.sapi.sapid-wrapper}/bin/sapid-wrapper";
+      ExecStart = "${depot.web.barf.sapi.sapid-wrapper}/bin/sapid-wrapper -serve=127.0.0.1:11316";
       CacheDirectory = "barf-sapid";
       User = "barf-sapid";
       KillMode = "mixed";

web/barf/frontend/index.html

@@ -316,28 +316,28 @@ body.all-done .now-safe {
 	background-repeat: no-repeat;
 }
 .dialog-icon-sound {
-	background-image: url(static/soundicon.png);
+	background-image: url(/static/soundicon.png);
 }
 .dialog-icon-agent {
-	background-image: url(static/agenticon.png);
+	background-image: url(/static/agenticon.png);
 }
 .dialog-icon-email {
-	background-image: url(static/emailicon.png);
+	background-image: url(/static/emailicon.png);
 }
 .dialog-icon-error {
-	background-image: url(static/erroricon.png);
+	background-image: url(/static/erroricon.png);
 }
 .dialog-icon-calendar {
-	background-image: url(static/calendaricon.png);
+	background-image: url(/static/calendaricon.png);
 }
 .dialog-icon-filmstrip {
-	background-image: url(static/filmstripicon.png);
+	background-image: url(/static/filmstripicon.png);
 }
 .dialog-icon-network {
-	background-image: url(static/networkicon.png);
+	background-image: url(/static/networkicon.png);
 }
 .dialog-icon-speech {
-	background-image: url(static/speechicon.png);
+	background-image: url(/static/speechicon.png);
 }
 .dialog-actual-body {
 	grid-area: body;
@@ -430,7 +430,7 @@ body.all-done .now-safe {
 	background-color: #d8d0cc;
 }
 .checkbox-it:checked::before {
-	background-image: url(static/check.svg);
+	background-image: url(/static/check.svg);
 }
 .dialog-rule {
 	margin: 0.5rem 0;
@@ -555,6 +555,10 @@ body.all-done .now-safe {
 	.dialog-bottom-buttons {
 		margin-right: 0;
 	}
+
+	#assistant, #assistant-bubble {
+		display: none;
+	}
 }
 @media (max-width: 1450px) {
 	.progress-list, .will-complete {
@@ -623,7 +627,7 @@ body.all-done .now-safe {
 		<div class="dialog-body">
 			<div class="dialog-body-icon dialog-icon-sound"></div>
 			<div class="dialog-actual-body">
-				<p class="if-on-mobile"><strong>You seem to be on a mobile device, or with a window that I arbitrarily decided was 'too small'.</strong> You might be better off using this application from a desktop or laptop, for the full BARF™ experience.</p>
+				<p class="if-on-mobile"><strong>You seem to be on a mobile device, or with a window that I arbitrarily decided was 'too small'.</strong> You <em>will</em> be better off using this application from a desktop or laptop, for the full BARF™ experience.</p>
 				<hr class="if-on-mobile dialog-rule">
 				<p>You can choose whether to have audio turned on, for the real BARF™ eXPerience. I won't force you to, but it'll be slightly funnier. Probably.</p>
 				<div class="audio"><label><input type="checkbox" name="audio-enabled" data-dataset-name="audioEnabled" value="on" class="audio-toggle checkbox-it"> Enable audio</label></div>
@@ -885,7 +889,7 @@ let CURRENT_PHASE = 0;
 
 class BARF {
 	constructor() {
-		this.textToSpeechEnabledSound = new Audio("static/audioenabled.wav");
+		this.textToSpeechEnabledSound = new Audio("/static/audioenabled.wav");
 		this.currentlySpeaking = null;
 		this.dataset = {
 			currentPhase: 0,
@@ -928,7 +932,9 @@ class BARF {
 			return;
 		}
 		this.assistantRunning = true;
+		const assistantActuallyRendering = window.getComputedStyle(document.querySelector('#assistant')).display !== 'none';
 		if (!this.assistantShown) {
+			if (assistantActuallyRendering) {
 				this.assistantQueue.splice(0, 0, {
 					what: 'playVideo',
 					video: 'intro',
@@ -936,6 +942,9 @@ class BARF {
 						this.assistantShown = true;
 					},
 				});
+			} else {
+				this.assistantShown = true;
+			}
 		}
 		const firstThing = this.assistantQueue.shift();
 		if (!firstThing) {
@@ -958,9 +967,11 @@ class BARF {
 					this.assistantDoTTS(firstThing.text, resolve);
 				}));
 			}
+			if (assistantActuallyRendering) {
 				promises.push(new Promise((resolve) => {
 					this.assistantDoVideo(firstThing.video, firstThing.videoBackground, resolve);
 				}));
+			}
 			Promise.allSettled(promises).finally(pumpLoop);
 			break;
 		case 'doTTS':