-
Notifications
You must be signed in to change notification settings - Fork 747
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #4772 from KapuluruBhuvaneswariVspdbct/main
solved #4771 added quiz to swap reads
- Loading branch information
Showing
4 changed files
with
172 additions
and
10 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,152 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<title>Nectar in a Sieve Quiz</title> | ||
<style> | ||
body { | ||
font-family: Arial, sans-serif; | ||
background-color: #ffd2d3; /* Changed to pink color */ | ||
display: flex; | ||
justify-content: center; | ||
align-items: center; | ||
height: 100vh; | ||
margin: 0; | ||
} | ||
|
||
.quiz-container { | ||
background: white; | ||
padding: 20px; | ||
border-radius: 10px; | ||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); | ||
width: 300px; | ||
text-align: center; | ||
} | ||
|
||
button { | ||
padding: 10px 20px; | ||
margin-top: 20px; | ||
cursor: pointer; | ||
background-color: #b00000; | ||
color: white; | ||
border: none; | ||
border-radius: 5px; | ||
display: block; /* Make buttons block elements for vertical display */ | ||
width: 100%; /* Make buttons full width */ | ||
} | ||
|
||
button:hover { | ||
background-color: #0056b3; | ||
} | ||
|
||
h4 { | ||
margin: 10px 0; | ||
} | ||
|
||
.option { | ||
margin: 5px 0; /* Space between options */ | ||
} | ||
</style> | ||
</head> | ||
<body> | ||
|
||
<div class="quiz-container"> | ||
<h1>Nectar in a Sieve Quiz</h1> | ||
<div id="quiz-questions"> | ||
<!-- Questions will be inserted here --> | ||
</div> | ||
<button id="submit-button" onclick="submitQuiz()">Submit</button> | ||
<div id="quiz-result" style="display: none;"></div> | ||
<button id="home-button" style="display: none;" onclick="window.location.href='index.html';">Return to Home</button> | ||
</div> | ||
|
||
<script> | ||
const quizData = [ | ||
{ | ||
question: "Who is the protagonist of 'Nectar in a Sieve'?", | ||
options: ["Rukmani", "Ira", "Puli", "Kundumani"], | ||
answer: "Rukmani" | ||
}, | ||
{ | ||
question: "What is the primary occupation of Rukmani's husband, Nathan?", | ||
options: ["Farmer", "Trader", "Blacksmith", "Teacher"], | ||
answer: "Farmer" | ||
}, | ||
{ | ||
question: "Which major event disrupts the life of Rukmani and her family?", | ||
options: ["The arrival of the tannery", "A natural disaster", "A war", "A famine"], | ||
answer: "The arrival of the tannery" | ||
}, | ||
{ | ||
question: "What is the name of Rukmani's first child?", | ||
options: ["Ira", "Kundumani", "Arjun", "Murugan"], | ||
answer: "Arjun" | ||
}, | ||
{ | ||
question: "Which of the following themes is central to the novel?", | ||
options: ["Love and sacrifice", "Industrialization and its impact on rural life", "War and conflict", "The effects of colonialism"], | ||
answer: "Industrialization and its impact on rural life" | ||
} | ||
]; | ||
|
||
let currentQuestionIndex = 0; | ||
let score = 0; | ||
|
||
function loadQuestion() { | ||
const questionElement = document.getElementById('quiz-questions'); | ||
questionElement.innerHTML = ''; | ||
|
||
const currentQuestion = quizData[currentQuestionIndex]; | ||
const questionText = document.createElement('h4'); | ||
questionText.innerText = currentQuestion.question; | ||
questionElement.appendChild(questionText); | ||
|
||
currentQuestion.options.forEach(option => { | ||
const optionButton = document.createElement('button'); | ||
optionButton.classList.add('option'); | ||
optionButton.innerText = option; | ||
optionButton.onclick = () => selectAnswer(option); | ||
questionElement.appendChild(optionButton); | ||
}); | ||
} | ||
|
||
function selectAnswer(selectedOption) { | ||
const currentQuestion = quizData[currentQuestionIndex]; | ||
if (selectedOption === currentQuestion.answer) { | ||
score++; | ||
} | ||
currentQuestionIndex++; | ||
|
||
if (currentQuestionIndex < quizData.length) { | ||
loadQuestion(); | ||
} else { | ||
showResult(); | ||
} | ||
} | ||
|
||
function showResult() { | ||
const quizContainer = document.querySelector('.quiz-container'); | ||
quizContainer.innerHTML = `<h2>Your Score: ${score}/${quizData.length}</h2>`; | ||
|
||
// Create the return home button | ||
const homeButton = document.createElement('button'); | ||
homeButton.onclick = () => window.location.href = 'quizzes.html'; | ||
homeButton.innerText = 'Return to Quizzes'; | ||
quizContainer.appendChild(homeButton); | ||
} | ||
|
||
function submitQuiz () { | ||
if (currentQuestionIndex < quizData.length) { | ||
alert("Please answer all questions before submitting!"); | ||
} else { | ||
showResult(); | ||
} | ||
} | ||
|
||
// Load the first question when the page is ready | ||
document.addEventListener('DOMContentLoaded', loadQuestion); | ||
</script> | ||
|
||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters