Feat: Added quiz result functionality

This commit is contained in:
user86 2020-10-11 22:06:49 +05:30
parent e4a477db9d
commit cd10a154e6
4 changed files with 174 additions and 153 deletions

13
app.py
View File

@ -12,6 +12,9 @@ UPLOAD_FOLDER = './pdf/'
app = Flask(__name__)
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER
# Global quiz object
questions = dict()
@ app.route('/')
def index():
@ -24,7 +27,6 @@ def quiz():
""" Handle upload and conversion of file + other stuff """
UPLOAD_STATUS = False
questions = dict()
# Make directory to store uploaded files, if not exists
if not os.path.isdir('./pdf'):
@ -45,7 +47,6 @@ def quiz():
# Get contents of file
uploaded_content = pdf2text(file_path, file_exten)
questions = txt2questions(uploaded_content)
print(questions)
# File upload + convert success
if uploaded_content is not None:
@ -59,5 +60,13 @@ def quiz():
size=len(questions))
@app.route('/result', methods=['POST', 'GET'])
def result():
correct_q = 0
for k, v in request.form.items():
correct_q += 1
return render_template('result.html', total=5, correct=correct_q)
if __name__ == "__main__":
app.run(debug=True)

View File

@ -1,95 +1,93 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.1/css/bulma.min.css" />
<link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/style.css') }}" />
<link rel="shortcut icon" href="https://avatars0.githubusercontent.com/u/65834464?s=200&amp;v=4"
type="image/x-icon">
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/github-fork-ribbon-css/0.2.3/gh-fork-ribbon.min.css" />
<script src="https://kit.fontawesome.com/22be60108b.js" crossorigin="anonymous"></script>
<title>MLH Quizzet</title>
</head>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.1/css/bulma.min.css" />
<link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/style.css') }}" />
<link rel="shortcut icon" href="https://avatars0.githubusercontent.com/u/65834464?s=200&amp;v=4" type="image/x-icon">
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/github-fork-ribbon-css/0.2.3/gh-fork-ribbon.min.css" />
<script src="https://kit.fontawesome.com/22be60108b.js" crossorigin="anonymous"></script>
<title>MLH Quizzet</title>
</head>
<body>
<style type="text/css">
@font-face {
font-family: helvetica;
src: "{{ url_for('static', filename='fonts/helvetica.ttf')}}"
}
</style>
<nav class="navbar is-dark is-fixed-top has-text-centered" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<img src="https://avatars0.githubusercontent.com/u/65834464?s=200&amp;v=4" height="32" width="64"
style="margin: 10px">
<a class="navbar-item has-text-centered" href="{{ url_for('index') }}"><strong
class="is-size-3 has-text-centered">MLH Quizzet</strong></a>
<a class="github-fork-ribbon" href="https://github.com/PragatiVerma18/Fantastic-Falcons-1.0"
data-ribbon="Fork me on GitHub" title="Fork me on GitHub">Fork me on GitHub</a>
<div class="navbar-burger" data-target="navMenu">
<span></span>
<span></span>
<span></span>
</div>
<body>
<style type="text/css">
@font-face {
font-family: helvetica;
src: "{{ url_for('static', filename='fonts/helvetica.ttf')}}"
}
</style>
<nav class="navbar is-dark is-fixed-top has-text-centered" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<img src="https://avatars0.githubusercontent.com/u/65834464?s=200&amp;v=4" height="32" width="64"
style="margin: 10px">
<a class="navbar-item has-text-centered" href="{{ url_for('index') }}"><strong
class="is-size-3 has-text-centered">MLH Quizzet</strong></a>
<a class="github-fork-ribbon" href="https://github.com/PragatiVerma18/Fantastic-Falcons-1.0"
data-ribbon="Fork me on GitHub" title="Fork me on GitHub">Fork me on GitHub</a>
<div class="navbar-burger" data-target="navMenu">
<span></span>
<span></span>
<span></span>
</div>
</nav>
<main role="main">
<div class="card has-text-centered">
<img src="https://cdn4.iconfinder.com/data/icons/files-and-folders-thinline-icons-set/144/File_PDF-512.png"
alt="upload" />
<form action="http://localhost:5000/quiz" method="POST" enctype="multipart/form-data">
<div id="file-js-example" class="file has-name is-fullwidth">
<label class="file-label">
<input class="file-input" type="file" name="file" accept=".txt, application/pdf" />
<span class="file-cta">
<span class="file-icon">
<i class="fas fa-upload"></i>
</span>
<span class="file-label"> Choose a file… </span>
</div>
</nav>
<main role="main">
<div class="card has-text-centered">
<img src="https://cdn4.iconfinder.com/data/icons/files-and-folders-thinline-icons-set/144/File_PDF-512.png"
alt="upload" />
<form action="http://localhost:5000/quiz" method="POST" enctype="multipart/form-data">
<div id="file-js-example" class="file has-name is-fullwidth">
<label class="file-label">
<input class="file-input" type="file" name="file" accept=".txt, application/pdf" />
<span class="file-cta">
<span class="file-icon">
<i class="fas fa-upload"></i>
</span>
<span class="file-name"> No file uploaded </span>
</label>
</div>
<script>
const fileInput = document.querySelector(
"#file-js-example input[type=file]"
);
fileInput.onchange = () => {
if (fileInput.files.length > 0) {
const fileName = document.querySelector(
"#file-js-example .file-name"
);
fileName.textContent = fileInput.files[0].name;
}
};
</script>
<button class="button has-text-centered is-large is-fullwidth is-dark">
<span class="submit has-text-centered" type="submit" name="upload file">Submit</span>
<span class="loading"><i class="fa fa-refresh"></i></span>
<span class="check"><i class="fa fa-check"></i></span>
</button>
</form>
</div>
</main>
<script>const button = document.querySelector('.button');
const submit = document.querySelector('.submit');
<span class="file-label"> Choose a file… </span>
</span>
<span class="file-name"> No file uploaded </span>
</label>
</div>
<script>
const fileInput = document.querySelector(
"#file-js-example input[type=file]"
);
fileInput.onchange = () => {
if (fileInput.files.length > 0) {
const fileName = document.querySelector(
"#file-js-example .file-name"
);
fileName.textContent = fileInput.files[0].name;
}
};
</script>
<button class="button has-text-centered is-large is-fullwidth is-dark">
<span class="submit has-text-centered" type="submit" name="upload file">Submit</span>
<span class="loading"><i class="fa fa-refresh"></i></span>
<span class="check"><i class="fa fa-check"></i></span>
</button>
</form>
</div>
</main>
<script>const button = document.querySelector('.button');
const submit = document.querySelector('.submit');
function toggleClass() {
this.classList.toggle('active');
}
function toggleClass() {
this.classList.toggle('active');
}
function addClass() {
this.classList.add('finished');
}
function addClass() {
this.classList.add('finished');
}
button.addEventListener('click', toggleClass);
button.addEventListener('transitionend', toggleClass);
button.addEventListener('transitionend', addClass);
</script>
</body>
button.addEventListener('click', toggleClass);
button.addEventListener('transitionend', toggleClass);
button.addEventListener('transitionend', addClass);
</script>
</body>
</html>
</html>

