Skip to content

Commit b403348

Browse files
committed
refactor: tourism quiz in separate json file
1 parent 59bf95e commit b403348

File tree

3 files changed

+110
-55
lines changed

3 files changed

+110
-55
lines changed
Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
[
2+
{
3+
"id": "q1",
4+
"question": "Where did Lord Buddha attain enlightenment?",
5+
"options": [
6+
{ "value": "bodh", "label": "Bodh Gaya" },
7+
{ "value": "rajgir", "label": "Rajgir" },
8+
{ "value": "vaishali", "label": "Vaishali" }
9+
],
10+
"answer": "bodh"
11+
},
12+
{
13+
"id": "q2",
14+
"question": "Which ancient university in Bihar is a UNESCO World Heritage Site?",
15+
"options": [
16+
{ "value": "takshashila", "label": "Takshashila" },
17+
{ "value": "nalanda", "label": "Nalanda" },
18+
{ "value": "vikramshila", "label": "Vikramshila" }
19+
],
20+
"answer": "nalanda"
21+
},
22+
{
23+
"id": "q3",
24+
"question": "The festival where devotees worship the Sun God is:",
25+
"options": [
26+
{ "value": "chhath", "label": "Chhath Puja" },
27+
{ "value": "holi", "label": "Holi" },
28+
{ "value": "diwali", "label": "Diwali" }
29+
],
30+
"answer": "chhath"
31+
},
32+
{
33+
"id": "q4",
34+
"question": "The capital city of Bihar is:",
35+
"options": [
36+
{ "value": "gaya", "label": "Gaya" },
37+
{ "value": "patna", "label": "Patna" },
38+
{ "value": "muzaffarpur", "label": "Muzaffarpur" }
39+
],
40+
"answer": "patna"
41+
},
42+
{
43+
"id": "q5",
44+
"question": "The wildlife reserve in West Champaran is:",
45+
"options": [
46+
{ "value": "valmiki", "label": "Valmiki Tiger Reserve" },
47+
{ "value": "kuno", "label": "Kuno National Park" },
48+
{ "value": "kaziranga", "label": "Kaziranga National Park" }
49+
],
50+
"answer": "valmiki"
51+
}
52+
]

bihar-culture-landing/script.js

