Admins Can Once Again Click Ban Panel Categories to Toggle Their Chec…

…kboxes (tgstation#60904)

* Re-Adds Header Checkboxes

- Ban Panel categories can now be clicked to click all the checkboxes in their category
- Adds a new js method called header_click_all_checkboxes whichs clicks all the checkboxes whose class is the hidden checkbox's name

Re-introduces a function that was lost with tgstation#60578 (6c4134d) , closes tgstation#60903 (Admins being unable to click on the ban category and check all subcheckboxes). The method was largely copied, but was changed to comply with the toggle_other_checkboxes() method introduced with the aforementioned PR by replacing a .checked assignment with a .click() call to ensure that duplicate entries are properly marked

Admins can now click categories to more easily ban people from all entries in that category. Demonstrated below to show that checkboxes are being toggled correctly in all relevant categories

Co-authored-by: John Willard <[email protected]>

code/modules/admin/sql_ban_system.dm

@@ -248,7 +248,8 @@
 		for(var/datum/job_department/department as anything in SSjob.joinable_departments)
 			var/label_class = department.label_class
 			var/department_name = department.department_name
-			output += "<div class='column'><label class='rolegroup [label_class]'>[department_name]</label><div class='content'>"
+			output += "<div class='column'><label class='rolegroup [label_class]'>[tgui_fancy ? "<input type='checkbox' name='[label_class]' class='hidden' onClick='header_click_all_checkboxes(this)'>" : ""] \
+			[department_name]</label><div class='content'>"
 			for(var/datum/job/job_datum as anything in department.department_jobs)
 				if(break_counter > 0 && (break_counter % 3 == 0))
 					output += "<br>"
@@ -275,7 +276,7 @@
 			"Abstract" = list("Appearance", "Emote", "Deadchat", "OOC"),
 			)
 		for(var/department in other_job_lists)
-			output += "<div class='column'><label class='rolegroup [ckey(department)]'>[department]</label><div class='content'>"
+			output += "<div class='column'><label class='rolegroup [ckey(department)]'>[tgui_fancy ? "<input type='checkbox' name='[department]' class='hidden' onClick='header_click_all_checkboxes(this)'>" : ""][department]</label><div class='content'>"
 			break_counter = 0
 			for(var/job in other_job_lists[department])
 				if(break_counter > 0 && (break_counter % 3 == 0))
@@ -321,7 +322,7 @@
 			),
 		)
 		for(var/department in long_job_lists)
-			output += "<div class='column'><label class='rolegroup long [ckey(department)]'>[department]</label><div class='content'>"
+			output += "<div class='column'><label class='rolegroup long [ckey(department)]'>[tgui_fancy ? "<input type='checkbox' name='[department]' class='hidden' onClick='header_click_all_checkboxes(this)'>" : ""][department]</label><div class='content'>"
 			break_counter = 0
 			for(var/job in long_job_lists[department])
 				if(break_counter > 0 && (break_counter % 10 == 0))

html/admin/banpanel.js

@@ -8,3 +8,12 @@ function toggle_other_checkboxes(source, copycats_str, our_index_str) {
         document.getElementById(source.id.slice(0, -1) + i).checked = source.checked;
     }
 }
+
+function header_click_all_checkboxes(source) {
+	var checkboxes = document.getElementsByClassName(source.name);
+	for(var i = 0, n = checkboxes.length; i < n; i++) {
+		if(checkboxes[i].checked != source.checked && checkboxes[i] != source) {
+			checkboxes[i].click();
+		}
+	}
+}