Righteous Museum | Righteous Choices Game<\/title>\n <style>\n * {\n box-sizing: border-box;\n user-select: none;\n }\n\n body {\n background: linear-gradient(135deg, #1a472a 0%, #0e2a1a 100%);\n font-family: 'Comic Neue', 'Comic Sans MS', 'Chalkboard SE', 'Segoe UI Emoji', cursive, sans-serif;\n min-height: 100vh;\n margin: 0;\n padding: 20px;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n .game-container {\n max-width: 800px;\n width: 100%;\n background: #FFF8E7;\n border-radius: 60px;\n padding: 20px 20px 30px;\n box-shadow: 0 25px 40px rgba(0,0,0,0.3);\n text-align: center;\n }\n\n h1 {\n margin: 0;\n font-size: 1.8rem;\n background: linear-gradient(135deg, #c9a03d, #8b5e1f);\n -webkit-background-clip: text;\n background-clip: text;\n color: transparent;\n display: inline-block;\n }\n\n .subtitle {\n font-size: 0.95rem;\n color: #5a3e1b;\n margin-top: 5px;\n margin-bottom: 20px;\n }\n\n .stats {\n display: flex;\n justify-content: space-between;\n background: #e6d5b3;\n padding: 12px 25px;\n border-radius: 50px;\n margin-bottom: 25px;\n font-weight: bold;\n font-size: 1.2rem;\n }\n\n .stats span {\n background: #2c5e3a;\n padding: 5px 18px;\n border-radius: 40px;\n color: #FFD966;\n }\n\n .scenario-box {\n background: #e0c48b;\n padding: 25px;\n border-radius: 40px;\n margin-bottom: 25px;\n }\n\n .scenario-text {\n font-size: 1.5rem;\n font-weight: bold;\n color: #2c1e0a;\n line-height: 1.4;\n }\n\n .choices {\n display: flex;\n flex-direction: column;\n gap: 15px;\n margin-bottom: 25px;\n }\n\n .choice-btn {\n background: #D2B48C;\n border: none;\n padding: 15px 20px;\n font-size: 1.1rem;\n font-weight: bold;\n border-radius: 60px;\n cursor: pointer;\n transition: 0.1s linear;\n box-shadow: 0 5px 0 #6b4c2c;\n font-family: inherit;\n text-align: left;\n display: flex;\n align-items: center;\n gap: 12px;\n }\n\n .choice-btn:active {\n transform: translateY(2px);\n box-shadow: 0 2px 0 #6b4c2c;\n }\n\n .choice-btn.disabled, .choice-btn:disabled {\n opacity: 0.6;\n transform: none;\n cursor: not-allowed;\n }\n\n .feedback {\n background: #2c5e3a;\n padding: 15px;\n border-radius: 50px;\n margin: 15px 0;\n font-size: 1rem;\n color: #FFD966;\n font-weight: bold;\n }\n\n button {\n background: #c9a03d;\n border: none;\n padding: 12px 28px;\n font-size: 1.2rem;\n font-weight: bold;\n border-radius: 50px;\n color: #2c1e0a;\n cursor: pointer;\n transition: 0.1s linear;\n box-shadow: 0 5px 0 #6b4c2c;\n font-family: inherit;\n }\n\n button:active {\n transform: translateY(2px);\n box-shadow: 0 2px 0 #6b4c2c;\n }\n\n .victory-overlay {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: rgba(0,0,0,0.8);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1000;\n visibility: hidden;\n backdrop-filter: blur(4px);\n }\n\n .victory-card {\n background: #FFF8E7;\n padding: 30px 20px;\n border-radius: 60px;\n text-align: center;\n max-width: 350px;\n width: 80%;\n }\n\n .victory-card h2 {\n font-size: 1.8rem;\n margin: 10px 0;\n }\n\n @media (max-width: 550px) {\n .scenario-text {\n font-size: 1.2rem;\n }\n .choice-btn {\n font-size: 0.9rem;\n padding: 12px 15px;\n }\n .stats span {\n font-size: 1rem;\n padding: 5px 12px;\n }\n }\n <\/style>\n<\/head>\n<body>\n\n<div class=\"game-container\">\n <h1>\ud83d\udc3e RIGHTEOUS MUSEUM \ud83d\udc3e<\/h1>\n <div class=\"subtitle\">Righteous Choices \u2014 “What would a righteous hero do?”<\/div>\n\n <div class=\"stats\">\n <div>\ud83c\udf1f SCORE: <span id=\"scoreCount\">0<\/span> \/ <span id=\"totalQuestions\">5<\/span><\/div>\n <div>\ud83d\udccb QUESTION: <span id=\"questionNum\">1<\/span> \/ <span id=\"totalQNum\">5<\/span><\/div>\n <\/div>\n\n <div class=\"scenario-box\">\n <div class=\"scenario-text\" id=\"scenarioText\">\n A baby bird fell from its nest. What do you do?\n <\/div>\n <\/div>\n\n <div class=\"choices\" id=\"choicesContainer\">\n \n <\/div>\n\n <div class=\"feedback\" id=\"feedbackBar\">\n \ud83c\udf1f Make a righteous choice! Click one of the answers above.\n <\/div>\n\n <button id=\"nextButton\" style=\"display: none;\">\u27a1\ufe0f NEXT QUESTION<\/button>\n <button id=\"resetButton\" style=\"display: inline-block;\">\ud83d\udd04 PLAY AGAIN<\/button>\n<\/div>\n\n<div id=\"victoryOverlay\" class=\"victory-overlay\">\n <div class=\"victory-card\">\n <div>\ud83c\udf1f\ud83d\udc3e\ud83c\udf1f\ud83d\udc3e\ud83c\udf1f\ud83d\udc3e\ud83c\udf1f<\/div>\n <h2>YOU ARE RIGHTEOUS!<\/h2>\n <p id=\"victoryMessage\">You made kind and brave choices!<\/p>\n <button id=\"victoryResetBtn\">\ud83d\udc3e PLAY AGAIN \ud83d\udc3e<\/button>\n <\/div>\n<\/div>\n\n<script>\n \/\/ SCENARIOS DATA\n const scenarios = [\n {\n text: \"\ud83d\udc26 A baby bird fell from its nest. What do you do?\",\n choices: [\n { text: \"\ud83d\udc26 Gently put it back with help from an adult\", correct: true, feedback: \"Yes! Asking an adult is the righteous choice. The baby bird will be safe!\" },\n { text: \"\u274c Ignore it \u2014 it's not your problem\", correct: false, feedback: \"Not righteous. Every small creature deserves kindness.\" },\n { text: \"\ud83c\udfe0 Take it home as a pet\", correct: false, feedback: \"Wild animals need to stay in nature. The righteous choice is to help it return home!\" }\n ]\n },\n {\n text: \"\ud83d\ude22 Your friend is sad because they lost their toy. What do you do?\",\n choices: [\n { text: \"\ud83e\udd1d Share your toy and say kind words\", correct: true, feedback: \"Righteous! Sharing kindness makes everyone feel better.\" },\n { text: \"\ud83d\ude04 Laugh at them\", correct: false, feedback: \"Not righteous. A righteous hero comforts, not laughs.\" },\n { text: \"\ud83d\udeb6 Walk away and ignore them\", correct: false, feedback: \"Righteous heroes help friends who are sad.\" }\n ]\n },\n {\n text: \"\ud83d\udc15 You see someone being mean to a dog. What do you do?\",\n choices: [\n { text: \"\ud83d\udc6e Tell a trusted adult to help the dog\", correct: true, feedback: \"Righteous! Animals cannot speak \u2014 you are their voice.\" },\n { text: \"\ud83d\ude08 Join in\", correct: false, feedback: \"Never! Righteous people protect animals, not harm them.\" },\n { text: \"\ud83d\udeb6 Walk away\", correct: false, feedback: \"Walking away allows bad things to happen. Speak up or find an adult!\" }\n ]\n },\n {\n text: \"\ud83d\udc67 A new kid at school looks lonely. What do you do?\",\n choices: [\n { text: \"\ud83d\udc4b Invite them to play with you\", correct: true, feedback: \"Righteous! A simple invitation can change someone's whole day.\" },\n { text: \"\ud83d\ude48 Ignore them\", correct: false, feedback: \"Imagine how they feel. Righteous heroes include everyone.\" },\n { text: \"\ud83d\ude02 Make fun of them\", correct: false, feedback: \"That's hurtful. Righteous people build others up.\" }\n ]\n },\n {\n text: \"\ud83d\udcb0 You find money on the ground. What do you do?\",\n choices: [\n { text: \"\ud83d\udd0d Try to find the owner or tell an adult\", correct: true, feedback: \"Righteous! That money might be very important to someone.\" },\n { text: \"\ud83e\udd11 Keep it\", correct: false, feedback: \"Would you want someone to keep your lost money? Righteous people do the right thing.\" },\n { text: \"\ud83d\ude48 Hide it so nobody finds it\", correct: false, feedback: \"Hiding it is still keeping it. Try to return lost things!\" }\n ]\n }\n ];\n\n let currentQuestionIndex = 0;\n let score = 0;\n let answered = false;\n let gameActive = true;\n\n \/\/ DOM elements\n const scenarioText = document.getElementById('scenarioText');\n const choicesContainer = document.getElementById('choicesContainer');\n const feedbackBar = document.getElementById('feedbackBar');\n const nextButton = document.getElementById('nextButton');\n const resetButton = document.getElementById('resetButton');\n const scoreCountSpan = document.getElementById('scoreCount');\n const questionNumSpan = document.getElementById('questionNum');\n const victoryOverlay = document.getElementById('victoryOverlay');\n const victoryResetBtn = document.getElementById('victoryResetBtn');\n const victoryMessage = document.getElementById('victoryMessage');\n\n function updateUI() {\n scoreCountSpan.textContent = score;\n questionNumSpan.textContent = currentQuestionIndex + 1;\n }\n\n function loadQuestion() {\n answered = false;\n const scenario = scenarios[currentQuestionIndex];\n scenarioText.textContent = scenario.text;\n \n \/\/ Clear and rebuild choices\n choicesContainer.innerHTML = '';\n scenario.choices.forEach((choice, idx) => {\n const btn = document.createElement('button');\n btn.className = 'choice-btn';\n btn.innerHTML = `<span>${choice.text}<\/span>`;\n btn.addEventListener('click', () => {\n if (answered) return;\n if (!gameActive) return;\n handleAnswer(choice.correct, choice.feedback, btn);\n });\n choicesContainer.appendChild(btn);\n });\n \n feedbackBar.innerHTML = '\ud83e\udd14 Choose the righteous action...';\n nextButton.style.display = 'none';\n resetButton.style.display = 'inline-block';\n }\n\n function handleAnswer(isCorrect, feedbackMsg, selectedBtn) {\n answered = true;\n \n \/\/ Disable all choice buttons\n const allBtns = document.querySelectorAll('.choice-btn');\n allBtns.forEach(btn => {\n btn.disabled = true;\n btn.classList.add('disabled');\n });\n \n if (isCorrect) {\n score++;\n updateUI();\n feedbackBar.innerHTML = `\u2705 CORRECT! ${feedbackMsg} \ud83c\udf1f +1 point!`;\n \/\/ Highlight correct button in green\n selectedBtn.style.background = '#90be6d';\n } else {\n feedbackBar.innerHTML = `\u274c ${feedbackMsg} Let's learn and try the next one!`;\n selectedBtn.style.background = '#ffb3b3';\n \/\/ Also highlight the correct answer in green for learning\n const scenario = scenarios[currentQuestionIndex];\n const allChoiceBtns = document.querySelectorAll('.choice-btn');\n scenario.choices.forEach((choice, idx) => {\n if (choice.correct) {\n allChoiceBtns[idx].style.background = '#90be6d';\n }\n });\n }\n \n \/\/ Show next button\n nextButton.style.display = 'inline-block';\n resetButton.style.display = 'none';\n }\n\n function nextQuestion() {\n if (!answered) return;\n \n currentQuestionIndex++;\n \n if (currentQuestionIndex < scenarios.length) {\n loadQuestion();\n } else {\n \/\/ Game complete\n endGame();\n }\n }\n\n function endGame() {\n gameActive = false;\n let message = \"\";\n if (score === scenarios.length) {\n message = \"Perfect! You made ALL the righteous choices! \ud83c\udf1f\ud83d\udc3e You are a true hero!\";\n } else if (score >= 3) {\n message = `Good job! You made ${score} righteous choices out of ${scenarios.length}. Keep learning to be a hero every day! \ud83c\udf1f`;\n } else {\n message = `You made ${score} righteous choices. Every day is a chance to learn and grow kinder. Try again! \ud83d\udc3e`;\n }\n victoryMessage.textContent = message;\n victoryOverlay.style.visibility = \"visible\";\n }\n\n function resetGame() {\n currentQuestionIndex = 0;\n score = 0;\n answered = false;\n gameActive = true;\n updateUI();\n victoryOverlay.style.visibility = \"hidden\";\n loadQuestion();\n }\n\n \/\/ Event listeners\n nextButton.addEventListener('click', nextQuestion);\n resetButton.addEventListener('click', resetGame);\n victoryResetBtn.addEventListener('click', () => {\n resetGame();\n });\n\n \/\/ Initialize game\n loadQuestion();\n updateUI();\n<\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Righteous Museum | Righteous Choices Game \ud83d\udc3e RIGHTEOUS MUSEUM \ud83d\udc3e Righteous Choices \u2014 “What would a righteous hero do?” \ud83c\udf1f SCORE: 0 \/ 5 \ud83d\udccb QUESTION: 1 \/ 5 A baby bird fell from its nest. What do you do? \ud83c\udf1f Make a righteous choice! Click one of the answers above. \u27a1\ufe0f NEXT QUESTION \ud83d\udd04 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-788","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/pages\/788","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/comments?post=788"}],"version-history":[{"count":1,"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/pages\/788\/revisions"}],"predecessor-version":[{"id":789,"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/pages\/788\/revisions\/789"}],"wp:attachment":[{"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/media?parent=788"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":788,"date":"2026-04-22T16:09:42","date_gmt":"2026-04-22T16:09:42","guid":{"rendered":"https:\/\/museum.wiserighteous.org\/?page_id=788"},"modified":"2026-04-22T16:09:42","modified_gmt":"2026-04-22T16:09:42","slug":"righteous-choices-game","status":"publish","type":"page","link":"https:\/\/museum.wiserighteous.org\/index.php\/righteous-choices-game\/","title":{"rendered":"Righteous Choices Game"},"content":{"rendered":"\n

<\/p>\n\n\n\n\n\n\n \n \n Righteous Museum | Righteous Choices Game<\/title>\n <style>\n * {\n box-sizing: border-box;\n user-select: none;\n }\n\n body {\n background: linear-gradient(135deg, #1a472a 0%, #0e2a1a 100%);\n font-family: 'Comic Neue', 'Comic Sans MS', 'Chalkboard SE', 'Segoe UI Emoji', cursive, sans-serif;\n min-height: 100vh;\n margin: 0;\n padding: 20px;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n .game-container {\n max-width: 800px;\n width: 100%;\n background: #FFF8E7;\n border-radius: 60px;\n padding: 20px 20px 30px;\n box-shadow: 0 25px 40px rgba(0,0,0,0.3);\n text-align: center;\n }\n\n h1 {\n margin: 0;\n font-size: 1.8rem;\n background: linear-gradient(135deg, #c9a03d, #8b5e1f);\n -webkit-background-clip: text;\n background-clip: text;\n color: transparent;\n display: inline-block;\n }\n\n .subtitle {\n font-size: 0.95rem;\n color: #5a3e1b;\n margin-top: 5px;\n margin-bottom: 20px;\n }\n\n .stats {\n display: flex;\n justify-content: space-between;\n background: #e6d5b3;\n padding: 12px 25px;\n border-radius: 50px;\n margin-bottom: 25px;\n font-weight: bold;\n font-size: 1.2rem;\n }\n\n .stats span {\n background: #2c5e3a;\n padding: 5px 18px;\n border-radius: 40px;\n color: #FFD966;\n }\n\n .scenario-box {\n background: #e0c48b;\n padding: 25px;\n border-radius: 40px;\n margin-bottom: 25px;\n }\n\n .scenario-text {\n font-size: 1.5rem;\n font-weight: bold;\n color: #2c1e0a;\n line-height: 1.4;\n }\n\n .choices {\n display: flex;\n flex-direction: column;\n gap: 15px;\n margin-bottom: 25px;\n }\n\n .choice-btn {\n background: #D2B48C;\n border: none;\n padding: 15px 20px;\n font-size: 1.1rem;\n font-weight: bold;\n border-radius: 60px;\n cursor: pointer;\n transition: 0.1s linear;\n box-shadow: 0 5px 0 #6b4c2c;\n font-family: inherit;\n text-align: left;\n display: flex;\n align-items: center;\n gap: 12px;\n }\n\n .choice-btn:active {\n transform: translateY(2px);\n box-shadow: 0 2px 0 #6b4c2c;\n }\n\n .choice-btn.disabled, .choice-btn:disabled {\n opacity: 0.6;\n transform: none;\n cursor: not-allowed;\n }\n\n .feedback {\n background: #2c5e3a;\n padding: 15px;\n border-radius: 50px;\n margin: 15px 0;\n font-size: 1rem;\n color: #FFD966;\n font-weight: bold;\n }\n\n button {\n background: #c9a03d;\n border: none;\n padding: 12px 28px;\n font-size: 1.2rem;\n font-weight: bold;\n border-radius: 50px;\n color: #2c1e0a;\n cursor: pointer;\n transition: 0.1s linear;\n box-shadow: 0 5px 0 #6b4c2c;\n font-family: inherit;\n }\n\n button:active {\n transform: translateY(2px);\n box-shadow: 0 2px 0 #6b4c2c;\n }\n\n .victory-overlay {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: rgba(0,0,0,0.8);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1000;\n visibility: hidden;\n backdrop-filter: blur(4px);\n }\n\n .victory-card {\n background: #FFF8E7;\n padding: 30px 20px;\n border-radius: 60px;\n text-align: center;\n max-width: 350px;\n width: 80%;\n }\n\n .victory-card h2 {\n font-size: 1.8rem;\n margin: 10px 0;\n }\n\n @media (max-width: 550px) {\n .scenario-text {\n font-size: 1.2rem;\n }\n .choice-btn {\n font-size: 0.9rem;\n padding: 12px 15px;\n }\n .stats span {\n font-size: 1rem;\n padding: 5px 12px;\n }\n }\n <\/style>\n<\/head>\n<body>\n\n<div class=\"game-container\">\n <h1>\ud83d\udc3e RIGHTEOUS MUSEUM \ud83d\udc3e<\/h1>\n <div class=\"subtitle\">Righteous Choices \u2014 “What would a righteous hero do?”<\/div>\n\n <div class=\"stats\">\n <div>\ud83c\udf1f SCORE: <span id=\"scoreCount\">0<\/span> \/ <span id=\"totalQuestions\">5<\/span><\/div>\n <div>\ud83d\udccb QUESTION: <span id=\"questionNum\">1<\/span> \/ <span id=\"totalQNum\">5<\/span><\/div>\n <\/div>\n\n <div class=\"scenario-box\">\n <div class=\"scenario-text\" id=\"scenarioText\">\n A baby bird fell from its nest. What do you do?\n <\/div>\n <\/div>\n\n <div class=\"choices\" id=\"choicesContainer\">\n \n <\/div>\n\n <div class=\"feedback\" id=\"feedbackBar\">\n \ud83c\udf1f Make a righteous choice! Click one of the answers above.\n <\/div>\n\n <button id=\"nextButton\" style=\"display: none;\">\u27a1\ufe0f NEXT QUESTION<\/button>\n <button id=\"resetButton\" style=\"display: inline-block;\">\ud83d\udd04 PLAY AGAIN<\/button>\n<\/div>\n\n<div id=\"victoryOverlay\" class=\"victory-overlay\">\n <div class=\"victory-card\">\n <div>\ud83c\udf1f\ud83d\udc3e\ud83c\udf1f\ud83d\udc3e\ud83c\udf1f\ud83d\udc3e\ud83c\udf1f<\/div>\n <h2>YOU ARE RIGHTEOUS!<\/h2>\n <p id=\"victoryMessage\">You made kind and brave choices!<\/p>\n <button id=\"victoryResetBtn\">\ud83d\udc3e PLAY AGAIN \ud83d\udc3e<\/button>\n <\/div>\n<\/div>\n\n<script>\n \/\/ SCENARIOS DATA\n const scenarios = [\n {\n text: \"\ud83d\udc26 A baby bird fell from its nest. What do you do?\",\n choices: [\n { text: \"\ud83d\udc26 Gently put it back with help from an adult\", correct: true, feedback: \"Yes! Asking an adult is the righteous choice. The baby bird will be safe!\" },\n { text: \"\u274c Ignore it \u2014 it's not your problem\", correct: false, feedback: \"Not righteous. Every small creature deserves kindness.\" },\n { text: \"\ud83c\udfe0 Take it home as a pet\", correct: false, feedback: \"Wild animals need to stay in nature. The righteous choice is to help it return home!\" }\n ]\n },\n {\n text: \"\ud83d\ude22 Your friend is sad because they lost their toy. What do you do?\",\n choices: [\n { text: \"\ud83e\udd1d Share your toy and say kind words\", correct: true, feedback: \"Righteous! Sharing kindness makes everyone feel better.\" },\n { text: \"\ud83d\ude04 Laugh at them\", correct: false, feedback: \"Not righteous. A righteous hero comforts, not laughs.\" },\n { text: \"\ud83d\udeb6 Walk away and ignore them\", correct: false, feedback: \"Righteous heroes help friends who are sad.\" }\n ]\n },\n {\n text: \"\ud83d\udc15 You see someone being mean to a dog. What do you do?\",\n choices: [\n { text: \"\ud83d\udc6e Tell a trusted adult to help the dog\", correct: true, feedback: \"Righteous! Animals cannot speak \u2014 you are their voice.\" },\n { text: \"\ud83d\ude08 Join in\", correct: false, feedback: \"Never! Righteous people protect animals, not harm them.\" },\n { text: \"\ud83d\udeb6 Walk away\", correct: false, feedback: \"Walking away allows bad things to happen. Speak up or find an adult!\" }\n ]\n },\n {\n text: \"\ud83d\udc67 A new kid at school looks lonely. What do you do?\",\n choices: [\n { text: \"\ud83d\udc4b Invite them to play with you\", correct: true, feedback: \"Righteous! A simple invitation can change someone's whole day.\" },\n { text: \"\ud83d\ude48 Ignore them\", correct: false, feedback: \"Imagine how they feel. Righteous heroes include everyone.\" },\n { text: \"\ud83d\ude02 Make fun of them\", correct: false, feedback: \"That's hurtful. Righteous people build others up.\" }\n ]\n },\n {\n text: \"\ud83d\udcb0 You find money on the ground. What do you do?\",\n choices: [\n { text: \"\ud83d\udd0d Try to find the owner or tell an adult\", correct: true, feedback: \"Righteous! That money might be very important to someone.\" },\n { text: \"\ud83e\udd11 Keep it\", correct: false, feedback: \"Would you want someone to keep your lost money? Righteous people do the right thing.\" },\n { text: \"\ud83d\ude48 Hide it so nobody finds it\", correct: false, feedback: \"Hiding it is still keeping it. Try to return lost things!\" }\n ]\n }\n ];\n\n let currentQuestionIndex = 0;\n let score = 0;\n let answered = false;\n let gameActive = true;\n\n \/\/ DOM elements\n const scenarioText = document.getElementById('scenarioText');\n const choicesContainer = document.getElementById('choicesContainer');\n const feedbackBar = document.getElementById('feedbackBar');\n const nextButton = document.getElementById('nextButton');\n const resetButton = document.getElementById('resetButton');\n const scoreCountSpan = document.getElementById('scoreCount');\n const questionNumSpan = document.getElementById('questionNum');\n const victoryOverlay = document.getElementById('victoryOverlay');\n const victoryResetBtn = document.getElementById('victoryResetBtn');\n const victoryMessage = document.getElementById('victoryMessage');\n\n function updateUI() {\n scoreCountSpan.textContent = score;\n questionNumSpan.textContent = currentQuestionIndex + 1;\n }\n\n function loadQuestion() {\n answered = false;\n const scenario = scenarios[currentQuestionIndex];\n scenarioText.textContent = scenario.text;\n \n \/\/ Clear and rebuild choices\n choicesContainer.innerHTML = '';\n scenario.choices.forEach((choice, idx) => {\n const btn = document.createElement('button');\n btn.className = 'choice-btn';\n btn.innerHTML = `<span>${choice.text}<\/span>`;\n btn.addEventListener('click', () => {\n if (answered) return;\n if (!gameActive) return;\n handleAnswer(choice.correct, choice.feedback, btn);\n });\n choicesContainer.appendChild(btn);\n });\n \n feedbackBar.innerHTML = '\ud83e\udd14 Choose the righteous action...';\n nextButton.style.display = 'none';\n resetButton.style.display = 'inline-block';\n }\n\n function handleAnswer(isCorrect, feedbackMsg, selectedBtn) {\n answered = true;\n \n \/\/ Disable all choice buttons\n const allBtns = document.querySelectorAll('.choice-btn');\n allBtns.forEach(btn => {\n btn.disabled = true;\n btn.classList.add('disabled');\n });\n \n if (isCorrect) {\n score++;\n updateUI();\n feedbackBar.innerHTML = `\u2705 CORRECT! ${feedbackMsg} \ud83c\udf1f +1 point!`;\n \/\/ Highlight correct button in green\n selectedBtn.style.background = '#90be6d';\n } else {\n feedbackBar.innerHTML = `\u274c ${feedbackMsg} Let's learn and try the next one!`;\n selectedBtn.style.background = '#ffb3b3';\n \/\/ Also highlight the correct answer in green for learning\n const scenario = scenarios[currentQuestionIndex];\n const allChoiceBtns = document.querySelectorAll('.choice-btn');\n scenario.choices.forEach((choice, idx) => {\n if (choice.correct) {\n allChoiceBtns[idx].style.background = '#90be6d';\n }\n });\n }\n \n \/\/ Show next button\n nextButton.style.display = 'inline-block';\n resetButton.style.display = 'none';\n }\n\n function nextQuestion() {\n if (!answered) return;\n \n currentQuestionIndex++;\n \n if (currentQuestionIndex < scenarios.length) {\n loadQuestion();\n } else {\n \/\/ Game complete\n endGame();\n }\n }\n\n function endGame() {\n gameActive = false;\n let message = \"\";\n if (score === scenarios.length) {\n message = \"Perfect! You made ALL the righteous choices! \ud83c\udf1f\ud83d\udc3e You are a true hero!\";\n } else if (score >= 3) {\n message = `Good job! You made ${score} righteous choices out of ${scenarios.length}. Keep learning to be a hero every day! \ud83c\udf1f`;\n } else {\n message = `You made ${score} righteous choices. Every day is a chance to learn and grow kinder. Try again! \ud83d\udc3e`;\n }\n victoryMessage.textContent = message;\n victoryOverlay.style.visibility = \"visible\";\n }\n\n function resetGame() {\n currentQuestionIndex = 0;\n score = 0;\n answered = false;\n gameActive = true;\n updateUI();\n victoryOverlay.style.visibility = \"hidden\";\n loadQuestion();\n }\n\n \/\/ Event listeners\n nextButton.addEventListener('click', nextQuestion);\n resetButton.addEventListener('click', resetGame);\n victoryResetBtn.addEventListener('click', () => {\n resetGame();\n });\n\n \/\/ Initialize game\n loadQuestion();\n updateUI();\n<\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Righteous Museum | Righteous Choices Game \ud83d\udc3e RIGHTEOUS MUSEUM \ud83d\udc3e Righteous Choices \u2014 “What would a righteous hero do?” \ud83c\udf1f SCORE: 0 \/ 5 \ud83d\udccb QUESTION: 1 \/ 5 A baby bird fell from its nest. What do you do? \ud83c\udf1f Make a righteous choice! Click one of the answers above. \u27a1\ufe0f NEXT QUESTION \ud83d\udd04 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-788","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/pages\/788","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/comments?post=788"}],"version-history":[{"count":1,"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/pages\/788\/revisions"}],"predecessor-version":[{"id":789,"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/pages\/788\/revisions\/789"}],"wp:attachment":[{"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/media?parent=788"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}