From d066d283a45c245bbae7d0bdf96258ff014cdeb3 Mon Sep 17 00:00:00 2001
From: Ross <xkjq@ymail.com>
Date: Mon, 1 Feb 2021 12:09:46 +0000
Subject: [PATCH] few fixes

---
 index.html     |   2 +-
 js/interact.js | 116 ++++++++++++++++++++++++++++---------------------
 2 files changed, 68 insertions(+), 50 deletions(-)

diff --git a/index.html b/index.html
index 05248b1..fad2ee8 100644
--- a/index.html
+++ b/index.html
@@ -18,7 +18,7 @@
         <div class="content-panel">
             <div class="nav-bar">
                 <button id="review-button" class="navigation nav-right"><b>☰</b></button>
-                <button class="submit-button navigation nav-right"><b>submit</b></button>
+                <button id="nav-submit-button" class="submit-button navigation nav-right"><b>submit</b></button>
                 <button id="options-button" class="navigation nav-right"
                     title="click to load new packet or manage saved answers">options</button>
                 <button id="review-overlay-button" class="navigation nav-right"
diff --git a/js/interact.js b/js/interact.js
index 085142a..d74e8c1 100644
--- a/js/interact.js
+++ b/js/interact.js
@@ -4,9 +4,9 @@
 export function submitAnswers(window, db) {
   console.log(
     getJsonAnswers(window, db).then((a) => {
-    let json = {
-        "eid": window.eid,
-        "answers": JSON.stringify(a),
+      let json = {
+        eid: window.eid,
+        answers: JSON.stringify(a),
       };
       postAnswers(json);
     })
@@ -34,59 +34,77 @@ export function getJsonAnswers(window, db) {
 export function postAnswers(ans) {
   $("#progress").html("Submitting answers...");
   // ans = {"test" : 1}
-  console.log(ans)
-  $.post(window.config.exam_submit_url, ans, null, "json").done((data) => {
-    console.log(data);
-    if (data.success) {
-      if (data.question_count == window.number_of_questions) {
-        let ret = confirm(
-          `${data.question_count} answers sucessfully submitted. Click OK to finish the exam.`
-        );
+  console.log(ans);
+  $.post(window.config.exam_submit_url, ans, null, "json")
+    .done((data) => {
+      console.log("returned data", data);
+      if (data.success) {
+        $("#submit-error-overlay").remove();
+        if (data.question_count == window.number_of_questions) {
+          let ret = confirm(
+            `${data.question_count} answers sucessfully submitted. Click OK to finish the exam.`
+          );
 
-        if (ret) {
-          window.review = true;
-          window.saveSession();
-          if (config.exam_results_url != "") {
-            let url = config.exam_results_url;
+          if (ret) {
+            window.review = true;
+            window.saveSession();
+            if (config.exam_results_url != "") {
+              let url = config.exam_results_url;
 
-            if (window.cid != "") {
-              url = url + window.cid;
+              if (window.cid != "") {
+                url = url + window.cid;
+              }
+              $("#options-link")
+                .empty()
+                .append(
+                  `<a href="${url}" target="_blank"><div class="packet-button">Results and answers</div></a>`
+                );
             }
-            $("#options-link")
-              .empty()
-              .append(
-                `<a href="${url}" target="_blank"><div class="packet-button">Results and answers</div></a>`
-              );
+            $("#options-panel").show();
+          } else {
           }
-          $("#options-panel").show();
         } else {
+          alert(`${data.question_count} answers sucessfully submitted.`);
         }
       } else {
-        alert(`${data.question_count} answers sucessfully submitted.`);
+            submissionError(data, ans);
       }
-    } else {
-      alert(`Error submitting answers: ${data.error}`);
-      var docHeight = $(document).height();
-
-      $("body").append(
-        `<div id='overlay'><span style='color: white'><p>An error has occured when submit your answers. A copy of your answers are displayed below, you may wish to save a copy. Please refresh this page to continue.</p>${JSON.stringify(
-          ans
-        )}</span></div>`
-      );
-
-      $("#overlay").height(docHeight).css({
-        opacity: 0.9,
-        position: "absolute",
-        top: 0,
-        left: 0,
-        "background-color": "black",
-        width: "100%",
-        "user-select": "text",
-        "-moz-user-select": "text",
-        "-webkit-user-select": "text",
-        "z-index": 5000,
-      });
-    }
-  });
+    })
+    .fail((e) => {
+      // Will occur with server error such as 500
+      console.log("error", e);
+      submissionError(e, ans);
+    });
   // $.post( "http://localhost:8000/submit_answers", JSON.stringify(ans));
 }
+
+function submissionError(data, ans) {
+  // error will not be defined with server errors
+  if (data.error != undefined) {
+    alert(`Error submitting answers: ${data.error}`);
+  } else {
+    alert(`Error submitting answers`);
+  }
+  var docHeight = $(document).height();
+
+  $("body").append(
+    `<div id='submit-error-overlay'><span style='color: white'><p>An error has occured when submit your answers. A copy of your answers are displayed below, you may wish to save a copy. Please try submitting again or refresh this page to continue.</p>${JSON.stringify(
+      ans
+    )}</span></div>`
+  );
+
+  $("#nav-submit-button").prependTo("#submit-error-overlay");
+
+  $("#submit-error-overlay").height(docHeight).css({
+    opacity: 0.9,
+    position: "absolute",
+    top: 0,
+    left: 0,
+    "background-color": "black",
+    width: "100%",
+    "user-select": "text",
+    "-moz-user-select": "text",
+    "-webkit-user-select": "text",
+    "z-index": 5000,
+  });
+}