Spaces:

mou3az
/

MCQA-Quiz

Sleeping

App Files Files Community

mou3az commited on Jul 22

Commit

bb9e9c5

•

1 Parent(s): 702b6bf

Update app.py

Browse files

Files changed (1) hide show

app.py +155 -4

app.py CHANGED Viewed

@@ -1,9 +1,10 @@
-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):
@@ -61,10 +62,160 @@ def generate_quiz_page():
         if request.content_type == 'application/json':
             return jsonify(response)
-        return render_template('quiz.html', textWithAnswers=response)
-    return render_template('index.html')
 if __name__ == "__main__":
     app.run(debug=True)

+from flask import Flask, request, jsonify
 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):
         if request.content_type == 'application/json':
             return jsonify(response)
+        quiz_html = f"""
+        <!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; /* Light grey background */
+                    color: #333; /* Dark grey text color */
+                    margin: 20px;
+                }}
+                h2 {{
+                    background-color: #ffc107; /* Yellow background for heading */
+                    padding: 10px;
+                    border-radius: 5px;
+                }}
+                form {{
+                    display: none; /* Hide the form after generating quiz */
+                }}
+                .quiz-container {{
+                    background-color: #f0f0f0; /* Light grey background */
+                    padding: 20px;
+                    border-radius: 5px;
+                    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Light shadow effect */
+                    margin-bottom: 20px;
+                }}
+                .quiz-container pre {{
+                    white-space: pre-wrap; /* Preserve line breaks in quiz response */
+                }}
+                .generate-link {{
+                    display: inline-block; /* Make the link inline-block */
+                    margin-top: 10px;
+                    border: 2px solid transparent; /* Transparent border initially */
+                    padding: 5px 10px; /* Padding for spacing inside the border */
+                    text-decoration: none; /* Remove underline */
+                    color: #ffc107; /* Yellow text color */
+                    font-weight: bold; /* Bold text */
+                    border-radius: 4px;
+                    background-color: #333; /* Dark grey background color */
+                }}
+                .generate-link:hover {{
+                    text-decoration: none; /* Remove underline on hover */
+                    background-color: #555; /* Darker grey background color on hover */
+                }}
+                a {{
+                    color: #ffc107; /* Yellow text color for links */
+                    text-decoration: none;
+                }}
+                a:hover {{
+                    text-decoration: underline; /* Underline on hover */
+                }}
+                textarea {{
+                    width: 100%;
+                    padding: 10px;
+                    border: 1px solid #ccc;
+                    border-radius: 4px;
+                    resize: vertical; /* Allow vertical resizing of textarea */
+                    min-height: 150px; /* Minimum height for textarea */
+                }}
+                input[type="submit"] {{
+                    background-color: #ffc107; /* Yellow background for submit button */
+                    color: #333; /* Dark grey text color */
+                    border: none;
+                    padding: 10px 20px;
+                    cursor: pointer;
+                    border-radius: 4px;
+                }}
+                input[type="submit"]:hover {{
+                    background-color: #ffca28; /* Lighter yellow on hover */
+                }}
+            </style>
+        </head>
+        <body>
+            <div class="quiz-container">
+                <h2>Generated Quiz</h2>
+                <pre>{response}</pre>
+                <a href="/" class="generate-link">Back to generate another quiz</a>
+            </div>
+        </body>
+        </html>
+        """
+        return quiz_html
+    # Default GET request handling
+    default_html = """
+    <!DOCTYPE html>
+    <html lang="en">
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Generate Quiz</title>
+        <style>
+            body {
+                font-family: Arial, sans-serif;
+                background-color: #f0f0f0; /* Light grey background */
+                color: #333; /* Dark grey text color */
+                margin: 20px;
+            }
+            h2 {
+                background-color: #ffc107; /* Yellow background for heading */
+                padding: 10px;
+                border-radius: 5px;
+            }
+            form {
+                background-color: #fff; /* White background for form */
+                padding: 20px;
+                border-radius: 5px;
+                box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Light shadow effect */
+                margin-bottom: 20px;
+            }
+            label {
+                display: block;
+                margin-bottom: 10px;
+            }
+            textarea {
+                width: 98%;
+                padding: 10px;
+                border: 2px solid #ffc107; /* Yellow border */
+                border-radius: 4px;
+                resize: vertical; /* Allow vertical resizing of textarea */
+                min-height: 150px; /* Minimum height for textarea */
+                background-color: #f0f0f0; /* Light grey background */
+            }
+            input[type="submit"] {
+                background-color: #ffc107; /* Yellow background for submit button */
+                color: #333; /* Dark grey text color */
+                border: none;
+                padding: 10px 20px;
+                cursor: pointer;
+                border-radius: 4px;
+            }
+            input[type="submit"]:hover {
+                background-color: #ffca28; /* Lighter yellow on hover */
+            }
+        </style>
+    </head>
+    <body>
+        <h2>Generate Quiz</h2>
+        <form action="/" method="post">
+            <label for="context">Context:</label><br>
+            <textarea id="context" name="context" rows="20" required></textarea><br><br>
+            <input type="submit" value="Generate Quiz">
+        </form>
+    </body>
+    </html>
+    """
+    return default_html
 if __name__ == "__main__":
     app.run(debug=True)