Merge pull request #400 from maheshgudi/ajax_questions

Display error output without page reloading

7 files changed, 144 insertions, 108 deletions

diff --git a/yaksh/static/yaksh/css/exam.css b/yaksh/static/yaksh/css/exam.css
index ec48a14..7d10629 100644
--- a/yaksh/static/yaksh/css/exam.css
+++ b/yaksh/static/yaksh/css/exam.css
@@ -4,4 +4,4 @@ table td, table th { border: black solid 1px !important;
 			}
 #stdio, #assertion {
 	table-layout: fixed
-}
\ No newline at end of file
+}
diff --git a/yaksh/static/yaksh/js/requesthandler.js b/yaksh/static/yaksh/js/requesthandler.js
index 7ff90df..5159c31 100644
--- a/yaksh/static/yaksh/js/requesthandler.js
+++ b/yaksh/static/yaksh/js/requesthandler.js
@@ -53,16 +53,35 @@ function response_handler(method_type, content_type, data, uid){
     } else if(content_type.indexOf("application/json") !== -1) {
         res = JSON.parse(data);
         request_status = res.status;
-        if(method_type === "POST") {
-            uid = res.uid;
+        if (request_status){
+          if(method_type === "POST") {
+              uid = res.uid;
+          }
+          check_state(request_status, uid);
+        }
+        else{
+          unlock_screen();
+          if ($("#notification")){
+            $("#notification").toggle();
+          }
+
+          var error_output = document.getElementById("error_panel");
+          error_output.innerHTML = res.error;
+          focus_on_error(error_output);
         }
-        check_state(request_status, uid);
     } else {
         reset_values();
         unlock_screen();
     }
 }
 
