Choose a Topic
\n\n \n \n \n \n
\n Quiz Time!
\n \n \n \nYour Score
\nCorrect: 0
\nIncorrect: 0
\n
body.html
Changed around line 1
+
+
QuizGenius
+
Pick a topic, answer questions, and track your progress!
+
+
+
+
+
Choose a Topic
+
+
+
+
+
+
+
+
+
+
Quiz Time!
+
+
+
+
+
+
+
Your Score
+
Correct: 0
+
Incorrect: 0
+
+
+
+
+
Keep learning, keep growing!
+
index.scroll
Changed around line 1
+ buildHtml
+ baseUrl https://quizgenius.scroll.pub
+ metaTags
+ editButton /edit.html
+ title QuizGenius - Learn & Test Your Knowledge
+ style.css
+ body.html
+ script.js
prompt.json
Changed around line 1
+ {
+ "id": "97043c9d-6ce2-42ed-82df-0d64a2bbae08",
+ "object": "chat.completion",
+ "created": 1735344264,
+ "model": "deepseek-chat",
+ "choices": [
+ {
+ "index": 0,
+ "message": {
+ "role": "assistant",
+ "content": "---domain---\nquizgenius.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://quizgenius.scroll.pub\nmetaTags\neditButton /edit.html\ntitle QuizGenius - Learn & Test Your Knowledge\nstyle.css\nbody.html\nscript.js\n---body.html---\n\n \n\n\n \n \n\n \n \n\n \n \n \n\n\n---style.css---\n:root {\n --primary-color: #4a90e2;\n --secondary-color: #f5f5f5;\n --accent-color: #ff6f61;\n --text-color: #333;\n --font-family: 'Arial', sans-serif;\n}\n\nbody {\n font-family: var(--font-family);\n color: var(--text-color);\n margin: 0;\n padding: 0;\n background-color: var(--secondary-color);\n line-height: 1.6;\n}\n\nheader {\n background-color: var(--primary-color);\n color: white;\n padding: 2rem;\n text-align: center;\n}\n\nmain {\n padding: 2rem;\n}\n\n.topics {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 1rem;\n}\n\nbutton {\n background-color: var(--primary-color);\n color: white;\n border: none;\n padding: 1rem;\n border-radius: 5px;\n cursor: pointer;\n transition: background-color 0.3s ease;\n}\n\nbutton:hover {\n background-color: var(--accent-color);\n}\n\n#quiz-section, #scoreboard {\n margin-top: 2rem;\n}\n\n.hidden {\n display: none;\n}\n\n#question-container {\n background-color: white;\n padding: 1rem;\n border-radius: 5px;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\n}\n\nfooter {\n text-align: center;\n padding: 1rem;\n background-color: var(--primary-color);\n color: white;\n margin-top: 2rem;\n}\n---script.js---\nconst topics = document.querySelectorAll('[data-topic]');\nconst quizSection = document.getElementById('quiz-section');\nconst questionContainer = document.getElementById('question-container');\nconst submitAnswerBtn = document.getElementById('submit-answer');\nconst nextQuestionBtn = document.getElementById('next-question');\nconst scoreboard = document.getElementById('scoreboard');\nconst correctAnswersSpan = document.getElementById('correct-answers');\nconst incorrectAnswersSpan = document.getElementById('incorrect-answers');\n\nlet currentTopic = '';\nlet currentQuestionIndex = 0;\nlet correctAnswers = 0;\nlet incorrectAnswers = 0;\n\nconst questions = {\n history: [\n {\n question: \"Who was the first president of the United States?\",\n options: [\"George Washington\", \"Thomas Jefferson\", \"Abraham Lincoln\", \"John Adams\"],\n answer: \"George Washington\"\n },\n {\n question: \"In which year did World War II end?\",\n options: [\"1945\", \"1939\", \"1941\", \"1943\"],\n answer: \"1945\"\n }\n ],\n science: [\n {\n question: \"What is the chemical symbol for water?\",\n options: [\"H2O\", \"CO2\", \"O2\", \"H2\"],\n answer: \"H2O\"\n },\n {\n question: \"Which planet is known as the Red Planet?\",\n options: [\"Mars\", \"Venus\", \"Jupiter\", \"Saturn\"],\n answer: \"Mars\"\n }\n ],\n math: [\n {\n question: \"What is 2 + 2?\",\n options: [\"4\", \"3\", \"5\", \"6\"],\n answer: \"4\"\n },\n {\n question: \"What is the square root of 64?\",\n options: [\"8\", \"6\", \"10\", \"12\"],\n answer: \"8\"\n }\n ],\n literature: [\n {\n question: \"Who wrote 'Romeo and Juliet'?\",\n options: [\"William Shakespeare\", \"Charles Dickens\", \"Jane Austen\", \"Mark Twain\"],\n answer: \"William Shakespeare\"\n },\n {\n question: \"What is the main character in 'Moby Dick'?\",\n options: [\"Captain Ahab\", \"Ishmael\", \"Queequeg\", \"Starbuck\"],\n answer: \"Captain Ahab\"\n }\n ]\n};\n\ntopics.forEach(topic => {\n topic.addEventListener('click', () => {\n currentTopic = topic.dataset.topic;\n document.getElementById('topic-selection').classList.add('hidden');\n quizSection.classList.remove('hidden');\n loadQuestion();\n });\n});\n\nfunction loadQuestion() {\n const question = questions[currentTopic][currentQuestionIndex];\n questionContainer.innerHTML = `\n
QuizGenius
\nPick a topic, answer questions, and track your progress!
\n${question.question}
\n ${question.options.map(option => `\n \n `).join('')}\n `;\n submitAnswerBtn.classList.remove('hidden');\n}\n\nsubmitAnswerBtn.addEventListener('click', () => {\n const selectedAnswer = document.querySelector('input[name=\"answer\"]:checked');\n if (selectedAnswer) {\n const question = questions[currentTopic][currentQuestionIndex];\n if (selectedAnswer.value === question.answer) {\n correctAnswers++;\n } else {\n incorrectAnswers++;\n }\n updateScoreboard();\n submitAnswerBtn.classList.add('hidden');\n nextQuestionBtn.classList.remove('hidden');\n }\n});\n\nnextQuestionBtn.addEventListener('click', () => {\n currentQuestionIndex++;\n if (currentQuestionIndex < questions[currentTopic].length) {\n loadQuestion();\n nextQuestionBtn.classList.add('hidden');\n submitAnswerBtn.classList.remove('hidden');\n } else {\n quizSection.classList.add('hidden');\n scoreboard.classList.remove('hidden');\n }\n});\n\nfunction updateScoreboard() {\n correctAnswersSpan.textContent = correctAnswers;\n incorrectAnswersSpan.textContent = incorrectAnswers;\n}\n---end---"+ },
+ "logprobs": null,
+ "finish_reason": "stop"
+ }
+ ],
+ "usage": {
+ "prompt_tokens": 259,
+ "completion_tokens": 1581,
+ "total_tokens": 1840,
+ "prompt_cache_hit_tokens": 0,
+ "prompt_cache_miss_tokens": 259
+ },
+ "system_fingerprint": "fp_f1afce2943"
+ }
readme.scroll
Changed around line 1
+ # quizgenius.scroll.pub
+ Website generated by DeepSeek from prompt: Nextjs app for learning courses. The user pick the topic and it generates questions in multiple question format . Show a scoreboard
script.js
Changed around line 1
+ const topics = document.querySelectorAll('[data-topic]');
+ const quizSection = document.getElementById('quiz-section');
+ const questionContainer = document.getElementById('question-container');
+ const submitAnswerBtn = document.getElementById('submit-answer');
+ const nextQuestionBtn = document.getElementById('next-question');
+ const scoreboard = document.getElementById('scoreboard');
+ const correctAnswersSpan = document.getElementById('correct-answers');
+ const incorrectAnswersSpan = document.getElementById('incorrect-answers');
+
+ let currentTopic = '';
+ let currentQuestionIndex = 0;
+ let correctAnswers = 0;
+ let incorrectAnswers = 0;
+
+ const questions = {
+ history: [
+ {
+ question: "Who was the first president of the United States?",
+ options: ["George Washington", "Thomas Jefferson", "Abraham Lincoln", "John Adams"],
+ answer: "George Washington"
+ },
+ {
+ question: "In which year did World War II end?",
+ options: ["1945", "1939", "1941", "1943"],
+ answer: "1945"
+ }
+ ],
+ science: [
+ {
+ question: "What is the chemical symbol for water?",
+ options: ["H2O", "CO2", "O2", "H2"],
+ answer: "H2O"
+ },
+ {
+ question: "Which planet is known as the Red Planet?",
+ options: ["Mars", "Venus", "Jupiter", "Saturn"],
+ answer: "Mars"
+ }
+ ],
+ math: [
+ {
+ question: "What is 2 + 2?",
+ options: ["4", "3", "5", "6"],
+ answer: "4"
+ },
+ {
+ question: "What is the square root of 64?",
+ options: ["8", "6", "10", "12"],
+ answer: "8"
+ }
+ ],
+ literature: [
+ {
+ question: "Who wrote 'Romeo and Juliet'?",
+ options: ["William Shakespeare", "Charles Dickens", "Jane Austen", "Mark Twain"],
+ answer: "William Shakespeare"
+ },
+ {
+ question: "What is the main character in 'Moby Dick'?",
+ options: ["Captain Ahab", "Ishmael", "Queequeg", "Starbuck"],
+ answer: "Captain Ahab"
+ }
+ ]
+ };
+
+ topics.forEach(topic => {
+ topic.addEventListener('click', () => {
+ currentTopic = topic.dataset.topic;
+ document.getElementById('topic-selection').classList.add('hidden');
+ quizSection.classList.remove('hidden');
+ loadQuestion();
+ });
+ });
+
+ function loadQuestion() {
+ const question = questions[currentTopic][currentQuestionIndex];
+ questionContainer.innerHTML = `
+
${question.question}
+ ${question.options.map(option => `
+
+
+ ${option}
+
+ `).join('')}
+ `;
+ submitAnswerBtn.classList.remove('hidden');
+ }
+
+ submitAnswerBtn.addEventListener('click', () => {
+ const selectedAnswer = document.querySelector('input[name="answer"]:checked');
+ if (selectedAnswer) {
+ const question = questions[currentTopic][currentQuestionIndex];
+ if (selectedAnswer.value === question.answer) {
+ correctAnswers++;
+ } else {
+ incorrectAnswers++;
+ }
+ updateScoreboard();
+ submitAnswerBtn.classList.add('hidden');
+ nextQuestionBtn.classList.remove('hidden');
+ }
+ });
+
+ nextQuestionBtn.addEventListener('click', () => {
+ currentQuestionIndex++;
+ if (currentQuestionIndex < questions[currentTopic].length) {
+ loadQuestion();
+ nextQuestionBtn.classList.add('hidden');
+ submitAnswerBtn.classList.remove('hidden');
+ } else {
+ quizSection.classList.add('hidden');
+ scoreboard.classList.remove('hidden');
+ }
+ });
+
+ function updateScoreboard() {
+ correctAnswersSpan.textContent = correctAnswers;
+ incorrectAnswersSpan.textContent = incorrectAnswers;
+ }
style.css
Changed around line 1
+ :root {
+ --primary-color: #4a90e2;
+ --secondary-color: #f5f5f5;
+ --accent-color: #ff6f61;
+ --text-color: #333;
+ --font-family: 'Arial', sans-serif;
+ }
+
+ body {
+ font-family: var(--font-family);
+ color: var(--text-color);
+ margin: 0;
+ padding: 0;
+ background-color: var(--secondary-color);
+ line-height: 1.6;
+ }
+
+ header {
+ background-color: var(--primary-color);
+ color: white;
+ padding: 2rem;
+ text-align: center;
+ }
+
+ main {
+ padding: 2rem;
+ }
+
+ .topics {
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
+ gap: 1rem;
+ }
+
+ button {
+ background-color: var(--primary-color);
+ color: white;
+ border: none;
+ padding: 1rem;
+ border-radius: 5px;
+ cursor: pointer;
+ transition: background-color 0.3s ease;
+ }
+
+ button:hover {
+ background-color: var(--accent-color);
+ }
+
+ #quiz-section, #scoreboard {
+ margin-top: 2rem;
+ }
+
+ .hidden {
+ display: none;
+ }
+
+ #question-container {
+ background-color: white;
+ padding: 1rem;
+ border-radius: 5px;
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+ }
+
+ footer {
+ text-align: center;
+ padding: 1rem;
+ background-color: var(--primary-color);
+ color: white;
+ margin-top: 2rem;
+ }