Skip to content

P
Pariksha
Commit ab8a72c2 authored by Roshan Rabinarayan's avatar Roshan Rabinarayan
Browse files
Options

change in upload view

parents 52f04e63 f01dab74
Hide whitespace changes
Inline Side-by-side
Showing with 233 additions and 171 deletions
quiz/migrations/0004_auto_20201024_1020.py 0 → 100644
View file @ ab8a72c2
# Generated by Django 3.1.2 on 2020-10-24 10:20
from django.db import migrations, models
class Migration(migrations.Migration):
dependencies = [
('quiz', '0003_auto_20201024_0927'),
]
operations = [
migrations.AlterField(
model_name='quiz',
name='startTime',
field=models.DateTimeField(),
),
]
quiz/models.py
View file @ ab8a72c2
...@@ -4,7 +4,11 @@ from django.db import models ...@@ -4,7 +4,11 @@ from django.db import models
from django.db import models from django.db import models
class quiz(models.Model): class quiz(models.Model):
quizId=models.AutoField(default=0, primary_key=True) #primary key quizId=models.AutoField(default=0, primary_key=True) #primary key
<<<<<<< HEAD
#startTime=models.DateTimeField(auto_now_add=True,default=datetime.datetime.now) #startTime=models.DateTimeField(auto_now_add=True,default=datetime.datetime.now)
=======
startTime=models.DateTimeField()
>>>>>>> f01dab74b5bad6e54fc228f10ec2a1c44428b8da
length=models.FloatField(max_length=10) length=models.FloatField(max_length=10)
quizCode=models.CharField(max_length=100,default='Code') ##quiz Code set by instructor quizCode=models.CharField(max_length=100,default='Code') ##quiz Code set by instructor
quizDone=models.BooleanField(default=False) quizDone=models.BooleanField(default=False)
......
quiz/static/css/quiz_attempt_page.css
View file @ ab8a72c2
* { * {
font-family: 'Source Sans Pro', sans-serif; font-family: 'Source Sans Pro', sans-serif;
} }
body { body {
margin: 0px; margin: 0px;
background: #F1F3F4; background: #F1F3F4;
} }
form { form {
display: grid; display: grid;
grid-template-columns: 1fr 300px; grid-template-columns: 1fr 300px;
} }
/* ---- Custom Radio Button Styles START ---- */ /* ---- Custom Radio Button Styles START ---- */
.op_box > input[type=radio] {
width: 0px; .op_box > input[type=radio] {
height: 0px; width: 0px;
overflow: hidden; height: 0px;
z-index: -100; overflow: hidden;
} z-index: -100;
.op_box { }
width: 100%; .op_box {
display: block; width: 100%;
margin-bottom: 15px; display: block;
} margin-bottom: 15px;
.op_box > span { }
padding : 10px; .op_box > span {
margin: 0px; padding : 10px;
display: flex; margin: 0px;
border-radius: 2em; display: flex;
background-color: white; border-radius: 2em;
border: solid 1px #cdcfcf; background-color: white;
box-shadow: 3px 3px 5px #cdcfcf; border: solid 1px #cdcfcf;
} box-shadow: 3px 3px 5px #cdcfcf;
.op_box > span > strong { transition: border 0.3s ease-in-out;
width: 40px; }
min-width: 40px; .op_box > span:hover {
height: 40px; border: solid 2px #black;
border: solid 1px black; }
display: inline-block; .op_box > span > strong {
line-height: 40px; width: 40px;
text-align: center; min-width: 40px;
margin-right: 20px; height: 40px;
border-radius: 100%; border: solid 1px black;
flex-shrink: 0; display: inline-block;
} line-height: 40px;
.op_box > span > span { text-align: center;
margin: 10px; margin-right: 20px;
font-size: 1.1em; border-radius: 100%;
} flex-shrink: 0;
/* ---- Custom Radio Button Styles END ---- */ }
.op_box > span > span {
#question_palette { margin: 10px;
width: 300px; font-size: 1.1em;
grid-column-start: 2; }
grid-row-start: 1;
display: grid; /* ----- Quiz Question Start ----- */
grid-template-rows: 60px 1fr 140px;
background-color: white; .question_header {
} display: flex;
justify-content: space-between;
#questions_area { }
height: 100vh;
overflow-y:scroll; /* ----- Quiz Pallete Start ----- */
grid-column-start: 1;
grid-row-start: 1; #question_palette {
} width: 300px;
#questions_area_wrapper { grid-column-start: 2;
margin: 30px; grid-row-start: 1;
} display: grid;
.question { grid-template-rows: 60px 1fr 140px;
display: none; background-color: white;
} }
.questions_list { #questions_area {
list-style-type: none; height: 100vh;
padding-left: 0px; overflow-y:scroll;
grid-column-start: 1; grid-column-start: 1;
grid-row-start: 2; grid-row-start: 1;
} }
.questions_list > li { #questions_area_wrapper {
padding: 15px; margin: auto;
border-bottom: solid 1px #fccde2; max-width: 800px;
transition: backround-color 0.2s ease-in-out; }
} .question {
.questions_list > li:hover { display: none;
padding: 15px; padding: 30px;
background-color: #fee7f1; }
border-bottom: solid 1px #fccde2; .actual_question {
} margin: 40px;
}
#toolbar { .questions_list {
grid-column-start: 1; list-style-type: none;
grid-row-start: 3; padding-left: 0px;
padding: 20px grid-column-start: 1;
} grid-row-start: 2;
.button_group { }
display: flex; .questions_list > li {
height: 40px; padding: 15px;
flex-direction: row; border-bottom: solid 1px #fccde2;
width: 100%; transition: backround-color 0.2s ease-in-out;
overflow: hidden; }
margin-bottom: 15px; .questions_list > li:hover {
border-radius: 2em; padding: 15px;
transition: box-shadow 0.2s ease-in-out; background-color: #fee7f1;
box-shadow: 1px 1px 5px #a4a8a8; border-bottom: solid 1px #fccde2;
} }
.button_group:hover {
box-shadow: 2px 2px 5px #cdcfcf; /* ----- QUIZ CONTROLS Start ----- */
}
.quiz_btn { #toolbar {
border: none; grid-column-start: 1;
flex-grow: 1; grid-row-start: 3;
height: 100%; padding: 20px
color: white; }
.button_group {
} display: flex;
.prev_ques { height: 40px;
width: 40px; flex-direction: row;
background-color: #2f89fc; width: 100%;
transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; overflow: hidden;
} margin-bottom: 15px;
.prev_ques:hover { border-radius: 2em;
background-color: #0359c9; transition: box-shadow 0.2s ease-in-out;
} box-shadow: 1px 1px 5px #a4a8a8;
.prev_ques:active { }
background-color: #81b7fd; .button_group:hover {
color:black; box-shadow: 2px 2px 5px #cdcfcf;
} }
.prev_ques:focus { .quiz_btn {
outline: none; border: none;
} flex-grow: 1;
.next_ques { height: 100%;
background-color: #2f89fc; color: white;
transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; }
} .prev_ques {
.next_ques:hover { width: 40px;
background-color: #0359c9; background-color: #2f89fc;
} transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
.next_ques:active { }
background-color: #81b7fd; .prev_ques:hover {
color:black; background-color: #0359c9;
} }
.next_ques:focus { .prev_ques:active {
outline: none; background-color: #81b7fd;
} color:black;
.submit { }
background-color: #e0c45c; .prev_ques:focus {
transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; outline: none;
} }
.submit:hover { .next_ques {
background-color: #c19f25; background-color: #2f89fc;
} transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
.submit:active { }
background-color: #efe0a9; .next_ques:hover {
color:black; background-color: #0359c9;
} }
.submit:focus { .next_ques:active {
outline: none; background-color: #81b7fd;
} color:black;
.separator { }
border-left: solid 1px white; .next_ques:focus {
} outline: none;
\ No newline at end of file }
.submit {
background-color: #e0c45c;
transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
}
.submit:hover {
background-color: #c19f25;
}
.submit:active {
background-color: #efe0a9;
color:black;
}
.submit:focus {
outline: none;
}
.separator {
border-left: solid 1px white;
}
/* ----- End ----- */
\ No newline at end of file
quiz/static/js/quiz_attempt_page.js
View file @ ab8a72c2
...@@ -4,6 +4,8 @@ var current_question = 0; ...@@ -4,6 +4,8 @@ var current_question = 0;
var questions = document.getElementById('questions_area_wrapper').children; var questions = document.getElementById('questions_area_wrapper').children;
questions[current_question].style.display = 'block'; questions[current_question].style.display = 'block';
var questions_len = parseInt(document.getElementById('question_count').value); var questions_len = parseInt(document.getElementById('question_count').value);
var selected_color = '#f4fa9c';
var deselected_color = '#ffffff';
function next_question () { function next_question () {
...@@ -34,14 +36,27 @@ function goto_question(x) { ...@@ -34,14 +36,27 @@ function goto_question(x) {
} }
} }
function set_option( question_id, option_id ,value) { function set_option( question_id, option_id ) {
if(typeof question_id == "number" && typeof option_id == "number") { if(typeof question_id == "number" && typeof option_id == "number") {
if(question_id>=0 && question_id<questions_len && option_id>=0 && option_id<4) { if(question_id>=0 && question_id<questions_len && option_id>=0 && option_id<4) {
var ans = document.getElementById('q'+question_id); var ans = document.getElementById('q'+question_id);
ans.value = value; if (ans.value == "NA") {
var cbox = document.getElementById("lbl_"+question_id+"_"+option_id); ans.value = option_id;
console.log("lbl_"+question_id+"_"+option_id); var cbox = document.getElementById("lbl_"+question_id+"_"+option_id);
cbox.style.backgroundColor = '#f4fa9c'; cbox.style.backgroundColor = selected_color;
} else {
if(option_id == ans.value) {
var obox = document.getElementById("lbl_"+question_id+"_"+ans.value);
obox.style.backgroundColor = deselected_color;
ans.value = "NA";
} else {
var obox = document.getElementById("lbl_"+question_id+"_"+ans.value);
obox.style.backgroundColor = deselected_color;
ans.value = option_id;
var cbox = document.getElementById("lbl_"+question_id+"_"+option_id);
cbox.style.backgroundColor = selected_color;
}
}
} }
} }
} }
\ No newline at end of file
quiz/templates/index.html
View file @ ab8a72c2
...@@ -32,14 +32,19 @@ ...@@ -32,14 +32,19 @@
<div id="questions_area_wrapper"> <div id="questions_area_wrapper">
{% for i in questions%} {% for i in questions%}
<div class="question"> <div class="question">
<div class="question_header">
<p><!--placeholder element left--></p>
<p>Question {{ forloop.counter }} of {{ count }}</p>
<p><!--placeholder element right--></p>
</div>
<!-- <h1 id ='quizId'>{{i.quizId}}<h1> --> <!-- <h1 id ='quizId'>{{i.quizId}}<h1> -->
<h1 id ='questionId' hidden>{{i.questionId}} </h1> <h1 id ='questionId' hidden>{{i.questionId}} </h1>
<h1>{{i.question}}</h1> <h2 class="actual_question">{{i.question}}</h2>
<input type="hidden" id="qq{{forloop.counter0}}" name="qq{{forloop.counter0}}" value="{{i.questionId}}"> <input type="hidden" id="qq{{forloop.counter0}}" name="qq{{forloop.counter0}}" value="{{i.questionId}}">
<label class="op_box" onclick="set_option({{forloop.counter0}},0, ' {{i.option1}}')"><span id="lbl_{{forloop.counter0}}_0"><strong>A</strong><span>{{i.option1}}</span></span></label> <label class="op_box" onclick="set_option({{forloop.counter0}},0)"><span id="lbl_{{forloop.counter0}}_0"><strong>A</strong><span>{{i.option1}}</span></span></label>
<label class="op_box" onclick="set_option({{forloop.counter0}},1, '{{i.option2}}')"><span id="lbl_{{forloop.counter0}}_1"><strong>B</strong><span>{{i.option2}}</span></span></label> <label class="op_box" onclick="set_option({{forloop.counter0}},1)"><span id="lbl_{{forloop.counter0}}_1"><strong>B</strong><span>{{i.option2}}</span></span></label>
<label class="op_box" onclick="set_option({{forloop.counter0}},2, '{{i.option3}}')"><span id="lbl_{{forloop.counter0}}_2"><strong>C</strong><span>{{i.option3}}</span></span></label> <label class="op_box" onclick="set_option({{forloop.counter0}},2)"><span id="lbl_{{forloop.counter0}}_2"><strong>C</strong><span>{{i.option3}}</span></span></label>
<label class="op_box" onclick="set_option({{forloop.counter0}}, 3,'{{i.option4}}')"><span id="lbl_{{forloop.counter0}}_3"><strong>D</strong><span>{{i.option4}}</span></span></label> <label class="op_box" onclick="set_option({{forloop.counter0}},3)"><span id="lbl_{{forloop.counter0}}_3"><strong>D</strong><span>{{i.option4}}</span></span></label>
<input type="hidden" id="q{{forloop.counter0}}" name="{{i.questionId}}" value="NA"> <input type="hidden" id="q{{forloop.counter0}}" name="{{i.questionId}}" value="NA">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment