From e90667a37e4279899e267bbb25c667f8eb8cd1ef Mon Sep 17 00:00:00 2001
From: Ross <xkjq@ymail.com>
Date: Mon, 19 Jan 2026 11:52:45 +0000
Subject: [PATCH] feat: enhance error submission overlay with improved
 messaging and close button functionality

---
 js/interact.js |  2 +-
 js/main.js     | 14 +++++++++++---
 2 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/js/interact.js b/js/interact.js
index 9bceeaf..fd25bce 100644
--- a/js/interact.js
+++ b/js/interact.js
@@ -140,7 +140,7 @@ export function submissionError(data, answer_json, exam_details) {
 
   if ($("#submit-error-overlay").length < 1) {
     $("body").append(
-      `<div id='submit-error-overlay'><span style='color: white'><p>An error has occurred when submitting your answers. A copy of your answers are displayed below, you may wish to <a id="save-failed-answers" href="#">save a copy</a>. Please try submitting again or refresh this page to continue (answers will be saved locally in the browser unless you clear local storage).</p><p>${html.get(0).innerHTML}</p><p>${JSON.stringify(
+      `<div id='submit-error-overlay'><span style='color: white'><p>An error has occurred when submitting your answers. A copy of your answers are displayed below, you may wish to <a id="save-failed-answers" href="#">save a copy</a> if subsequent submissions still fail. Please try submitting again or refresh this page to continue (answers will be saved locally in the browser unless you clear local storage).</p><p>${html.get(0).innerHTML}</p><p>${JSON.stringify(
         answer_json
       )}</p></span></div>`
     );
diff --git a/js/main.js b/js/main.js
index 8638a39..b0869c1 100644
--- a/js/main.js
+++ b/js/main.js
@@ -2949,14 +2949,22 @@ $("#btn-view-local-answers").click(async function(evt) {
 
   if ($("#view-answers-overlay").length < 1) {
     $("body").append(
-      `<div id='view-answers-overlay'><span style='color: white'><p>${JSON.stringify(
-        answer_json
-      )}</p></span></div>`
+      `<div id='view-answers-overlay'>
+          <button id='close-view-answers' class='navigation' style='position: absolute; top: 8px; right: 8px;'>Close</button>
+          <div style='padding: 16px; color: white; overflow:auto; max-height:90vh;'>
+            <pre style='white-space:pre-wrap; word-break:break-word;'>${JSON.stringify(answer_json, null, 2)}</pre>
+          </div>
+       </div>`
     );
 
     $("#view-answers-overlay").height(docHeight);
     $("#view-answers-overlay").append("<a id='save-failed-answers'>Save</a>")
 
+    // Close button handler
+    $("#close-view-answers").on("click", function() {
+      $("#view-answers-overlay").remove();
+    });
+
     let file = new Blob([JSON.stringify(answer_json)], {type: "application/json"})
 
     let link = document.getElementById("save-failed-answers");