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
from django.db import models
class quiz(models.Model):
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()
>>>>>>> f01dab74b5bad6e54fc228f10ec2a1c44428b8da
length=models.FloatField(max_length=10)
quizCode=models.CharField(max_length=100,default='Code') ##quiz Code set by instructor
quizDone=models.BooleanField(default=False)
......
quiz/static/css/quiz_attempt_page.css
View file @ ab8a72c2
* {
font-family: 'Source Sans Pro', sans-serif;
}
body {
margin: 0px;
background: #F1F3F4;
}
form {
display: grid;
grid-template-columns: 1fr 300px;
}
/* ---- Custom Radio Button Styles START ---- */
.op_box > input[type=radio] {
width: 0px;
height: 0px;
overflow: hidden;
z-index: -100;
}
.op_box {
width: 100%;
display: block;
margin-bottom: 15px;
}
.op_box > span {
padding : 10px;
margin: 0px;
display: flex;
border-radius: 2em;
background-color: white;
border: solid 1px #cdcfcf;
box-shadow: 3px 3px 5px #cdcfcf;
}
.op_box > span > strong {
width: 40px;
min-width: 40px;
height: 40px;
border: solid 1px black;
display: inline-block;
line-height: 40px;
text-align: center;
margin-right: 20px;
border-radius: 100%;
flex-shrink: 0;
}
.op_box > span > span {
margin: 10px;
font-size: 1.1em;
}
/* ---- Custom Radio Button Styles END ---- */
#question_palette {
width: 300px;
grid-column-start: 2;
grid-row-start: 1;
display: grid;
grid-template-rows: 60px 1fr 140px;
background-color: white;
}
#questions_area {
height: 100vh;
overflow-y:scroll;
grid-column-start: 1;
grid-row-start: 1;
}
#questions_area_wrapper {
margin: 30px;
}
.question {
display: none;
}
.questions_list {
list-style-type: none;
padding-left: 0px;
grid-column-start: 1;
grid-row-start: 2;
}
.questions_list > li {
padding: 15px;
border-bottom: solid 1px #fccde2;
transition: backround-color 0.2s ease-in-out;
}
.questions_list > li:hover {
padding: 15px;
background-color: #fee7f1;
border-bottom: solid 1px #fccde2;
}
#toolbar {
grid-column-start: 1;
grid-row-start: 3;
padding: 20px
}
.button_group {
display: flex;
height: 40px;
flex-direction: row;
width: 100%;
overflow: hidden;
margin-bottom: 15px;
border-radius: 2em;
transition: box-shadow 0.2s ease-in-out;
box-shadow: 1px 1px 5px #a4a8a8;
}
.button_group:hover {
box-shadow: 2px 2px 5px #cdcfcf;
}
.quiz_btn {
border: none;
flex-grow: 1;
height: 100%;
color: white;
}
.prev_ques {
width: 40px;
background-color: #2f89fc;
transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
}
.prev_ques:hover {
background-color: #0359c9;
}
.prev_ques:active {
background-color: #81b7fd;
color:black;
}
.prev_ques:focus {
outline: none;
}
.next_ques {
background-color: #2f89fc;
transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
}
.next_ques:hover {
background-color: #0359c9;
}
.next_ques:active {
background-color: #81b7fd;
color:black;
}
.next_ques:focus {
outline: none;
}
.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;
}
\ No newline at end of file
font-family: 'Source Sans Pro', sans-serif;
}
body {
margin: 0px;
background: #F1F3F4;
}
form {
display: grid;
grid-template-columns: 1fr 300px;
}
/* ---- Custom Radio Button Styles START ---- */
.op_box > input[type=radio] {
width: 0px;
height: 0px;
overflow: hidden;
z-index: -100;
}
.op_box {
width: 100%;
display: block;
margin-bottom: 15px;
}
.op_box > span {
padding : 10px;
margin: 0px;
display: flex;
border-radius: 2em;
background-color: white;
border: solid 1px #cdcfcf;
box-shadow: 3px 3px 5px #cdcfcf;
transition: border 0.3s ease-in-out;
}
.op_box > span:hover {
border: solid 2px #black;
}
.op_box > span > strong {
width: 40px;
min-width: 40px;
height: 40px;
border: solid 1px black;
display: inline-block;
line-height: 40px;
text-align: center;
margin-right: 20px;
border-radius: 100%;
flex-shrink: 0;
}
.op_box > span > span {
margin: 10px;
font-size: 1.1em;
}
/* ----- Quiz Question Start ----- */
.question_header {
display: flex;
justify-content: space-between;
}
/* ----- Quiz Pallete Start ----- */
#question_palette {
width: 300px;
grid-column-start: 2;
grid-row-start: 1;
display: grid;
grid-template-rows: 60px 1fr 140px;
background-color: white;
}
#questions_area {
height: 100vh;
overflow-y:scroll;
grid-column-start: 1;
grid-row-start: 1;
}
#questions_area_wrapper {
margin: auto;
max-width: 800px;
}
.question {
display: none;
padding: 30px;
}
.actual_question {
margin: 40px;
}
.questions_list {
list-style-type: none;
padding-left: 0px;
grid-column-start: 1;
grid-row-start: 2;
}
.questions_list > li {
padding: 15px;
border-bottom: solid 1px #fccde2;
transition: backround-color 0.2s ease-in-out;
}
.questions_list > li:hover {
padding: 15px;
background-color: #fee7f1;
border-bottom: solid 1px #fccde2;
}
/* ----- QUIZ CONTROLS Start ----- */
#toolbar {
grid-column-start: 1;
grid-row-start: 3;
padding: 20px
}
.button_group {
display: flex;
height: 40px;
flex-direction: row;
width: 100%;
overflow: hidden;
margin-bottom: 15px;
border-radius: 2em;
transition: box-shadow 0.2s ease-in-out;
box-shadow: 1px 1px 5px #a4a8a8;
}
.button_group:hover {
box-shadow: 2px 2px 5px #cdcfcf;
}
.quiz_btn {
border: none;
flex-grow: 1;
height: 100%;
color: white;
}
.prev_ques {
width: 40px;
background-color: #2f89fc;
transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
}
.prev_ques:hover {
background-color: #0359c9;
}
.prev_ques:active {
background-color: #81b7fd;
color:black;
}
.prev_ques:focus {
outline: none;
}
.next_ques {
background-color: #2f89fc;
transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
}
.next_ques:hover {
background-color: #0359c9;
}
.next_ques:active {
background-color: #81b7fd;
color:black;
}
.next_ques:focus {
outline: none;
}
.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;
var questions = document.getElementById('questions_area_wrapper').children;
questions[current_question].style.display = 'block';
var questions_len = parseInt(document.getElementById('question_count').value);
var selected_color = '#f4fa9c';
var deselected_color = '#ffffff';
function next_question () {
......@@ -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(question_id>=0 && question_id<questions_len && option_id>=0 && option_id<4) {
var ans = document.getElementById('q'+question_id);
ans.value = value;
var cbox = document.getElementById("lbl_"+question_id+"_"+option_id);
console.log("lbl_"+question_id+"_"+option_id);
cbox.style.backgroundColor = '#f4fa9c';
if (ans.value == "NA") {
ans.value = option_id;
var cbox = document.getElementById("lbl_"+question_id+"_"+option_id);
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 @@
<div id="questions_area_wrapper">
{% for i in questions%}
<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 ='questionId' hidden>{{i.questionId}} </h1>
<h1>{{i.question}}</h1>
<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}},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}},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}}, 3,'{{i.option4}}')"><span id="lbl_{{forloop.counter0}}_3"><strong>D</strong><span>{{i.option4}}</span></span></label>
<h2 class="actual_question">{{i.question}}</h2>
<input type="hidden" id="qq{{forloop.counter0}}" name="qq{{forloop.counter0}}" value="{{i.questionId}}">
<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)"><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)"><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)"><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">
......
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