beautified grade user and monitor

4 files changed, 137 insertions, 119 deletions

diff --git a/yaksh/static/yaksh/css/gradeuser.css b/yaksh/static/yaksh/css/gradeuser.css
deleted file mode 100644
index af5de3f..0000000
--- a/yaksh/static/yaksh/css/gradeuser.css
+++ /dev/null
@@ -1,58 +0,0 @@
-textarea
-{
-width : 550px;
-height : 200px;
-
-}
-
-.for-question{
-    background: none repeat scroll 0 0 #F1F1F1;
-    border-radius: 6px 6px 6px 6px;
-    margin-bottom: 10px;
-    padding: 5px;
-}
-
-#headerDiv, #contentDiv {
-float: left;
-}
-#titleText {
-float: left;
-font-size: 1.1em;
-font-weight: bold;
-margin: 5px;
-}
-#myHeader {
-font-size: 1.1em;
-font-weight: bold;
-margin: 5px;
-}
-#headerDiv {
-background-color: #0037DB;
-color: #9EB6FF;
-}
-
-#contentDiv {
-    background-color:#F0F8FF;
-    border: 1px solid #C9C9C9;
-    border-radius: 5px 5px 5px 5px;
-    margin-bottom: 10px;
-    min-width: 685px;
-    
-}
-
-#myContent {
-margin: 5px 10px;
-
-}
-#headerDiv a {
-float: right;
-margin: 10px 10px 5px 5px;
-}
-#headerDiv a:hover {
-color: #FFFFFF;
-}
-
-#attempt {
-    width: 157px;
-    position: relative; left:20%;
-}
diff --git a/yaksh/static/yaksh/css/view_answerpaper.css b/yaksh/static/yaksh/css/view_answerpaper.css
index 50eab55..fdcb1c6 100644
--- a/yaksh/static/yaksh/css/view_answerpaper.css
+++ b/yaksh/static/yaksh/css/view_answerpaper.css
@@ -58,4 +58,19 @@ code{
 }
 pre{
   background-color: transparent;
+}
+
+/*for grade user*/
+textarea
+{
+width : 100%;
+height : 15%;
+}
+#attempt {
+    width: 157px;
+    position: relative; left:20%;
+}
+#myContent {
+margin: 5px 10px;
+
 }
\ No newline at end of file
diff --git a/yaksh/templates/yaksh/grade_user.html b/yaksh/templates/yaksh/grade_user.html
index 2c5403c..7b79373 100644
--- a/yaksh/templates/yaksh/grade_user.html
+++ b/yaksh/templates/yaksh/grade_user.html
@@ -5,11 +5,7 @@
 {% block subtitle %} Grade User {% endblock %}
  
 {% block css %}
-     <link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/gradeuser.css" type="text/css" /> 
-{% endblock %}
-
-{% block script %}
-    <script src= "{{ URL_ROOT }}/static/yaksh/js/edit_question.js"></script>
+     <link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/view_answerpaper.css" type="text/css" /> 
 {% endblock %}
 
 {% block manage %}
@@ -88,6 +84,7 @@ Attempt Number: <b>{{paper.attempt_number}} </b>
 Total attempts at questions: {{ paper.answers.count }} <br/>
 Marks obtained: {{ paper.marks_obtained }} <br/>
 Start time: {{ paper.start_time }} <br/>
+End time: {{ paper.end_time }} <br/>
 {%if paper.percent%}
 Percentage obtained: {{paper.percent}}% <br/>
 {% endif %}
@@ -125,42 +122,63 @@ Status : <b style="color: green;"> Passed </b><br/>
     method="post">
 {% csrf_token %}
 {% for question, answers in paper.get_question_answers.items %}