View File

@ -1,52 +1,52 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.1/css/bulma.min.css" />
<link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/quiz.css') }}" />
<link rel="shortcut icon" href="https://avatars0.githubusercontent.com/u/65834464?s=200&amp;v=4"
type="image/x-icon">
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/github-fork-ribbon-css/0.2.3/gh-fork-ribbon.min.css" />
<title>MLH Quizzet</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type='text/javascript'></script>
<script type="text/javascript">
$(document).ready(function () {
$('label').click(function () {
$('label').removeClass('worngans');
$(this).addClass('worngans');
});
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.1/css/bulma.min.css" />
<link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/quiz.css') }}" />
<link rel="shortcut icon" href="https://avatars0.githubusercontent.com/u/65834464?s=200&amp;v=4"
type="image/x-icon">
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/github-fork-ribbon-css/0.2.3/gh-fork-ribbon.min.css" />
<title>MLH Quizzet</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type='text/javascript'></script>
<script type="text/javascript">
$(document).ready(function () {
$('label').click(function () {
$('label').removeClass('worngans');
$(this).addClass('worngans');
});
</script>
</head>
});
</script>
</head>
<body>
<style type="text/css">
@font-face {
font-family: helvetica;
src: "{{ url_for('static', filename='fonts/helvetica.ttf')}}"
}
</style>
<nav class="navbar is-dark is-fixed-top has-text-centered" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<img src="https://avatars0.githubusercontent.com/u/65834464?s=200&amp;v=4" height="32" width="64"
style="margin: 7px">
<a class="navbar-item has-text-centered" href="{{ url_for('index') }}"><strong
class="is-size-3 has-text-centered">MLH
Quizzet</strong></a>
<a class="github-fork-ribbon" href="https://github.com/PragatiVerma18/Fantastic-Falcons-1.0"
data-ribbon="Fork me on GitHub" title="Fork me on GitHub">Fork me on GitHub</a>
<div class="navbar-burger" data-target="navMenu">
<span></span>
<span></span>
<span></span>
</div>
<body>
<style type="text/css">
@font-face {
font-family: helvetica;
src: "{{ url_for('static', filename='fonts/helvetica.ttf')}}"
}
</style>
<nav class="navbar is-dark is-fixed-top has-text-centered" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<img src="https://avatars0.githubusercontent.com/u/65834464?s=200&amp;v=4" height="32" width="64"
style="margin: 7px">
<a class="navbar-item has-text-centered" href="{{ url_for('index') }}"><strong
class="is-size-3 has-text-centered">MLH
Quizzet</strong></a>
<a class="github-fork-ribbon" href="https://github.com/PragatiVerma18/Fantastic-Falcons-1.0"
data-ribbon="Fork me on GitHub" title="Fork me on GitHub">Fork me on GitHub</a>
<div class="navbar-burger" data-target="navMenu">
<span></span>
<span></span>
<span></span>
</div>
</nav>
{% if uploaded == true %}
</div>
</nav>
{% if uploaded == true %}
<form action="http://localhost:5000/result" method="POST">
{% for i in range(size) %}
<section class="section-1" id="section-1">
<main>
@ -54,32 +54,32 @@
<div class="scp-quizzes-data">
<h3 class="is-size-6 has-text-weight-bold">{{ i+1 }}. {{ questions[i+1]['question'] }}</h3>
<br />
<form>
{% for op in questions[i+1]['options'] %}
{% if op == questions[i+1]['answer'] %}
<input type="radio" id="{{ questions[i+1]['answer'] }}" name="question{{ i+1 }}">
<label for="{{ questions[i+1]['answer'] }}">
{{ op }}</label><br />
{% else %}
<input type="radio" name="question{{ i+1 }}">
<label> {{ op }}</label><br />
{% endif %}
{% endfor %}
</form>
{% for op in questions[i+1]['options'] %}
{% if op == questions[i+1]['answer'] %}
<input type="radio" id="{{ questions[i+1]['answer'] }}" name="question{{ i+1 }}">
<label for="{{ questions[i+1]['answer'] }}">
{{ op }}</label><br />
{% else %}
<input type="radio" name="question{{ i+1 }}">
<label> {{ op }}</label><br />
{% endif %}
{% endfor %}
</div>
</div>
</main>
</section>
{% endfor %}
{% else %}
<section class="section-1" id="section-1">
<h1>Could not upload file</h1>
</section>
{% endif %}
<div class="has-text-white has-text-centered"
style="margin-top: 50px; background-color: #363636; padding: 10px;">
MIT License © Copyright 2020 Fantastic Falcons
</div>
</body>
<button type="submit">Submit</button>
</form>
</html>
{% else %}
<section class="section-1" id="section-1">
<h1>Could not upload file</h1>
</section>
{% endif %}
<div class="has-text-white has-text-centered" style="margin-top: 50px; background-color: #363636; padding: 10px;">
MIT License © Copyright 2020 Fantastic Falcons
</div>
</body>
</html>

14
templates/result.html Normal file
View File

@ -0,0 +1,14 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1> You got {{ correct }}/{{ total }} right !</h1>
</body>
</html>