Merge pull request #538 from ankitjavalkar/fix-monitor-page-final

[UI] Fix Monitor in Moderator interface:

3 files changed, 269 insertions, 240 deletions

diff --git a/yaksh/templates/base.html b/yaksh/templates/base.html
index 2842c8b..e5d1a56 100644
--- a/yaksh/templates/base.html
+++ b/yaksh/templates/base.html
@@ -60,7 +60,7 @@
 
      <div class="content">
          <div class="header">
-             <h3><center>{% block pagetitle %}{% endblock pagetitle %}</center></h2>
+             <h3><center>{% block pagetitle %}{% endblock pagetitle %}</center></h3>
          </div>
          {% block content %}
          {% endblock %}
diff --git a/yaksh/templates/manage.html b/yaksh/templates/manage.html
index fbd4c64..5b11a84 100644
--- a/yaksh/templates/manage.html
+++ b/yaksh/templates/manage.html
@@ -33,6 +33,7 @@
                 <a class="dropdown-item" id="user_logout" href="{{URL_ROOT}}/exam/logout/"><i class="fa fa-sign-out"></i> Logout</a>
                 <div class="dropdown-divider"></div>
               </div>
+            </li>
         </ul>
     </div>
   </div>
diff --git a/yaksh/templates/yaksh/user_data.html b/yaksh/templates/yaksh/user_data.html
index 62e9c56..317cb15 100644
--- a/yaksh/templates/yaksh/user_data.html
+++ b/yaksh/templates/yaksh/user_data.html
@@ -1,264 +1,294 @@
 {% extends "manage.html" %}
 {% load custom_filters %}
-
 {% block pagetitle %} Data for user {{ data.user.get_full_name.title }} {% endblock pagetitle %}
-
 {% block content %}
-
 {% block script %}
 <script src= "{{ URL_ROOT }}/static/yaksh/js/edit_question.js"></script>
 <script src="{{ URL_ROOT }}/static/yaksh/js/mathjax/MathJax.js?config=TeX-MML-AM_CHTML"></script>
-
 {% endblock %}
 <div class="yakshwell container">
