From 82cae6b6a32163b4319083a7d11414e643a312d1 Mon Sep 17 00:00:00 2001
From: Glenn Rice <grice1@missouriwestern.edu>
Date: Tue, 5 Dec 2023 14:38:28 -0600
Subject: [PATCH] Suggestions for improvement.

Inline javascript is bad form.  There is already a javascript file
dedicated to the ProblemSetDetail.pm page, so put the javascript there
instead.

The return value of the Mojolicious::Plugin::TagHelpers `tag` method is
already a Mojo::ByteStream object.  The issue that causes the display to
not work is that the contents of the `div` are not, since they are just
bare strings concatentated together, and so they are html escaped.  So
use a Mojo::Collection that is joined by the empty string.  That also
returns a Mojo::ByteStream object, and so it is not html escaped. This
is also consistent with how I have done this sort of thing elsewhere in
the code.

Also remove what appears to be an errant `warn` statement.
---
 .../js/ProblemSetDetail/problemsetdetail.js   |  6 ++++++
 .../Instructor/ProblemSetDetail.pm            | 20 +++++++++----------
 2 files changed, 16 insertions(+), 10 deletions(-)

diff --git a/htdocs/js/ProblemSetDetail/problemsetdetail.js b/htdocs/js/ProblemSetDetail/problemsetdetail.js
index 49a0c58d13..2f46256fc0 100644
--- a/htdocs/js/ProblemSetDetail/problemsetdetail.js
+++ b/htdocs/js/ProblemSetDetail/problemsetdetail.js
@@ -414,4 +414,10 @@
 		comboBoxSelect.addEventListener('change',
 			() => comboBoxText.value = comboBoxSelect.options[comboBoxSelect.selectedIndex].value);
 	});
+
+	// Set up seed randomization buttons.
+	for (const btn of document.querySelectorAll('.randomize-seed-btn')) {
+		const input = document.getElementById(btn.dataset.seedInput);
+		if (input) btn.addEventListener('click', () => (input.value = Math.floor(Math.random() * 10000)));
+	}
 })();
diff --git a/lib/WeBWorK/ContentGenerator/Instructor/ProblemSetDetail.pm b/lib/WeBWorK/ContentGenerator/Instructor/ProblemSetDetail.pm
index 07d08d098d..9c1bf712a2 100644
--- a/lib/WeBWorK/ContentGenerator/Instructor/ProblemSetDetail.pm
+++ b/lib/WeBWorK/ContentGenerator/Instructor/ProblemSetDetail.pm
@@ -950,22 +950,22 @@ sub fieldHTML ($c, $userID, $setID, $problemID, $globalRecord, $userRecord, $fie
 			);
 			if ($field eq 'problem_seed') {
 				# Insert a randomization button
-				$inputType = Mojo::ByteStream->new($c->tag(
+				$inputType = $c->tag(
 					'div',
 					class => 'input-group input-group-sm',
 					style => 'min-width: 7rem',
-					$c->number_field(@field_args, min => 0)->to_string
-						. $c->tag(
+					$c->c(
+						$c->number_field(@field_args, min => 0),
+						$c->tag(
 							'button',
-							type    => 'button',
-							class   => 'btn btn-sm btn-secondary',
-							title   => 'randomize',
-							onclick =>
-							"(function() {document.getElementById('$recordType.$recordID.${field}_id').value = Math.floor(Math.random() * 10000);})();",
+							type  => 'button',
+							class => 'randomize-seed-btn btn btn-sm btn-secondary',
+							title => 'randomize',
+							data  => { seed_input => "$recordType.$recordID.${field}_id" },
 							$c->tag('i', class => 'fa-solid fa-shuffle')
 						)
-				))->html_unescape;
-				warn(ref($inputType));
+					)->join('')
+				);
 			} else {
 				$inputType = $c->text_field(@field_args);
 			}