Allow hiding the job info headers too

This saves a lot of space when a lot of logs are hidden.

Thanks to thuban & JAA for the wording.

Author: pabs3

dashboard/assets/scripts/dashboard.js

@@ -1021,6 +1021,7 @@ class Dashboard {
 		const showNicks = args.showNicks ? Boolean(Number(args.showNicks)) : false;
 		const contextMenu = args.contextMenu ? Boolean(Number(args.contextMenu)) : true;
 		const initialFilter = args.initialFilter ?? "^$";
+		const showAllHeaders = args.showAllHeaders ? Boolean(Number(args.showAllHeaders)) : true;
 		const loadRecent = args.loadRecent ? Boolean(Number(args.loadRecent)) : true;
 		this.debug = args.debug ? Boolean(Number(args.debug)) : false;
 
@@ -1069,6 +1070,8 @@ class Dashboard {
 			addPageStyles(".job-nick-aligned { width: 0; }");
 		}
 
+		this.showAllHeaders(showAllHeaders);
+
 		this.setFilter(initialFilter);
 
 		const finishSetup = () => {
@@ -1249,6 +1252,11 @@ ${String(kbPerSec).padStart(3, "0")} KB/s`;
 		byId("filter-box").value = value;
 		byId("filter-box").onchange();
 	}
+
+	showAllHeaders(value) {
+		byId('show-all-headers').checked = value;
+		byId('hide-headers').sheet.disabled = value;
+	}
 }
 
 const ds = new Dashboard();

dashboard/dashboard.html

@@ -391,6 +391,12 @@
 	top: 0;
 }
 </style>
+<style id="hide-headers">
+.log-container:has(.log-window-hidden) {
+	display: none;
+	content-visibility: hidden;
+}
+</style>
 <div id="context-menu"></div>
 <div class="padded-page">
 	<div class="header">
@@ -401,6 +407,8 @@
 			Show: <input id="filter-box" type="text" size="21">
 			<input onclick="ds.setFilter('');" type="button" value="  All  " class="button">
 			<input onclick="ds.setFilter('^$');" type="button" value="None" class="button">
+			<input type="checkbox" id="show-all-headers" onclick="ds.showAllHeaders(this.checked);">
+			<label for="show-all-headers">Show all headers</label>
 		</div>
 		<div id="header-right">
 			<div id="meta-info"><span class="adbox">😊</span></div>