{"id":23345,"date":"2026-01-11T14:27:49","date_gmt":"2026-01-11T07:27:49","guid":{"rendered":"https:\/\/survivalskills.vn\/?p=23345"},"modified":"2026-03-03T16:18:33","modified_gmt":"2026-03-03T09:18:33","slug":"text-based-rpg","status":"publish","type":"post","link":"https:\/\/survivalskills.vn\/en\/2026\/01\/11\/text-based-rpg\/","title":{"rendered":"Text Based RPG"},"content":{"rendered":"\n\n
\n \n
\n \n
\n
\n \n\n
<\/div>\n <\/div>\n
\n \n\n
<\/div>\n <\/div>\n
\n \n\n
<\/div>\n <\/div>\n
\n \n\n
<\/div>\n <\/div>\n
\n \n\n
<\/div>\n <\/div>\n <\/div>\n \n
\n
\n \n\n
<\/div>\n <\/div>\n
\n \n\n
<\/div>\n <\/div>\n
\n \n\n
<\/div>\n <\/div>\n
\n \n\n
<\/div>\n <\/div>\n
\n \n\n
<\/div>\n <\/div>\n <\/div>\n<\/div>\n \n\n
\n B\u00ecnh ch\u1ecdn b\u00e0i vi\u1ebft n\u00e0y | Rate this page<\/span>\n <\/div>\n <\/div>\n\n

Text Based RPG<\/p>\n\n\n\n\n\n\n\nInteractive Safety Scenario Template<\/title>\n\n<style>\nbody {\n font-family: 'Inter', sans-serif;\n background-color: #f0f4f8;\n color: #374151;\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 100vh;\n margin: 0;\n padding: 1rem;\n}\n\n#gameContainer {\n background: white;\n padding: 2rem;\n border-radius: 1rem;\n box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);\n width: 90%;\n max-width: 800px;\n}\n\n#sceneImage {\n width: 100%;\n height: 250px;\n border-radius: 0.75rem;\n margin-bottom: 1.5rem;\n object-fit: contain;\n border-top: 3px solid #2563eb;\n background: #f9fafb;\n}\n\n#storyText {\n font-size: 1.125rem;\n line-height: 1.75;\n margin-bottom: 1.5rem;\n}\n\n\/* Choices *\/\n#choices {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 0.75rem;\n}\n\n.choiceButton {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n padding: 0.75rem;\n border: 1px solid #e5e7eb;\n border-radius: 0.75rem;\n background: white;\n font-weight: 600;\n cursor: pointer;\n transition: all 0.2s ease;\n text-align: left;\n}\n\n.choiceButton:hover {\n border-color: #2563eb;\n transform: translateY(-2px);\n}\n\n.choiceButton img {\n width: 100%;\n height: 120px;\n object-fit: cover;\n border-radius: 0.5rem;\n}\n\n.choiceButton.correct-choice {\n background-color: #dcfce7;\n border-color: #22c55e;\n color: #166534;\n}\n\n\/* Feedback *\/\n#feedback {\n margin-top: 1.5rem;\n padding: 1.25rem;\n border-radius: 0.75rem;\n display: flex;\n gap: 1rem;\n align-items: flex-start;\n}\n\n#feedback.correct {\n background-color: #dcfce7;\n border: 1px solid #4ade80;\n}\n\n#feedback.bobby {\n background-color: #fee2e2;\n border: 1px solid #f87171;\n}\n\n#feedbackImage {\n width: 120px;\n height: 120px;\n object-fit: cover;\n border-radius: 0.5rem;\n flex-shrink: 0;\n}\n\n.hidden {\n display: none;\n}\n<\/style>\n<\/head>\n\n<body>\n\n<div id=\"gameContainer\">\n <img decoding=\"async\" id=\"sceneImage\" src=\"\" alt=\"Training Dummy\">\n <div id=\"storyText\"><\/div>\n <div id=\"choices\"><\/div>\n\n <div id=\"feedback\" class=\"hidden\">\n <img decoding=\"async\" id=\"feedbackImage\" src=\"\" alt=\"Feedback\">\n <p id=\"feedbackText\"><\/p>\n <\/div>\n<\/div>\n\n<script>\n\/\/ =====================\n\/\/ CPR DUMMY IMAGE PATHS\n\/\/ =====================\nconst CPR_IMAGES = {\n male: \"https:\/\/survivalskills.vn\/wp-content\/uploads\/2026\/01\/maledummy.png\",\n female: \"https:\/\/survivalskills.vn\/wp-content\/uploads\/2026\/01\/femaledummy.png\"\n};\n\n\/\/ =====================\n\/\/ CHOKING SCENARIO\n\/\/ =====================\nconst scenario = {\n steps: [\n {\n text: `Quang is at school with his friend Thao.\nThey are both eating beef noodle soup for lunch.\nThao is very hungry and eats too fast.\n\nOH NO!\nThao suddenly starts choking and cannot breathe.\n\nWhat should Quang do?`,\n image: CPR_IMAGES.male,\n choices: [\n {\n text: `Give abdominal thrusts`,\n correct: false,\n feedback: `Oops...\nThis isn't the first thing you should do.\nBack blows are safer and should be tried first.\n\nAbdominal thrusts are only used if back blows fail.`,\n buttonImage: CPR_IMAGES.male,\n feedbackImage: CPR_IMAGES.female\n },\n {\n text: `Slap her on the back`,\n correct: true,\n feedback: `Correct!\nBack blows can help dislodge food blocking the airway.\n\nUsing the palm of your hand, give firm blows between the shoulder blades.`,\n buttonImage: CPR_IMAGES.male,\n feedbackImage: CPR_IMAGES.male\n },\n {\n text: `Tell her to drink water`,\n correct: false,\n feedback: `Oops...\nThis is dangerous.\nWater can make choking worse by blocking the airway further.`,\n buttonImage: CPR_IMAGES.male,\n feedbackImage: CPR_IMAGES.female\n },\n {\n text: `Wait for her to stop choking`,\n correct: false,\n feedback: `Oops...\nChoking is an emergency.\nWithout help, the person can lose oxygen very quickly.`,\n buttonImage: CPR_IMAGES.male,\n feedbackImage: CPR_IMAGES.female\n }\n ]\n }\n ]\n};\n\n\/\/ =====================\n\/\/ GAME LOGIC\n\/\/ =====================\nlet currentStep = 0;\n\nconst storyText = document.getElementById(\"storyText\");\nconst sceneImage = document.getElementById(\"sceneImage\");\nconst choicesDiv = document.getElementById(\"choices\");\nconst feedbackDiv = document.getElementById(\"feedback\");\nconst feedbackImage = document.getElementById(\"feedbackImage\");\nconst feedbackText = document.getElementById(\"feedbackText\");\n\nfunction showStep(step) {\n const data = scenario.steps[step];\n storyText.textContent = data.text;\n sceneImage.src = data.image;\n choicesDiv.innerHTML = \"\";\n feedbackDiv.classList.add(\"hidden\");\n\n data.choices.forEach(choice => {\n const btn = document.createElement(\"button\");\n btn.className = \"choiceButton\";\n\n const img = document.createElement(\"img\");\n img.src = choice.buttonImage;\n btn.appendChild(img);\n\n const span = document.createElement(\"span\");\n span.textContent = choice.text;\n btn.appendChild(span);\n\n btn.onclick = () => handleChoice(choice, btn);\n choicesDiv.appendChild(btn);\n });\n}\n\nfunction handleChoice(choice, button) {\n feedbackDiv.classList.remove(\"hidden\");\n feedbackImage.src = choice.feedbackImage;\n feedbackText.textContent = choice.feedback;\n feedbackDiv.className = choice.correct ? \"correct\" : \"bobby\";\n\n document.querySelectorAll(\".choiceButton\").forEach(btn => {\n btn.classList.remove(\"correct-choice\");\n });\n\n if (choice.correct) {\n button.classList.add(\"correct-choice\");\n }\n}\n\n\/\/ Start\nshowStep(currentStep);\n<\/script>\n\n<\/body>\n<\/html>\n\n\n","protected":false},"excerpt":{"rendered":"<p>Text Based RPG Interactive Safety Scenario Template<\/p>\n","protected":false},"author":2846,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_mbp_gutenberg_autopost":false,"footnotes":""},"categories":[295],"tags":[],"class_list":["post-23345","post","type-post","status-publish","format-standard","hentry","category-unpublished"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/survivalskills.vn\/en\/wp-json\/wp\/v2\/posts\/23345","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/survivalskills.vn\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/survivalskills.vn\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/survivalskills.vn\/en\/wp-json\/wp\/v2\/users\/2846"}],"replies":[{"embeddable":true,"href":"https:\/\/survivalskills.vn\/en\/wp-json\/wp\/v2\/comments?post=23345"}],"version-history":[{"count":3,"href":"https:\/\/survivalskills.vn\/en\/wp-json\/wp\/v2\/posts\/23345\/revisions"}],"predecessor-version":[{"id":23747,"href":"https:\/\/survivalskills.vn\/en\/wp-json\/wp\/v2\/posts\/23345\/revisions\/23747"}],"wp:attachment":[{"href":"https:\/\/survivalskills.vn\/en\/wp-json\/wp\/v2\/media?parent=23345"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/survivalskills.vn\/en\/wp-json\/wp\/v2\/categories?post=23345"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/survivalskills.vn\/en\/wp-json\/wp\/v2\/tags?post=23345"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}