Interface to create question paper

1 files changed, 184 insertions, 0 deletions

diff --git a/testapp/templates/exam/design_questionpaper.html b/testapp/templates/exam/design_questionpaper.html
new file mode 100644
index 0000000..8994148
--- /dev/null
+++ b/testapp/templates/exam/design_questionpaper.html
@@ -0,0 +1,184 @@
+{% extends "manage.html" %}
+
+{% block subtitle %}Design Question Paper{% endblock %}
+
+{% block css %}
+<link rel="stylesheet" href="{{ URL_ROOT }}/static/exam/css/base.css" type="text/css" /> 
+<link rel="stylesheet" href="{{ URL_ROOT }}/static/exam/css/question_quiz.css" type="text/css" /> 
+<link rel="stylesheet" media="all" type="text/css" href="{{ URL_ROOT }}/static/exam/css/autotaggit.css" />
+<link rel="stylesheet" media="all" type="text/css" href="{{ URL_ROOT }}/static/exam/css/question_paper_creation.css" />
+<style>
+select
+{
+    width:auto;
+}
+</style>
+{% endblock %}
+{% block script %}
+<script src="/static/taggit_autocomplete_modified/jquery.min.js" type="text/javascript"></script>
+<script src="/static/taggit_autocomplete_modified/jquery.autocomplete.js" type="text/javascript"></script>
+
+
+<script src="{{ URL_ROOT }}/static/exam/js/bootstrap-tabs.js"></script>
+<script src="{{ URL_ROOT }}/static/exam/js/add_questionpaper.js"></script>
+<script src="{{ URL_ROOT }}/static/exam/js/question_paper_creation.js"></script>
+<script src="{{ URL_ROOT }}/static/exam/js/bootstrap-modal.js"></script>
+{% endblock %}
+
+{% block manage %}
+<input type=hidden id="url_root" value={{ URL_ROOT }}>
+<center><b>Manual mode to design the {{lang}}  Question Paper</center><br>
+    <ul class="tabs" data-tabs="tabs">
+    <li class="active" id="fixed-tab">
+        <a href="#fixed-questions" id="fixed">
+            STEP 1<br>
+            Add Fixed Questions
+        </a>
+    </li>
+    <li id="random-tab">
+        <a href="#random-questions" id="random">
+            STEP 2<br>
+            Add Random Questions
+        </a>
+    </li>
+    <li id="finish-tab">
+    <a href="#finish" id="finished">
+        STEP 3<br>
+        Finish
+    </a></li>
+</ul>
+
+<form action="{{URL_ROOT}}/exam/manage/designquestionpaper/" method="post" name=frm > {% csrf_token %}
+    <div>
+        <h3>Total Marks:  <span id="total_marks" class="well">0</span></h3>
+    </div>
+<div class="tab-content">
+    <!-- common to fixed and random questions -->
+    <div class="row" id="selectors">
+        <h5 style="padding-left: 20px;">Please select Question type and Marks</h5>
+        <div class="span4">
+            {{ form.question_type }}
+        </div> <!-- /.span4 -->
+        <div class="span4">
+            {{ form.marks }}
+        </div> <!-- /.span4 -->
+         <div class="span4">
+            <div class="pull-left" id="number-wrapper"></div>
+        </div> <!-- /.span4 -->
+    </div> <!-- /.row -->
+    <br><br>
+
+
+    <div class="tab-pane active" id="fixed-questions">
+        <div class="row">
+            <div class="span7">
+                <div id="fixed-available-wrapper">
+                    <p><u>Select questions to add:</u></p>
+                    <div id="fixed-available">
+                    </div>
+                    <a id="add-fixed" class="btn small primary pull-right" href="#">Add to paper</a>
+                </div>
+            </div>
+            <div class="span7">
+                <div id="fixed-added-wrapper">
+                    <p><u>Fixed questions currently in paper:</u></p>
+                    <div id="fixed-added">
+                    </div>
+                </div>
+            </div>
+        </div> <!-- /.row -->
+        <br>
+        <div class="pull-right">
+            <a class="btn" id="fixed-next">Next &gt;</a>
+        </div>
+
+    </div> <!-- /#fixed-questions -->
+
+
+    <div class="tab-pane" id="random-questions">
+        <div class="row">
+            <div class="span7">
+                <div id="random-available-wrapper">
+                    <p><u>Select questions to add to the pool:</u></p>
+                    <div id="random-available">
+                    </div>
+                    <a id="add-random" class="btn small primary pull-right" href="#">Add to paper</a>
+                </div>
+            </div>
+            <div class="span7">
+                <div id="random-added-wrapper">
+                    <p><u>Pool of  questions currently in paper:</u></p>
+                    <div id="random-added">
+                    </div>
+                </div>
+            </div>
+        </div> <!-- /.row -->
+        <br>
+        <div class="pull-left">
+            <a class="btn" id="random-prev">&lt; Previous</a>
+        </div>
+        <div class="pull-right">
+            <a class="btn" id="random-next">Next &gt;</a>
+        </div>
+   </div> <!-- /#random-questions -->
+
+    <div class="tab-pane" id="finish">
+        <center>
+            <h5>Almost finished creating your question paper</h5>
+            <label style="float: none;">
+                {{ form.shuffle_questions }}
+                <span>Auto shuffle.</span>
+            </label> <br><br>
+            <input class ="btn primary large" type="button" id="preview" value="Preview question paper">
+            <input class ="btn primary large" type="button" id="save" value="Save question paper">
+            <br>
+            <div class="pull-left">
+                <a class="btn" id="finish-prev">&lt; Previous</a>
+            </div>
+       </center>
+    </div> <!-- /#finish -->
+</div>
+<!-- /.tab-content -->
+</form>
+<br>
+<div class="clearfix"></div>
+
+<!-- Modal -->
+<div class="modal fade " id="myModal" >
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h4 class="modal-title" id="myModalLabel">Question Paper Preview</h4>
+      </div>
+      <div id = "modal_body"class="modal-body">
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn primary close" data-dismiss="modal">OK</button>
+      </div>
+    </div>
+  </div>
+</div>
+
+<div class="modal fade " id="modalSave" >
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h4 class="modal-title" id="myModalLabel">Cannot Save</h4>
+      </div>
+      <div id = "modal_body"class="modal-body">
+          Please select questions for your paper
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn primary close" data-dismiss="modal">OK</button>
+      </div>
+    </div>
+  </div>
+</div>
+</div>
+
+<script>
+    $(function () {
+        $('.tabs').tabs()
+    })
+</script>
+{% endblock %}