-
-<div class="for-question">
-<p><strong> 
-    Question: {{ question.id }}. {{ question.summary }} (Points: {{ question.points }})
-</strong>
-<strong><a href="" onClick="grade_data('myContent{{question.id}}'); return false;" style="cursor:pointer;" />Details</strong></p></a>
-<div id="contentDiv">
-     <div id="myContent{{question.id}}" style="padding:5px; display:none;">
-        <p> Description : {{ question.description }} </p>
-        <p> Test : {{ question.test }} </p>
-     </div>
-</div> 
-<div class="question-form">
-
-{% if question.type == "mcq" %}
-<br>
-<p> Choices: 
-{% for option in question.options.strip.splitlines %} {{option}}, {% endfor %}
-</p>
-<p>Student answer: {{ answers.0 }}</p>
-{% else %}{# non-mcq questions #}
-<pre>
-{% for answer in answers %}################################################################################
-{{ answer.answer.strip }}
-# Autocheck: {{ answer.error }}
-{% endfor %}</pre>
-{% endif %} {# if question.type #}
-{% with answers|last as answer %}
-Marks: <input id="q{{ question.id }}" type="text" 
+<div class="panel panel-info">
+        <div class="panel-heading">
+            <strong> Details: {{forloop.counter}}. {{ question.summary }} 
+            <span class="marks"> Mark(s): {{ question.points }} </span>
+            </strong>
+        </div>
+        <div class="panel-body">
+            <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 %}
+                    <br/><strong>{{ forloop.counter }}. {{ testcase.options }}</strong>
+                    {% endfor %}
+            {% 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 == "mcq" or question.type == "mcc" %}
+        {% if "Correct answer" in answers.0.error %}
+            <div class="panel panel-success">
+        {% else %}
+            <div class="panel panel-danger">
+        {% endif %}
+            <div class="panel-heading">
+                Autocheck: {{ answers.0.error }}
+            </div>
+            <div class="panel-body">
+                <h5><u>Student answer:</u></h5>
+                 <pre><code>{{forloop.counter}}. {{ answers.0 }}</code></pre>
+            </div>
+            </div>
+    {% else %}
+    <h5>Student answer: </h5>
+    {% for answer in answers %}
+    {% if not answer.skipped %}
+    {% if "Correct answer" in answer.error %}
+            <div class="panel panel-success">
+        {% else %}
+            <div class="panel panel-danger">
+        {% endif %}
+    <div class="panel-heading">Autocheck: {{ answer.error }}</div>
+    <div class="panel-body"><pre><code>{{ answer.answer.strip }}</code></pre></div>
+    </div>
+    {% endif %}
+    {% endfor %}
+    {% endif %}
+    {% with answers|last as answer %}
+    Marks: <input id="q{{ question.id }}" type="text" 
         name="q{{ question.id }}_marks" size="4"
         value="{{ answer.marks }}"><br><br>
-{% endwith %}
-</div>
-</div>
-{% endfor %} {# for question, answers ... #}
-
+    {% endwith %}
+    <hr>
+    {% endfor %} {# for question, answers ... #}
 
 <h3>Teacher comments: </h3>
 <textarea id="comments_{{paper.question_paper.id}}" rows="10" cols="80" 
diff --git a/yaksh/templates/yaksh/user_data.html b/yaksh/templates/yaksh/user_data.html
index 1060e2d..4d12e99 100644
--- a/yaksh/templates/yaksh/user_data.html
+++ b/yaksh/templates/yaksh/user_data.html
@@ -5,6 +5,15 @@
 {% block manage %}
 
 {% block subtitle %}Data for user {{ data.user.get_full_name.title }}{% endblock %}
+
+{% block css %}
+     <link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/view_answerpaper.css" type="text/css" /> 
+{% endblock %}
+
+{% block script %}
+    <script src= "{{ URL_ROOT }}/static/yaksh/js/edit_question.js"></script>
+{% endblock %}
+
 <form action="" method="post">
 <p> 
 Name: {{ data.user.get_full_name.title }} <br/>
@@ -49,28 +58,62 @@ User IP address: {{ paper.user_ip }}
 {% if paper.answers.count %}
 <h3> Answers </h3>
 {% for question, answers in paper.get_question_answers.items %}
-<p><strong> Question: {{ question.id }}. {{ question.summary }} (Points: {{ question.points }})</strong> </p>
-{% if question.type == "mcq" or question.type == "mcc" %}
-<p> Choices:
-{% for testcase in question.get_test_cases %} <br>{{ testcase.options }} {% endfor %}
-</p>
-<p>Student answer: {{ answers.0 }}</p>
-Autocheck: {{ answers.0.error }}
-{% else %}{# non-mcq questions #}
-{% for answer in answers %}
-{% if not answer.skipped %}
-<pre>
-###############################################################################
-{{ answer.answer.strip }}
-# Autocheck: {{ answer.error }}
-</pre>
-{% endif %}
-{% endfor %}
-{% endif %}
-{% with answers|last as answer %}
-<p><em>Marks: {{answer.marks}} </em> </p>
-{% endwith %}
-{% endfor %} {# for question, answers ... #}
+<div class="panel panel-info">
+        <div class="panel-heading">
+
+            <strong> Details: {{forloop.counter}}. {{ question.summary }}
+            <a href="" onClick="grade_data('show_question{{question.id}}'); return false;"> Show Question </a>
+            <span class="marks"> Mark(s): {{ question.points }} </span>
+            </strong>
+        </div>
+        <div class="panel-body" id="show_question{{question.id}}" 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 %}
+                    <br/><strong>{{ forloop.counter }}. {{ testcase.options }}</strong>
+                    {% endfor %}
+            {% 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 == "mcq" or question.type == "mcc" %}
+        {% if "Correct answer" in answers.0.error %}
+            <div class="panel panel-success">
+        {% else %}
+            <div class="panel panel-danger">
+        {% endif %}
+            <div class="panel-heading">
+                Autocheck: {{ answers.0.error }}
+            </div>
+            <div class="panel-body">
+                <h5><u>Student answer:</u></h5>
+                 <pre><code>{{forloop.counter}}. {{ answers.0 }}</code></pre>
+            </div>
+            </div>
+    {% else %}
+    <h5>Student answer: </h5>
+    {% for answer in answers %}
+    {% if not answer.skipped %}
+    {% if "Correct answer" in answer.error %}
+            <div class="panel panel-success">
+        {% else %}
+            <div class="panel panel-danger">
+        {% endif %}
+    <div class="panel-heading">Autocheck: {{ answer.error }}</div>
+    <div class="panel-body"><pre><code>{{ answer.answer.strip }}</code></pre></div>
+    </div>
+    {% endif %}
+    {% endfor %}
+    {% endif %}
+    <hr>
+    {% endfor %} {# for question, answers ... #}
+
 <h3>Teacher comments: </h3>
 {{ paper.comments|default:"None" }}
 {% endif %} {# if paper.answers.count #}