+function focus_on_error(ele){
+    if (ele) {
+      ele.scrollIntoView(true);
+      window.scrollBy(0, -15);
+        }
+    }
+
 function ajax_check_code(url, method_type, data_type, data, uid) {
     $.ajax({
         method: method_type,
diff --git a/yaksh/templates/base.html b/yaksh/templates/base.html
index e7cc15c..3302482 100644
--- a/yaksh/templates/base.html
+++ b/yaksh/templates/base.html
@@ -52,6 +52,7 @@
 	       {% block content %}
 	       {% endblock %}
      </div>
+     </div>
      <footer class="footer" id="footer_div">
       <div class="logged_user_info" align="center">
             {% block info %}
@@ -61,7 +62,6 @@
          <p align="center">Developed by FOSSEE group, IIT Bombay</p>
      </div>
      </footer>
-  </div>
 
 </body>
 </html>
diff --git a/yaksh/templates/exam.html b/yaksh/templates/exam.html
index a1f0df4..6589bb5 100644
--- a/yaksh/templates/exam.html
+++ b/yaksh/templates/exam.html
@@ -33,15 +33,6 @@
     </nav><!-- /.navbar -->
 {% endblock %}
 {% block content %}
-  <script>
-    $(document).ready(function() {
-        var ele = document.getElementById('error_panel')
-        if (ele) {
-          ele.scrollIntoView(true);
-          window.scrollBy(0, -15);
-        }
-    });
-  </script>
 <div class="container-fluid">
     <div class="col-sm-3 col-md-2 sidebar">
         <p> Question Navigator </p>
@@ -75,96 +66,11 @@
             <p>Question(s) left: <b>{{ paper.questions_left }}</b></p>
         </div>
         <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
-            <div class="row">
                 <div class="row">
                 {% block main %}
                 {% endblock %}
             </div>
-            <br/>
-            {% if question.type == 'code' or question.type == 'upload' %}
-                {% if error_message %}
-                    <div class="row" id="error_panel">
-      {% for error in error_message %}
-              <div class="panel panel-danger">
-      <div class="panel-heading">Error No. {{ forloop.counter }}</div>
-      <div class="panel-body">
-      <div class="well well-sm">
-      {% if not error.type %}
-      <pre><code> {{error|safe}} </code></pre>
-      {% elif error.type == 'assertion' %}
-            {% if error.test_case %}
-      <strong> We tried your code with the following test case:</strong><br/></br>
-              <pre><code><strong style="color:#d9534f">{{error.test_case}}</strong></code></pre>
-            {% endif %}
-          <p> <b>The following error took place: </b></p>
-        <table class="table table-bordered" width="100%" id='assertion'>
-          <col width="30%">
-            <tr class = "active">
-            <td><b>Exception Name: </b></td>
-            <td><span style="color: #d9534f">{{error.exception}}</span></td>
-          </tr>
-          <tr>
-            <td><b>Exception Message: </b></td><td>{{error.message}}</td>
-          </tr>
-          <tr>
-            {% if error.traceback %}
-            <td><b>Full Traceback: </b></td>
-            <td><pre>{{error.traceback}}</pre></td>
-            {% endif %}
-          </tr>
-        </table>
-      {% elif error.type == 'stdio' %}
-        {% if error.given_input %}
-         <table class="table table-bordered">
-          <col width="30%">
-            <tr class = "active">
-            <td> For given Input value(s):</td>
-            <td>{{error.given_input}}</td>
-            </tr>
-         </table>
-       {% endif %}
-        <table class="table table-bordered" width="100%" id="stdio">
-          <col width="10%">
-          <col width="40%">
-          <col width="40%">
-          <col width="10%">
-          <tr class="info">
-          <th><center>Line No.</center></th>
-          <th><center>Expected Output</center></th>
-          <th><center>User output</center></th>
-          <th><center>Status</center></th>
-          </tr>
-          {% for expected,user in error.expected_output|zip:error.user_output %}
-          <td> {{forloop.counter}} </td>
-          <td>{{expected|default:""}} </td>
-          <td>{{user|default:""}}</td>
-          {% if forloop.counter0 in error.error_line_numbers or not expected or not user %}
-          <td><span class ="glyphicon glyphicon-remove text-warning"/></td>
-          {% else %}
-          <td><span class ="glyphicon glyphicon-ok text-success"/></td>
-          {% endif %}
-          </tr>
-          {% endfor %}
-          </table>
-          <table width="100%" class='table table-bordered'>
-          <col width="10">
-          <tr class = "danger">
-          <td><b>Error:</b></td>
-           <td>{{error.error_msg}}</td>
-           </tr>
-          </table>
-        
-        {% endif %}
         </div>
-      </div>
-      </div>
-      {% endfor %}
-
-                    </div>
-                {% endif %}
-            {% endif %}
-            </div>
         </div>
-    </div>
-</div>
+
 {% endblock %}
diff --git a/yaksh/templates/yaksh/error_template.html b/yaksh/templates/yaksh/error_template.html
new file mode 100644
index 0000000..61657ae
--- /dev/null
+++ b/yaksh/templates/yaksh/error_template.html
@@ -0,0 +1,91 @@
+{% block css%}
+    <link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/dashboard.css" type="text/css" />
+{% endblock %}
+
+{% load custom_filters %}
+
+{% if error_message %}
+    {% for error in error_message %}
+
+      <div class="panel panel-danger">
+      <div class="panel-heading">Error No. {{ forloop.counter }}</div>
+      <div class="panel-body">
+      <div class="well well-sm">
+      {% if not error.type %}
+        <pre><code> {{error|safe}} </code></pre>
+
+      {% elif error.type == 'assertion' %}
+
+        {% if error.test_case %}
+          <strong> We tried your code with the following test case:</strong>
+          <br/></br>
+          <pre><code><strong style="color:#d9534f">
+          {{error.test_case}}
+          </strong></code></pre>
+        {% endif %}
+        <p> <b>The following error took place: </b></p>
+        <table class="table table-bordered" width="100%" id='assertion'>
+        <col width="30%">
+            <tr class = "active">
+              <td><b>Exception Name: </b></td>
+              <td><span style="color: #d9534f">{{error.exception}}</span></td>
+          </tr>
+          <tr>
+            <td><b>Exception Message: </b></td><td>{{error.message}}</td>
+          </tr>
+          <tr>
+            {% if error.traceback %}
+            <td><b>Full Traceback: </b></td>
+            <td><pre>{{error.traceback}}</pre></td>
+            {% endif %}
+          </tr>
+        </table>
+
+      {% elif error.type == 'stdio' %}
+
+        {% if error.given_input %}
+         <table class="table table-bordered">
+          <col width="30%">
+            <tr class = "active">
+            <td> For given Input value(s):</td>
+            <td>{{error.given_input}}</td>
+            </tr>
+         </table>
+       {% endif %}
+
+        <table class="table table-bordered" width="100%" id="stdio">
+          <col width="10%">
+          <col width="40%">
+          <col width="40%">
+          <col width="10%">
+          <tr class="info">
+          <th><center>Line No.</center></th>
+          <th><center>Expected Output</center></th>
+          <th><center>User output</center></th>
+          <th><center>Status</center></th>
+          </tr>
+          {% for expected,user in error.expected_output|zip:error.user_output %}
+          <td> {{forloop.counter}} </td>
+          <td>{{expected|default:""}} </td>
+          <td>{{user|default:""}}</td>
+          {% if forloop.counter0 in error.error_line_numbers or not expected or not user %}
+          <td><span class ="glyphicon glyphicon-remove text-warning"/></td>
+          {% else %}
+          <td><span class ="glyphicon glyphicon-ok text-success"/></td>
+          {% endif %}
+          </tr>
+          {% endfor %}
+          </table>
+          <table width="100%" class='table table-bordered'>
+          <col width="10">
+          <tr class = "danger">
+          <td><b>Error:</b></td>
+           <td>{{error.error_msg}}</td>
+           </tr>
+          </table>
+        {% endif %}
+        </div>
+      </div>
+      </div>
+      {% endfor %}
+{% endif %}
\ No newline at end of file
diff --git a/yaksh/templates/yaksh/question.html b/yaksh/templates/yaksh/question.html
index 83ee16b..d58c934 100644
--- a/yaksh/templates/yaksh/question.html
+++ b/yaksh/templates/yaksh/question.html
@@ -227,12 +227,16 @@ lang = "{{ question.language }}"
          {% if question in paper.get_questions_unanswered %}
          <button class="btn btn-primary"  onclick="call_skip('{{ URL_ROOT }}/exam/{{ question.id }}/skip/{{ paper.attempt_number }}/{{ paper.question_paper.id }}/')" name="skip" id="skip">Attempt Later <span class="glyphicon glyphicon-arrow-right"></span></button>
          {% endif %}
-         </div>
-                 </div>
-             </div>
-
+         {% endif %} 
+       </div>
          </form>
-         {% endif %}
+         </div>
+     </div>
+   </div>
+   <br/>
+  {% if question.type == 'code' or question.type == 'upload' %}
+  <div class="row" id="error_panel"></div>
+  {% endif %}
          
     <!-- Modal -->
     <div class="modal fade " id="upload_alert" >
diff --git a/yaksh/views.py b/yaksh/views.py
index bc03ca2..74d352b 100644
--- a/yaksh/views.py
+++ b/yaksh/views.py
@@ -8,7 +8,7 @@ from django.http import HttpResponse, JsonResponse
 from django.core.urlresolvers import reverse
 from django.contrib.auth import login, logout, authenticate
 from django.shortcuts import render_to_response, get_object_or_404, redirect
-from django.template import RequestContext
+from django.template import RequestContext, Context, Template
 from django.http import Http404
 from django.db.models import Sum, Max, Q, F
 from django.views.decorators.csrf import csrf_exempt
@@ -658,8 +658,24 @@ def get_result(request, uid):
     result['status'] = result_state.get('status')
     if result['status'] == 'done':
         result = json.loads(result_state.get('result'))
-        next_question, error_message, paper = _update_paper(request, uid, result)
-        return show_question(request, next_question, paper, error_message)
+        template_path = os.path.join(*[os.path.dirname(__file__),
+                                       'templates','yaksh',
+                                       'error_template.html'
+                                       ]
+                                     )
+        next_question, error_message, paper = _update_paper(request,uid,
+                                                            result
+                                                            )
+        if result.get('success'):
+            return show_question(request, next_question, paper, error_message)
+        else:
+            with open(template_path) as f:
+                template_data = f.read()
+                template = Template(template_data)
+                context = Context({"error_message": result.get('error')})
+                render_error = template.render(context)
+                result["error"] = render_error
+
     return JsonResponse(result)