-<form action="" method="post">
-  <div class="card col-md-4">
-<p class="card-body"> 
-Name: {{ data.user.get_full_name.title }} <br/>
-Username: {{ data.user.username }} <br/>
-{% if data.profile %}
-Roll number: {{ data.profile.roll_number }} <br/>
-Position: {{ data.profile.position }} <br/>
-Department: {{ data.profile.department }} <br/>
-Institute: {{ data.profile.institute }} <br/>
-{% endif %}
-Email: {{ data.user.email }} <br/>
-Date joined: {{ data.user.date_joined }} <br/>
-Last login: {{ data.user.last_login }} 
-</p>
-</div>
-{% if data.papers %}
-<p class="text-center"><a href="{{URL_ROOT}}/exam/manage/gradeuser/{{data.papers.0.question_paper.quiz.id}}/{{ data.user.id }}/{{course_id}}/"  class="btn btn-info ">
-    Grade/correct paper</a>
-</p>
-
-{% for paper in data.papers %}
-{% if forloop.counter == 2 and data.questionpaperid %}
-<hr>
-<U><h2> Previous attempts </h2></U>
-{% endif %}
-<h2> Quiz: {{ paper.question_paper.quiz.description }} </h2>
-
-<p>
-Attempt Number: {{ paper.attempt_number }}<br/>
-Questions correctly answered: {{ paper.get_answered_str }} <br/>
-Total attempts at questions: {{ paper.answers.count }} <br/>
-Marks obtained: {{ paper.marks_obtained }} <br/>
-Start time: {{ paper.start_time }} <br/>
-User IP address: {{ paper.user_ip }} 
-</p>
-
-{% if paper.answers.count %}
-<h3> Answers </h3>
-{% for question, answers in paper.get_question_answers.items %}
-<div class="panel panel-info">
-        <div class="panel-heading">
-
-            <strong> Details: {{forloop.counter}}. {{ question.summary }}
-            <a href="" onClick="grade_data('show_question{{question.id}}{{paper.attempt_number}}'); return false;"> Show Question </a>
-            <span class="marks pull-right"> Mark(s): {{ question.points }} </span>
-            </strong>
-        </div>
-        <div class="panel-body" id="show_question{{question.id}}{{paper.attempt_number}}" style="display: none;">
-        
-            <h5><u>Question:</u></h5> <strong>{{ question.description|safe }}</strong>
-            {% if question.type == "mcq" or question.type == "mcc" %}
-                <h5> <u>Choices:</u></h5>
-                {% for testcase in question.get_test_cases %}
-                    {% if testcase.correct %}
-                        <br/>
-                        <strong>{{ forloop.counter }}. {{ testcase.options }}</strong>
-                        <span class="label label-success"> Correct </span>
-                        {% else %}
-                        <br/><strong>
-                        {{ forloop.counter }}. {{ testcase.options }}</strong>
-                        {% endif %}
-                    {% endfor %}
-
-            {% elif question.type == "integer" or question.type == "string" or question.type == "float" %}
-                <h5> <u>Correct Answer:</u></h5>
-                    {% for testcase in question.get_test_cases %}
-                    <strong>{{ testcase.correct }}</strong>
-                    {% endfor %}
-
-            {% elif question.type == "arrange" %}
-              <h5> <u>Correct Order:</u></h5>
-              <div class="list-group" >
-              {% for testcase in question.get_test_cases %}
-                    <li class="list-group-item"><strong>{{ testcase.options }}</strong></li>
-              {% endfor %}
-              </div>
-
-            {% else %}
-                <h5> <u>Test cases: </u></h5>
-                    {% for testcase in question.get_test_cases %}
-                        <br/><strong>{{ forloop.counter }}. {{ testcase.test_case }}</strong>
-                    {% endfor %}
-            {%endif%}
-        </div>
-    </div>
-    {% if question.type != "code" %}
-        {% if "Correct answer" in answers.0.error_list %}
-            <div class="panel panel-success">
-            <div class="panel-heading"><strong>Correct</strong></div>
-        {% else %}
-            <div class="panel panel-danger">
-            <div class="panel-heading"><strong> Incorrect</strong></div>
-        {% endif %}
-            <div class="panel-body">
-                <h5><u>Student answer:</u></h5>
-
-        {% if question.type == "mcc"%}
-        <div class="well well-sm">
-        {% for testcases in question.get_test_cases %}
-        {%if testcases.id|stringformat:"i" in answers.0.answer %}
-         <li>{{ testcases.options.strip }}</li>
-        {% endif %}
-        {% endfor %}
-        </div>
-
-        {% elif question.type == "mcq"%}
-        <div class="well well-sm">
-        {% for testcases in question.get_test_cases %}
-        {%if testcases.id|stringformat:"i" == answers.0.answer %}
-         <li>{{ testcases.options.strip }}</li>
-        {% endif %}
-        {% endfor %}
-        </div>
-
-        {% elif question.type == "arrange"%}
-        <div class="well well-sm">
-          {% get_answer_for_arrange_options answers.0.answer question as tc_list %}
-        {% for testcases in tc_list %}
-         <li>{{ testcases.options.strip }}</li>
-        {% endfor %}
-        </div>
-
-        {%else%}
-                 <div class="well well-sm">
-                 {{ answers.0.answer }}
-                 </div>
-        {% endif %}
+   <div class="card col-md-4">
+      <p class="card-body">
+         Name: {{ data.user.get_full_name.title }} <br/>
+         Username: {{ data.user.username }} <br/>
+         {% if data.profile %}
+         Roll number: {{ data.profile.roll_number }} <br/>
+         Position: {{ data.profile.position }} <br/>
+         Department: {{ data.profile.department }} <br/>
+         Institute: {{ data.profile.institute }} <br/>
+         {% endif %}
+         Email: {{ data.user.email }} <br/>
+         Date joined: {{ data.user.date_joined }} <br/>
+         Last login: {{ data.user.last_login }}
+      </p>
+   </div>
+   {% if data.papers %}
+   <p class="text-center"><a href="{{URL_ROOT}}/exam/manage/gradeuser/{{data.papers.0.question_paper.quiz.id}}/{{ data.user.id }}/{{course_id}}/"  class="btn btn-info ">
+      Grade/correct paper</a>
+   </p>
+   {% for paper in data.papers %}
+   {% if forloop.counter == 2 and data.questionpaperid %}
+   <hr>
+   <u>
+      <h2> Previous attempts </h2>
+   </u>
+   {% endif %}
+   <h2> Quiz: {{ paper.question_paper.quiz.description }} </h2>
+   <p>
+      Attempt Number: {{ paper.attempt_number }}<br/>
+      Questions correctly answered: {{ paper.get_answered_str }} <br/>
+      Total attempts at questions: {{ paper.answers.count }} <br/>
+      Marks obtained: {{ paper.marks_obtained }} <br/>
+      Start time: {{ paper.start_time }} <br/>
+      User IP address: {{ paper.user_ip }}
+   </p>
+   {% if paper.answers.count %}
+   <div class="table-wrapper-2">
+         <h3> Answers </h3>
+         <br>
+         {% for question, answers in paper.get_question_answers.items %}
+         <div class = "yakshlabel">
+            <div class="card">
+               <div class="card-heading alert-info" id="question_{{question.id}}">
+                  <strong> Details: {{forloop.counter}}. {{ question.summary }}
+                  <a href="" onClick="grade_data('show_question{{question.id}}{{paper.attempt_number}}'); return false;"> Show Question </a>
+                  <span class="marks pull-right"> Mark(s): {{ question.points }} </span>
+                  </strong>
+               </div>
+               <div class="card-body" id="show_question{{question.id}}{{paper.attempt_number}}" style="display: none;">
+                  <h5><u>Question:</u></h5>
+                  <strong>{{ question.description|safe }}</strong>
+                  {% if question.type == "mcq" or question.type == "mcc" %}
+                  <h5> <u>Choices:</u></h5>
+                  {% for testcase in question.get_test_cases %}
+                  {% if testcase.correct %}
+                  <br/>
+                  <strong>{{ forloop.counter }}. {{ testcase.options|safe }}</strong>
+                  <span class="badge badge-success">Correct </span>
+                  {% else %}
+                  <br/><strong>
+                  {{ forloop.counter }}. {{ testcase.options|safe }}</strong>
+                  {% endif %}
+                  {% endfor %}
+                  {% elif question.type == "integer" or question.type == "string" or question.type == "float" %}
+                  <h5> <u>Correct Answer:</u></h5>
+                  {% for testcase in question.get_test_cases %}
+                  <strong>{{ testcase.correct|safe }}</strong>
+                  {% if testcase.error_margin %}
+                  <strong>{{ testcase.error_margin|safe }}</strong>
+                  {% endif %}
+                  {% endfor %}
+                  {% elif question.type == "arrange" %}
+                  <h5> <u>Correct Order:</u></h5>
+                  <div class="list-group" >
+                     {% for testcase in question.get_test_cases %}
+                     <li class="list-group-item"><strong>{{ testcase.options|safe }}</strong></li>
+                     {% endfor %}
+                  </div>
+                  {% else %}
+                  <h5> <u>Test cases: </u></h5>
+                  {% for testcase in question.get_test_cases %}
+                  <br/><strong>{{ forloop.counter }}. {{ testcase }}</strong>
+                  {% endfor %}
+                  {%endif%}
+               </div>
             </div>
