Front-end modification for improved code server

Added JQuery to handle request.
Sends ajax request and gets json as response.
json contains token i.e uid which is answer id.
Using uid, an ajax request is sent after every 2 secs till the server
gives the desire result.
If the code result has error then html is written on the document.
If the result has correct answer then next question is displayed.

*includes function for string will not work for older browers.
Will substitute with a different function in next commit.

2 files changed, 90 insertions, 12 deletions

diff --git a/yaksh/static/yaksh/js/question.js b/yaksh/static/yaksh/js/question.js
deleted file mode 100644
index 96ff3de..0000000
--- a/yaksh/static/yaksh/js/question.js
+++ /dev/null
@@ -1,12 +0,0 @@
-function submitCode()
-{
-    document.forms["code"].submit();
-    var x = document.getElementById("status");
-    x.innerHTML = "<strong>Checking answer ...</strong>";
-    x = document.getElementById("check");
-    x.disabled = true;
-    x.value = "Checking Answer ...";
-    if (document.getElementById("skip")!=null) {
-    document.getElementById("skip").disabled = true;
-    }
-}
diff --git a/yaksh/static/yaksh/js/requesthandler.js b/yaksh/static/yaksh/js/requesthandler.js
new file mode 100644
index 0000000..9d023cc
--- /dev/null
+++ b/yaksh/static/yaksh/js/requesthandler.js
@@ -0,0 +1,90 @@
+request_status = "initial"
+function submitRequest(){
+    document.forms["code"].submit();
+}
+
+function check_state(state, uid, success) {
+    if (state == "running") {
+        setTimeout(get_result(uid), 2000);
+    }
+}
+
+function get_result(uid){
+    $.ajax({
+        method: "GET",
+        url: "/exam/get_results/"+uid+"/",
+        dataType: "html", // Your server can response html, json, xml format.
+        success: function(data, status, xhr) {
+            content_type = xhr.getResponseHeader("content-type");
+            if(content_type.includes("text/html")) {
+                request_status = "initial";
+                document.open();
+                document.write(data);
+                document.close();
+            } else if(content_type.includes("application/json")) {
+                res = JSON.parse(data);
+                request_status = res.status;
+                check_state(request_status, uid, res.success);
+            }
+        }
+    });
+}
+
+var global_editor = {};
+$(document).ready(function(){
+  // Codemirror object, language modes and initial content
+  // Get the textarea node
+  var textarea_node = document.querySelector('#answer');
+
+  var mode_dict = {
+    'python': 'python',
+    'c': 'text/x-csrc',
+    'cpp': 'text/x-c++src',
+    'java': 'text/x-java',
+    'bash': 'text/x-sh',
+    'scilab': 'text/x-csrc'
+  }
+
+  // Code mirror Options
+  var options = {
+      mode: mode_dict[lang],
+      gutter: true,
+      lineNumbers: true,
+      onChange: function (instance, changes) {
+          render();
+      }
+  };
+
+  // Initialize the codemirror editor
+  global_editor.editor = CodeMirror.fromTextArea(textarea_node, options);
+
+  // Setting code editors initial content
+  global_editor.editor.setValue(init_val);
+
+  function reset_editor() {
+      global_editor.editor.setValue(init_val);
+      global_editor.editor.clearHistory();
+  }
+    $('#code').submit(function(e) {
+      $.ajax({
+            type: 'POST',
+            url: $(this).attr("action"),
+            data: $(this).serializeArray(),
+            dataType: "html", // Your server can response html, json, xml format.
+            success: function(data, status, xhr) {
+                content_type = xhr.getResponseHeader("content-type");
+                if(content_type.includes("text/html")) {
+                    document.open();
+                    document.write(data);
+                    document.close();
+                } else if(content_type.includes("application/json")) {
+                    res = JSON.parse(data);
+                    var uid = res.uid;
+                    request_status = res.state;
+                    check_state(request_status, uid, false);
+                }
+            }
+          });
+          e.preventDefault(); // To stop the default form submission.
+    });
+});