Lines changed: 57 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -294,30 +294,66 @@ function initQuiz() {
294294
const form = document.getElementById('bihar-quiz');
295295
if (!form) return;
296296
const result = document.getElementById('quiz-result');
297-
const answers = {
298-
q1: 'bodh',
299-
q2: 'nalanda',
300-
q3: 'chhath',
301-
q4: 'patna',
302-
q5: 'valmiki'
303-
};
297+
const container = document.getElementById('quiz-questions');
298+
if (!container) return;
304299

305-
form.addEventListener('submit', function (e) {
306-
e.preventDefault();
307-
let score = 0;
308-
for (const [q, correct] of Object.entries(answers)) {
309-
const group = form.elements[q];
310-
if (group && group.value === correct) score++;
311-
}
300+
fetch('quiz_questions.json')
301+
.then(res => res.json())
302+
.then(questions => {
303+
renderQuizQuestions(container, questions);
304+
305+
const answers = Object.fromEntries(questions.map(q => [q.id, q.answer]));
306+
307+
form.addEventListener('submit', function (e) {
308+
e.preventDefault();
309+
let score = 0;
310+
for (const [q, correct] of Object.entries(answers)) {
311+
const group = form.elements[q];
312+
if (group && group.value === correct) score++;
313+
}
312314

313-
let message = '';
314-
if (score === 5) message = 'Incredible! You’re a Bihar Boss!';
315-
else if (score >= 4) message = 'Great job! Bhojpuri Bravo!';
316-
else if (score >= 3) message = 'Nice! You’re on the Patna path.';
317-
else if (score >= 2) message = 'Not bad! Keep exploring Bihar.';
318-
else message = 'Time to tour Bihar’s wonders!';
315+
let message = '';
316+
if (score === 5) message = 'Incredible! You’re a Bihar Boss!';
317+
else if (score >= 4) message = 'Great job! Bhojpuri Bravo!';
318+
else if (score >= 3) message = 'Nice! You’re on the Patna path.';
319+
else if (score >= 2) message = 'Not bad! Keep exploring Bihar.';
320+
else message = 'Time to tour Bihar’s wonders!';
321+
322+
if (result) result.textContent = 'You scored ' + score + '/5. ' + message;
323+
});
324+
})
325+
.catch(err => {
326+
console.error('Failed to load quiz questions:', err);
327+
if (result) result.textContent = 'Unable to load quiz. Please try again later.';
328+
});
329+
330+
form.addEventListener('reset', function () {
331+
if (result) result.textContent = '';
332+
});
333+
}
334+
335+
// Render quiz questions dynamically
336+
function renderQuizQuestions(container, questions) {
337+
container.innerHTML = '';
338+
questions.forEach((q, qi) => {
339+
const fs = document.createElement('fieldset');
340+
const legend = document.createElement('legend');
341+
legend.textContent = (qi + 1) + ') ' + q.question;
342+
fs.appendChild(legend);
343+
344+
q.options.forEach((opt, oi) => {
345+
const label = document.createElement('label');
346+
const input = document.createElement('input');
347+
input.type = 'radio';
348+
input.name = q.id;
349+
input.value = opt.value;
350+
if (oi === 0) input.required = true; // require a choice per group
351+
label.appendChild(input);
352+
label.append(' ' + opt.label);
353+
fs.appendChild(label);
354+
});
319355

320-
if (result) result.textContent = 'You scored ' + score + '/5. ' + message;
356+
container.appendChild(fs);
321357
});
322358
}
323359

bihar-culture-landing/tourism.html

Lines changed: 1 addition & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -38,40 +38,7 @@ <h2>Valmiki Tiger Reserve</h2>
3838
<section id="quiz">
3939
<h2>Quick Quiz: Bihar’s history, culture, and landmarks</h2>
4040
<form id="bihar-quiz">
41-
<fieldset>
42-
<legend>1) Where did Lord Buddha attain enlightenment?</legend>
43-
<label><input type="radio" name="q1" value="bodh" required> Bodh Gaya</label>
44-
<label><input type="radio" name="q1" value="rajgir"> Rajgir</label>
45-
<label><input type="radio" name="q1" value="vaishali"> Vaishali</label>
46-
</fieldset>
47-
48-
<fieldset>
49-
<legend>2) Which ancient university in Bihar is a UNESCO World Heritage Site?</legend>
50-
<label><input type="radio" name="q2" value="takshashila" required> Takshashila</label>
51-
<label><input type="radio" name="q2" value="nalanda"> Nalanda</label>
52-
<label><input type="radio" name="q2" value="vikramshila"> Vikramshila</label>
53-
</fieldset>
54-
55-
<fieldset>
56-
<legend>3) The festival where devotees worship the Sun God is:</legend>
57-
<label><input type="radio" name="q3" value="chhath" required> Chhath Puja</label>
58-
<label><input type="radio" name="q3" value="holi"> Holi</label>
59-
<label><input type="radio" name="q3" value="diwali"> Diwali</label>
60-
</fieldset>
61-
62-
<fieldset>
63-
<legend>4) The capital city of Bihar is:</legend>
64-
<label><input type="radio" name="q4" value="gaya" required> Gaya</label>
65-
<label><input type="radio" name="q4" value="patna"> Patna</label>
66-
<label><input type="radio" name="q4" value="muzaffarpur"> Muzaffarpur</label>
67-
</fieldset>
68-
69-
<fieldset>
70-
<legend>5) The wildlife reserve in West Champaran is:</legend>
71-
<label><input type="radio" name="q5" value="valmiki" required> Valmiki Tiger Reserve</label>
72-
<label><input type="radio" name="q5" value="kuno"> Kuno National Park</label>
73-
<label><input type="radio" name="q5" value="kaziranga"> Kaziranga National Park</label>
74-
</fieldset>
41+
<div id="quiz-questions"></div>
7542

7643
<div class="quiz-actions">
7744
<button type="submit">Submit</button>

0 commit comments

Comments
 (0)