-        </div>
-    {% else %}
-    <h5>Student answer: </h5>
-    {% for answer in answers %}
- 
-    {% if answer.answer.correct %}
-            <div class="panel panel-success">
-            <div class="panel-heading">Correct answer
-        {% else %}
-            <div class="panel panel-danger">
-            <div class="panel-heading">Error<br/>
-        {% with answer.error_list as err %}
-            {% for error in err %}
-            {% if error.type == 'stdio' %}
-        <div class = "well well-sm">
-        {% if error.given_input %}
-       <table class="table table-bordered table-responsive-sm">
-        <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 table-responsive-sm" width="100%" id="output" style="table-layout: fixed">
-          <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 table-responsive-sm">
-          <col width="10">
-          <tr class = "danger">
-          <td><b>Error:</b></td>
-           <td>{{error.error_msg}}</td>
-           </tr>
-          </table>
-        </div>
-        {% elif error.type == 'assertion' %}
-            {% if error.test_case %}
-      <strong> We tried you code with the following test case:</strong><br/></br>
-              <pre><code><strong style="color:#d9534f">{{error.test_case}}</strong></code></pre>
+            <h5>Student answer: </h5>
+            {% if question.type == "upload" %}
+            {% if has_user_assignments %}
+            <a href="{{URL_ROOT}}/exam/manage/download/user_assignment/{{question.id}}/{{data.user.id}}/{{paper.question_paper.quiz.id}}/{{course_id}}">
+               <div class="btn btn-outline-info text-center">
+                  Assignment File for {{ data.user.get_full_name.title }}
+               </div>
+            </a>
+            {% with answers|last as answer%}
+            {% if answer.answer.correct %}
+               <div class="card ">
+                  <div class="card-heading alert-success">Correct answer</div>
+               </div>
+               {% else %}
+               <div class="card ">
+                  <div class="card-heading alert-danger">Incorrect Answer</div>
+               </div>
             {% endif %}
-          <p> <b>The following error took place: </b></p>
-          <div class="well well-sm">
-        <table class="table table-bordered table-responsive-sm" width="100%" style="table-layout: fixed">
-          <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>
+            {% endwith %}
+            {% else %}
+            <center>
+               <div class="alert alert-warning  animated flash">
+                  <h5>No Assignment submitted by {{ data.user.get_full_name.title }}</h5>
+               </div>
+            </center>
             {% endif %}
-          </tr>
-        </table>
-      </div> <!-- Closes well -->
-        {% else %}
-          <pre><code> {{error}} </code></pre>
-        {% endif %}
-        {% endfor %}
-        {% endwith %}
-        {% endif %}
-    
-    </div>
-    <div class="panel-body">
-    {% if question.type != "code" %}
-    <div class="well well-sg">
-    {{question.type}}
-    {{ answer.answer.answer.strip }}
-    </div>
-    {% else %}
-    <pre><code>{{ answer.answer.answer.strip }}</code></pre>
-    {% endif %}
-    </div>
-    </div>
+            {% else %}
+            {% for ans in answers %}
+            {% if ans.answer.correct %}
+            <div class="card ">
+               <div class="card-heading alert-success">
+                  Correct answer:
+                  {% else %}
+                  <div class="card ">
+                     <div class="card-heading-heading alert-danger">
+                        Error:
+                        {% endif %}
+                        {% with ans.error_list as err %}
+                        {% for error in err %}
+                        {% if error.type == 'stdio' %}
+                        <div class = "card">
+                           <div class="card-body">
+                              {% if error.given_input %}
+                              <table class="table table-bordered table-responsive-sm">
+                                 <col width="30%">
+                                 <tr class = "table-active">
+                                    <td> For given Input value(s):</td>
+                                    <td>{{error.given_input}}</td>
+                                 </tr>
+                              </table>
+                              {% endif %}
+                              <table class="table table-bordered table-responsive-sm" width="100%" id="output" style="table-layout: fixed">
+                                 <col width="10%">
+                                 <col width="40%">
+                                 <col width="40%">
+                                 <col width="10%">
+                                 <tr>
+                                    <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 %}
+                                 <tr>
+                                    <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 ="fa fa-times text-warning"></span></td>
+                                    {% else %}
+                                    <td><span class ="fa fa-check text-success"></span></td>
+                                    {% endif %}
+                                 </tr>
+                                 {% endfor %}
+                              </table>
+                              <table width="100%" class="table table-bordered table-responsive-sm">
+                                 <col width="10">
+                                 <tr>
+                                    <td><b>Error:</b></td>
+                                    <td>{{error.error_msg}}</td>
+                                 </tr>
+                              </table>
+                           </div>
+                        </div>
+                        {% elif error.type == 'assertion' %}
+                        {% if error.test_case %}
+                        <strong> We tried you 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>
+                        <div class="card">
+                           <div class="card-body">
+                              <table class="table table-bordered table-responsive-sm" width="100%"  style="table-layout: fixed">
+                                 <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>
+                           </div>
+                        </div>
+                        <!-- Closes card -->
+                        {% else %}
+                        <pre><code> {{error|safe}} </code></pre>
+                        {% endif %}
+                        {% endfor %}
+                        {% endwith %}
+                     </div>
+                     <div class="card-body">
+                        {% if question.type == "code" %}
+                        <pre><code>{{ ans.answer.answer.strip|safe }}</code></pre>
+                        {% elif question.type == "mcc"%}
+                        <div class="card">
+                           <div class="card-body">
+                              {% for testcases in question.get_test_cases %}
+                              {%if testcases.id|stringformat:"i" in ans.answer.answer.strip|safe %}
+                              <li>{{ testcases.options.strip|safe }}</li>
+                              {% endif %}
+                              {% endfor %}
+                           </div>
+                        </div>
+                        {% elif question.type == "mcq"%}
+                        <div class="card">
+                           <div class="card-body">
+                              {% for testcases in question.get_test_cases %}
+                              {%if testcases.id|stringformat:"i" == ans.answer.answer.strip|safe %}
+                              <li>{{ testcases.options.strip|safe }}</li>
+                              {% endif %}
+                              {% endfor %}
+                           </div>
+                        </div>
+                        {% elif question.type == "arrange"%}
+                        <div class="card">
+                           <div class="card-body">
+                              {% get_answer_for_arrange_options ans.answer.answer question as tc_list %}
+                              {% for testcases in tc_list %}
+                              <li>{{ testcases.options.strip|safe }}</li>
+                              {% endfor %}
+                           </div>
+                        </div>
+                        {% else %}
+                        <div class="card">
+                           <div class="card-body">
+                              {{ ans.answer.answer.strip|safe }}
+                           </div>
+                        </div>
+                        {% endif %}
+                     </div>
+                  </div>
+                  {% endfor %}
+                  {% endif %}
+                  {% with answers|last as answer %}
+                  Marks: <input id="q{{ question.id }}" type="text" 
+                     name="q{{ question.id }}_marks" size="4"
+                     value="{{ answer.answer.marks }}"><br><br>
+                  {% endwith %}
+                  <hr/>
+         </div>
+
+               {% endfor %} {# for question, answers ... #}
+   </div>
 
-    {% endfor %}
-    {% endif %}
-    <hr>
-    {% endfor %} {# for question, answers ... #}
 
 <h3>Teacher comments: </h3>
 {{ paper.comments|default:"None" }}
 {% endif %} {# if paper.answers.count #}
-
 {% endfor %} {# for paper in data.papers #}
-
 {% endif %} {# if data.papers #}
+</div>
+
 <br />
 <hr />
-
 {% with data.papers.0 as paper %}
 <a href="{{URL_ROOT}}/exam/manage/gradeuser/{{paper.question_paper.quiz.id}}/{{ data.user.id }}/{{course_id}}/">Grade/correct paper</a>
 {% endwith %}
 <br />
-
 {% if data.papers.count > 1 %}
 <a href="{{URL_ROOT}}/exam/manage/monitor/">Monitor quiz</a>
 {% else %}
@@ -266,6 +296,4 @@ User IP address: {{ paper.user_ip }}
 <a href="{{URL_ROOT}}/exam/manage/monitor/{{paper.question_paper.id}}/">Monitor quiz</a>
 {% endwith %}
 {% endif %}
-</div>
-
-{% endblock %}
+{% endblock %}
\ No newline at end of file