Spaces:

mou3az
/

MCQA-Quiz

Running

App Files Files Community

mou3az commited on Jul 22

Commit

b01d78d

•

1 Parent(s): 8e9ffdf

Update app.py

Browse files

Files changed (1) hide show

app.py +181 -100

app.py CHANGED Viewed

@@ -1,100 +1,181 @@
-from flask import Flask, request, jsonify, render_template
-from huggingface_hub import InferenceClient
-from requests.exceptions import RequestException
-app = Flask(__name__)
-client = InferenceClient("mistralai/Mistral-7B-Instruct-v0.2")
-def system_instructions(context):
-    return f"""<s> [INST] Your are a great teacher and your task is to create 6 questions with answer and 4 choices based on the following context:\n\n{context}\n\n. Each example should be like this
-    Question: ""
-    Choices:
-    A): ""
-    B): ""
-    C): ""
-    D): ""
-    Answer: "Choose either A, B, C, or D as the correct answer"
-    Explanation: ""
-    \n
-    [/INST]
-    """
-def generate_quiz(context):
-    formatted_prompt = system_instructions(context)
-    generate_kwargs = dict(
-            temperature=0.1,
-            max_new_tokens=2048,
-            top_p=0.95,
-            repetition_penalty=1.0,
-            do_sample=True,
-            seed=42,)
-    try:
-        response = client.text_generation(
-            formatted_prompt,
-            **generate_kwargs,
-            stream=False,
-            details=False,
-            return_full_text=False,
-        )
-        return response
-    except (RequestException, SystemExit) as e:
-        return {"error": str(e)}
-@app.route("/", methods=["GET", "POST"])
-def generate_quiz_page():
-    if request.method == "POST":
-        if request.content_type == 'application/json':
-            data = request.get_json()
-            context = data.get("context")
-            if context is None or context.strip() == "":
-                return jsonify({"error": "Missing or empty 'context' parameter"}), 400
-        else:
-            context = request.form.get("context")
-            if context is None or context.strip() == "":
-                return jsonify({"error": "Missing or empty 'context' parameter"}), 400
-        response = generate_quiz(context)
-        if request.content_type == 'application/json':
-            return jsonify(response)
-        # Handle text processing for quiz generation
-        filtered_text, answers_and_explanations = handle_text(response)
-        return render_template('quiz.html', filtered_text=filtered_text, answers_and_explanations=answers_and_explanations)
-    # Default GET request handling
-    return render_template('index.html')
-def handle_text(text):
-    lines = text.splitlines()
-    filtered_lines = []
-    answers_and_explanations = []
-    for line in lines:
-        line = line.strip()
-        if line.startswith("Question:"):
-            filtered_lines.append(line)
-        elif line.startswith("Choices:"):
-            filtered_lines.append(line)
-        elif line.startswith("Answer:"):
-            answer = line.split(":")[1].strip()
-            answers_and_explanations.append({"Answer": answer})
-        elif line.startswith("Explanation:"):
-            explanation = line.split(":")[1].strip()
-            answers_and_explanations[-1]["Explanation"] = explanation
-        elif line.startswith(("A)", "B)", "C)", "D)")):
-            filtered_lines.append(line)
-        else:
-            filtered_lines.append(line)
-    filtered_text = "\n".join(filtered_lines)
-    return filtered_text, answers_and_explanations
-if __name__ == "__main__":
-    app.run(debug=True)

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Generated Quiz</title>
+    <style>
+        body {
+            font-family: Arial, sans-serif;
+            background-color: #f0f0f0;
+            color: #333;
+            margin: 20px;
+        }
+        h2 {
+            background-color: #ffc107;
+            padding: 10px;
+            border-radius: 5px;
+        }
+        .quiz-container {
+            background-color: #fff;
+            padding: 20px;
+            border-radius: 5px;
+            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+            margin-bottom: 20px;
+        }
+        .quiz-container pre {
+            white-space: pre-wrap;
+        }
+        .generate-link {
+            display: inline-block;
+            margin-top: 10px;
+            border: 2px solid transparent;
+            padding: 5px 10px;
+            text-decoration: none;
+            color: #ffc107;
+            font-weight: bold;
+            border-radius: 4px;
+            background-color: #333;
+        }
+        .generate-link:hover {
+            text-decoration: none;
+            background-color: #555;
+        }
+        a {
+            color: #ffc107;
+            text-decoration: none;
+        }
+        a:hover {
+            text-decoration: underline;
+        }
+    </style>
+</head>
+<body>
+    <div class="quiz-container">
+        <h2>Generated Quiz</h2>
+        <pre>{{ filtered_text }}</pre>
+        <a href="/" class="generate-link">Back to generate another quiz</a>
+    </div>
+    <div id="quizSection"></div>
+    <button id="submitQuiz" style="display: none;" onclick="submitQuiz()">Submit Quiz</button>
+    <script>
+        document.addEventListener('DOMContentLoaded', function() {
+            generateQuiz("{{ filtered_text }}", {{ answers_and_explanations | tojson }});
+        });
+        function generateQuiz(filteredText, answersAndExplanations) {
+            let quizSection = document.getElementById('quizSection');
+            quizSection.innerHTML = '';
+            let questions = filteredText.split(/\d+\.\s+/).filter(q => q.trim() !== '');
+            questions.forEach((question, index) => {
+                let parts = question.split('Choices:');
+                let questionText = parts[0].replace('Question:', '').trim();
+                let choicesText = parts[1].trim();
+                let div = document.createElement('div');
+                div.className = 'quiz-question';
+                div.innerHTML = `<strong>${index + 1}: ${questionText}</strong>`;
+                let choices = choicesText.split(/\s*[A-D]\)\s*/).filter(choice => choice.trim() !== '');
+                let labels = choicesText.match(/\s*[A-D]\)\s*/g);
+                choices.forEach((choice, i) => {
+                    let label = labels[i].trim().charAt(0);
+                    let choiceDiv = document.createElement('div');
+                    let input = document.createElement('input');
+                    input.type = 'radio';
+                    input.name = `question_${index + 1}`;
+                    input.value = label;
+                    input.id = `q${index + 1}_${label}`;
+                    let choiceLabel = document.createElement('label');
+                    choiceLabel.setAttribute('for', `q${index + 1}_${label}`);
+                    choiceLabel.textContent = `${label}) ${choice}`;
+                    choiceDiv.appendChild(input);
+                    choiceDiv.appendChild(choiceLabel);
+                    div.appendChild(choiceDiv);
+                });
+                let answerDiv = document.createElement('div');
+                answerDiv.className = 'quiz-answer';
+                answerDiv.style.display = 'none';
+                div.appendChild(answerDiv);
+                let explanationDiv = document.createElement('div');
+                explanationDiv.className = 'quiz-explanation';
+                explanationDiv.style.display = 'none';
+                div.appendChild(explanationDiv);
+                quizSection.appendChild(div);
+            });
+            document.getElementById('submitQuiz').style.display = 'block';
+        }
+        function validateQuiz() {
+            let quizSection = document.getElementById('quizSection');
+            let questions = quizSection.getElementsByClassName('quiz-question');
+            for (let i = 0; i < questions.length; i++) {
+                let inputs = questions[i].querySelectorAll('input[type="radio"]');
+                let answered = false;
+                for (let j = 0; j < inputs.length; j++) {
+                    if (inputs[j].checked) {
+                        answered = true;
+                        break;
+                    }
+                }
+                if (!answered) {
+                    return false;
+                }
+            }
+            return true;
+        }
+        function submitQuiz() {
+            if (!validateQuiz()) {
+                alert('Please answer all questions before submitting.');
+                return;
+            }
+            let quizSection = document.getElementById('quizSection');
+            let questions = quizSection.getElementsByClassName('quiz-question');
+            fetch('/process_text', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                body: JSON.stringify({ text: "{{ filtered_text }}" })
+            })
+            .then(response => response.json())
+            .then(data => {
+                let answersAndExplanations = data.answers_and_explanations;
+                for (let i = 0; i < questions.length; i++) {
+                    let answerDiv = questions[i].querySelector('.quiz-answer');
+                    let explanationDiv = questions[i].querySelector('.quiz-explanation');
+                    let answer = answersAndExplanations[i]?.Answer || '';
+                    let explanation = answersAndExplanations[i]?.Explanation || '';
+                    answerDiv.style.display = 'block';
+                    answerDiv.innerHTML = `Answer: ${answer}`;
+                    explanationDiv.style.display = 'block';
+                    explanationDiv.innerHTML = `Explanation: ${explanation}`;
+                }
+                document.getElementById('submitQuiz').style.display = 'none';
+            });
+        }
+    </script>
+</body>
+</html>